WHAT IS THIS PROJECT?
This is an internal web tool for CVS data scientists that helps them better understand patient data so that scientists can forecast and propose solutions across cvs enterprise.
WHAT WAS MY ROLE?
•Conceptualization, wireframing, prototyping, detailed design.
•Reach out to internal partners to learn more about this domain.
WHAT WERE SOME CHALLENGES?
•Limited domain knowledge of data scientist within CVS.
•Difficulty accessing the right partners to verify the customer journey map.
•Design system components were not centralized which made it time consuming to identify and leverage correct components. I solved this by proactively attending design system meetings to gather team feedback, iterate, and execute.
PRODUCT REQUIREMENTS
•Design a landing page to introduce the experience.
•User needs to be able to "safe a draft for later" as an option.
•User can select multiple data sources from the dropdown.
•User should be able to use a "search" functionality.
WHAT DID THE FIGMA PROTOTYPE ACOMPLISHED?
•I learned that we didn’t know what the dropdown options would be. Thus I proactively asked product owner about it.
•I felt some form fields could be pre-filled such user location and e-mail to allow our user to move faster so I asked engineering if they can do that.
•Leveraged the CVS Design system by using the updated progress indicator. The design systems team pushes new components
to the figma library. I learned to periodically update my figma components library.
INTERACTION DESIGN APPLIED PRINCIPLES
•PERCEPTION: I wanted user to perceive that the logos on landing page were not clickable so I turned them gray.
•FEEDBACK: The website “talked” to users by providing error messages and loading screens. I partnered with content strategy for tone of messaging.
We structed the navigation in a hierarchy we thought it was effective. For instance, we placed the “save draft” at very top right while deprioritizing the “back” button to the bottom.
DETAILED DESIGN
•Ensured I followed design system for consistent header sizes, margins, and grid.
•I used a 12-grid system and I felt offsetting it could result in a nice centered layout more organized.
•Ensured design was optimized for mobile screens. For instance, switched margins from 40px for desktop to 16px for mobile. Also applied correct text link weights, top navigation branded banner, and designed all the states for the “search” field experience.