© 2019 by Marie.

Creating High Fidelity Prototyping

UI Design

Introduction

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.

Challenge

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 Contribution

Tools Used

Discovery
UI Design
Iterations
Communication

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.

Discovery
Discovery

Brainstorming ideas and trying out different design approaches based on learnings from discovery and getting to know Alcon’s branding guidelines.

Ideation
Define

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.

Mockups
Define

Provide a highly detailed dynamic version of the mockups to demonstrate various user scenarios.

Prototyping

Presenting the prototype to Protiviti’s UX team to receive feedback.  

User Feedback

Make revisions on the design based on user feedbacks.

Iteration
Define

Incorporate the final changes to produce the final, approved design.

Final Design
Define

Produce design specs, gather all the assets and write documentation for the developer.

Developer Handoff

Wireframes

Design

Summary

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.