Zing.co was a company website redesign project I completed late 2014. I worked directly with the CEO of the startup to design a new version of their main product website in the point-of-sale software industry. The website goals were to 1) show the Zing brand was a modern and reputable software provider 2) explain the benefits and features of the software 3) provide a clear and easy signup process.
The Design Process
- Branding Discovery
- Wireframes and Copywriting
- Design Directions
- Visual Mockups
- Front-end Development
Below are deliverables created for each phase of the project starting with the final designs and working backward though the process.
We decided to go with a front-end framework in order to speed up the development process and ensure updates where quick and easy. We used the Design Modo Startup Framework which came with dozens of interchangeable HTML/CSS layout elements that were responsive and retina ready. The framework had the flexibility for me to customize the look enough to offer multiple unique design options.
Back Office Page
Once the wireframes were completed, this then gave us a good idea of the content elements that were going to be on the page. I then made rough mockups in Photoshop of different visual directions. Below are a few examples of the rough concepts I presented when discussing different directions with the client.
Wireframes and Copywriting
Download all wireframes in PDF or see 2 primary pages below.
The project goal was to create a very modern visual style and messaging that said “top tear software”. I started off with a competitive analysis which consisted of a feature comparison table and messaging summary of competitors in the space. We used these assets when deciding which features to promote, write our initial copy and set ourselves apart from the competition.