Project Time: June-October, 2017 Role: Lead Product Designer
Project Goal: Integrate Salute’s technology platform with Weill Cornell Medicine’s EHS platform. It also includes redesigning the 400+ screen Microsoft Access legacy tool to a modern SaaS platform and making sure that this platform is intuitive, accessible, and usable to multiple types of users.
Stakeholder: Salute (Fitzroy Health)
Client: Weill Cornell Medicine
Existing Problems and Improvement Solutions:
1. Information Architecture
This is a legacy product, there were lots of new features needed. So lots of communications involved with the stakeholder to identify the correct user journey.
2. Navigation and Hierarchy
Integrating new features into the existing system while finding a balance between engineering effort and usability improvement. Finally, reduce the complexity for the end-users.
3. User Journeys
The platform needed to contain both desktop and mobile responsive versions but the user journeys of web and mobile were very different.
4. Visual Identity
For branding, this platform represents the end-users, but should also indicate that the technology is powered by Salute. So how to choose the branding colors was a discussion with the stakeholder.
Branding Mood Board
I started off with a mood board and incorporated the branding styles of Salute (client) and Weill Cornell Medicine (end user). Multiple design styles were presented but the final solution used Salute’s branding as the primary background and icon color, and Weill Cornell Medicine’s red as the primary highlight color. Other secondary colors came from mood board research.
The mode board research was as follows:
1. The image on the right was introduced to the client to represent several adjectives that represent the product emotionally.
2. Once the client approved, I began selecting images and extracted related colors.
3. Based on the image board, I was able to create six color combinations to introduce to the client.
4. After multiple iterations, the client chose the following style guide.
UI Kit and Layout Guideline
Icons I chose line icons for this product to look light, and 2px round corners as they are not only appealing but also having an affinity with people without losing the sense of professionalism.
The web interfaces are for users when they are doing the on-site inspections with a smartphone. It condensed lots of the functions.