Visual redesign and institution of detailed visual language of the application.
analysis of graphic principles, workflows and frameworks, moodboards, design system, evaluation process, participation in the creation of the CSS/HTML component library with styleguide, implementation review
More detailed description avaliable at my blogpost.
Inconsistent UI was not helping the learning process and was a problem for the Kentico development team as well, since there was old markup and no design patterns. Moreover, the old-fashioned look and feel cost our sales representatives several important leads.
Example of old UI in the Pages application.
Example of old UI in the WebAnalytics application.
Example of old UI in the Newsletter application.
Everybody had their own idea how the new UI should look like and the moodboard helped us to reduce innumberable options of approaches to final one. It is based on three previous variants and was evaluated with the stakeholders. Thanks to moodboard everybody was on the same boat from the beginning of the visual redesign.
Graphic rules were instituted into every building block throughout the system, e.g. skeuminimalism, text as interface, accesible colors, etc. Main motto of the visual redesign was The best design is invisible.
The reserach revealed that our development workflow had to change completely as well, since not only aesthetic but also development trends have radically changed over the past few years. Style Tiles aprroach helped us to deliver the graphics in 12 weeks from the research to the deployment of the HTML/CSS component library.
Semantic differential was held to obtain relevant results and avoid any non-conclusive statements. The feedback was gathered at our Kentico Connection conferences in Boston, Sydney and London.
Just the Style Tiles were evaluated, then adjusted according to the feedback and completed already in a browser via HTML/CSS.
The goal was to have dynamic visual representations of components that would be available from any browser, so developers could see the code and designers could adjust the behavior or look right via HTML/CSS.
Moreover, it also maintained a joint vocabulary among all people around the project. Later we added styleguide rules in order to help developers and designers to make consistent decisions.
Meet me on my social networks.
Or say hello in person on my trips where I love to take Instagram pictures. You can also join me on a streetball court and shoot a few hoops with me and my friends.