I joined the innovation team at Verve to help bring a brand new digital web-based product to live.
Hired as a digital design lead, I was responsible for delivering the best user experience for the end-user as well as art and visual direction. The main focus of the project was to deliver a design system, for future adaptation.
Here is how I approached it:
Setting up the design foundations.
To provide pixel-perfect execution it was crucial to spend significant time on setting up solid, future-proof design foundations.
Elements like column grids, vertical tempos, and breakpoints have been carefully crafted to cater to a wide variety of usage as well as adaptation for multiple scenarios in the future. The spacing system has been developed to solidify the user interface and help with visual rhythms. 
I worked closely with full-stack developers to ensure alignments with the frameworks used.
Preparing art direction.
Multiple mood boards have been presented to the stakeholders in order to make decisions about look’n’feel of the product.
It is crucial to get basic visual elements like shapes and colours decided upon early to ensure that stakeholders are satisfied with the way the product looks. I have also prepared a selection of fonts for the stakeholders to choose from. 
This helped with choosing what direction to take when designing UI elements and therefore full layouts.
Rapid prototyping and atomic design system
I started designing specific sections of the product according to the specifications and user stories. I prepared the designs in the form of click-through prototypes. Interface elements were simultaneously added to the design system with the atomic approach. 
Setting up a global design system allowed me to make system-wide changes quickly during the iteration process. It also allows for easy white-labeling the product for future business use.
Rapid prototyping allowed for quick usability testing and reiteration.
Modern design tools like Sketch and Zeplin allowed me for flawless delivery of the layouts and design system to the development team. 
I worked closely with the dev team to ensure a smooth
design-into-code transition.
I also performed design QA on the developed product to make sure it met the design specifications.

You may also like

Back to Top