Creating High Fidelity Prototyping
Protiviti’s UX team provided the wireframes for this project. Protiviti was hired by Alcon.com to build an intranet site using Office 365 as the platform. Protiviti’s UX team produced the wireframes and they contacted me to provide the high fidelity mockups. I was tasked to provide them with 3 versions: Desktop, tablet and mobile.
Consistently integrate Alcon’s branding throughout the different elements in the design. The intranet design should be an extension of their brand. It was critical to fully understand Alcon’s brand and design an experience that tells the story of that brand.
My Design Process
Online meeting with Protiviti’s UX team. They walked me through the wireframes and shared their findings when they met with Alcon.com. This includes familiarizing myself with Alcon’s Branding Guidelines.
Brainstorming ideas and trying out different design approaches based on learnings from discovery and getting to know Alcon’s branding guidelines.
To create the mockups I dive into details to provide the wireframes the personal touch. Incorporating Alcon’s identity package: photos, colors, fonts, logo, etc.
Provide a highly detailed dynamic version of the mockups to demonstrate various user scenarios.
Presenting the prototype to Protiviti’s UX team to receive feedback.
Make revisions on the design based on user feedbacks.
Incorporate the final changes to produce the final, approved design.
Produce design specs, gather all the assets and write documentation for the developer.
The goal of this project is to make sure I’ve gone through the brand guidelines from start to finish, and have a clear understanding of the look and feel of the existing brand before starting the project. At the same time, I did not want the brand guidelines to limit my creativity - finding the right balance was key.
I asked questions as soon as possible when there’s something I didn’t understand. Brand guidelines can be incredibly technical. There are no stupid questions when it comes to understanding brand guidelines.