Steve, the Client, is a very experienced software engineer, entrepreneur and business consultant from Arizona. His business, AllThingsWWW, focuses around building website presence for other business owners. I’ve been brought in as a designer on the team, with a first task of redesigning AllThings website itself.
The main goals I needed to keep in mind were:
1) Keeping the website extremely fast to load and easy to navigate
2) Coming up with a design that clearly shows what the AllThings services are about
3) Creation of MVP design that can quickly be put to use
Starting the process, I narrowed down the typography, color palette and imagery that would be used across the website.
I worked closely with a copywriter in order to determine the content structure of the site, as well as with Steve himself to determine what parts he feels are most important for his business.
Part of the challenge was to make the site look appealing and interesting, so I thought about where to add some simple interactions and animations that wouldn’t make the site work slower.
Overall, the site took the old blue-inspired color scheme and while I kept the waves, I made them look a bit more unique.
In the end, knowing this project is a long-term and daunting task, we created the “minimum viable product” version that lacks some of the animated effects and in-depth information, but it hosts basic information about the AllThings business and ways of contact.
Process-wise, I thought a lot about the entire planned structure and how the hierarchy for all of the different componets should be established.
For the most part, we have been testing the site internally between developers and copywriters, through the Figma prototype screens.
At the end, I’ve created a prototype using Maze platform, that a project manager from AllThings can then use to test with potential users and get direct feedback. This project is still in progress, but the team is confident it’s on the right track for future needs of the business.
For wireframing and design: Figma
For developer handout: Figma
For prototyping and testing: Figma, Maze
For asset edits: Affinity Designer, Affinity Photo