Zabal Media's Fresh Take on MileIQ
The company was previously acquired by Microsoft in 2015. The founder of the company reached out to us to bring a new / fresh look to the brand and website design. There were many elements of the brand that remained relevant, but overall, they needed a complete redesign and migration to Webflow as their main CMS.
Understanding the business
Business Goals
MileIQ was already an established brand with millions of active users using the app. The intention behind the project was to bring the ux/ui of their website to the next level, while maintaining the same clean colors and strong typography presence that their users recognized.
Business challenges
The previous company website was not built in a scalable way. This fact made it extremely difficult to make any updates on the website without breaking things in the process. Lastly, their branding had been stagnant for over 4 years and required a refresh to look more modern.
Asking the right questions
Research goals
How might we take the MileIQ brand that has a well established audience and improve upon it without pushing the brand past the point of not being recognizable by their current userbase?
Accessible
From the first call with the founder, we learned that accessibility was key for the brand to succeed. Their branding was not accessible.
Reliable
The website experiences needed to personify how users can always trust the product to be useful and accurate with mile tracking.
Beautiful
We needed to include elements from their beautiful user interface all through the website to ensure that users knew that this is a product company at scale.
Enterprise
Their product was enterprise ready “for teams” and needed to have the multi-user look and feel to attract a larger userbase that will increase adoption organically.
Interface inspirations
Creative direction
Streets, paths, highways, etc. These were all key words that set the tone for the new visual design direction. We also reviewed their competitors websites to identify what was working and what was not.
Creating the systems
Creating for scalability
We architected the design and development environments in a scalable way that can easily be maintained by their marketing team & designers.
Once the framework was built out, we were able to quickly build new landing pages for the MileIQ team. We also trained them so that they can make edits on their own.
Mile IQ - Sitemap & Back-end architecture
Exploring solutions
Visual design guidelines
Colors
Lato
Redesign vs. Rebrand
We did not rebrand MileIQ, we simply took their current colors, typography, and visual guidelines and polished them to be more modern and sophisticated.