COVER INSURANCE WEBSITE
Public Website & Intranet
"Cover Insurance Brokers, one of the leaders in the Greek insurance market, after its recent expansion is going through transformation from B2C to B2B aiming to expand its agents network and attract international collaborators."
My Tasks
Project Management
Architecture & Content Strategy
UI/UX Design
Branding
Visual Design & Illustrations
Prototyping
Production Support
Case Study
Cover Insurance Brokers (2017)
My Role
I took on the design strategy for the company’s new website; make its overall experience engaging and structure its information so that it addresses its target audience effectively. I also redesigned the company’s intranet to make it responsive and increase its functionality. For the full design life-cycle I started from rebranding (logo/color palette) all the way until finally managing the development and release stages.
Architecture & Content
After discussing with executives about the company's short and long-term goals, and what they wanted to achieve through the new website/intranet, I designed the information architecture and presented the Sitemap. Preliminary sketches to help illustrate the proposed page sections were also created; setting the ground for the later UI/UX design. In parallel, the content (texts) was gathered and processed collaboratively by both the design and management sides.
The Sitemap depicting the final Information Architecture that was presented to the management team
Preliminary sketches used to illustrate proposed page sections
The Content processing was done through Google Docs - the website's first version was in Greek language which will later be translated to English and other languages
Rebranding
The brand's main color was changed, adopting a warmer hue. A new color palette was also created.
The slide with which I presented the color change and the accompanying color palette
The final color palette covering all the needs of the website's user interface and experience (text, buttons, actions, secondary etc)
UI/UX & Visual Design
In the visual design part, aside from photos, I used illustrations which I designed in Sketch. When a group of visual elements (colors, styles, images, illustrations etc) was finished, it was being integrated to the wireframes; until finally creating a fully equipped high-fidelity prototype.
Example of the 2D Graphics that were created in Sketch
The wireframes, after adding the styles and content (texts)
Wireframes from different stages of the design process added side-by-side to illustrate the progression
Development
After the design and prototyping stages; detailed guidelines for all interactions and plugin proposals were shared with the development team. The public website was developed on Wordpress, whereas the Intranet was developed entirely using custom code. A "development prototype" was built and made perfect until was finally published to the company's main domain. The production and release stages were coordinated using Trello app.
Example of a wireframe as seen through Zeplin app (used to hand in technical UI specifications to developers)
Feedback exchange on the Trello board that was created for the coordination of the development & release stages