Inovcares
Project Overview
The Challenge
InovCares came to our UX team, concerned that their current webpage was not connecting to the correct audience, therefore lacking in consumer traffic.
The client believed that a website homepage that targeted their ideal users (Latinx and Black Woman) and included a clear message, would result in a user friendly platform where patients and providers alike, would feel welcomed, cared for, and delighted to use.
The Project Mission
Our mission is to re-design InovCares Webpage and tell a compelling story to connect with target audience (Latinx & Black Women).
Project Scope
Website Landing Page Re-design
Tools
Miro, Figma, Zeplin
Role
Lead UI Designer
Team
Team of 3
Duration
21 days
Deliverable
High Fidelity Prototype
Design Process
Define
Empathizing with InovCares Space
Our UX team felt it necessary to learn more about the virtual healthcare platforms on the market to better define what separates InovCares from the rest. InovCares has a strong backstory and helping users connect to that story could put InovCares on the healthcare map.
Defining our Users
Before we start our design for a human centered product, we must first know what type of human we are designing for. We collaborated with the stakeholders of InovCares to come up with a proto-persona to keep our audience in mind as we go through the design process.
Proto-Persona
A proto-persona is a description of the target users and audience of a product based on the assumptions of stakeholders.
*Click on image to magnify
Research
Heuristics Analysis
Heuristics Analysis is a review of the sites interface and comparing it against accepted usability principles. This is a way for us to determine focal points for our redesign.
We were provided a prototype site as a baseline for our Homepage redesign and that is what we used for Heursitcs analysis and user testing.
1
Learnability: Home button is the logo in the top left corner, which is where I thought it would be.
2
Learnability: These ios screenshots of “how it works” is far too small to see any detail. It does not show me how it works.
3
Poor accessibility: Nowhere on the page does it have a “sign up” button. Even when you click on the “Sign in” button, there is no “Sign Up” option.
4
Contrast Issues: The main image is too dark to see and the only social media button that is visible is FaceBook, but right next to it is instagram and LinkedIn. They are basically invisible.
1
4
3
4
2
*Click on images to magnify
Testing
We conducted moderated usability testing with the target users (from our personal network) on the existing site to confirm the clients concerns and help provide us in understanding what the site needed and didn’t need in the re-design.
Questions
-
Who would you say this website is for? Describe what about the page makes you think that.
-
What is the website for? What are you supposed to do on this website? Describe what about the page makes you think that.
-
InovCares is a preventative care platform for women, particularly Black and Latinx, that provides access to medical care from your smart phone. On a scale of 1 to 5, with 1 meaning strongly disagree and 5 meaning strongly agree, how would you rate the success of conveying this message?
-
Can you think of a digital product or service that primarily serves women of color? Describe how the product successfully communicates that they are primarily for women of color.
Research Synthesis
Site Purpose
Design for Target Users
Site Language
*Click on image to magnify
Affinity Mapping is a research synthesis technique to help sort through the answers from our testers and see if there are any common themes.
User Stories:
written from data gathered from the user testing answers.
"As a patient, I want easy access to professional care advice from all my interfaces."
"As a patient, I want to speak with a doctor or nurse live, and have the option to get a prescription fast."
"As a physician, I want to log in when I am available, so that I can help my patients live over chat or video."
"As a woman of color, I want to feel safe and cared for when discussing my health needs with a physician during our video visit"
Design
As our team was designing in Figma, we realized that one of the prominent user pain points was not being addressed. Is the site for patients? Providers? We decided that the best way to address this is to have 2 website landing pages.
Powerful hero images to express who the site is for
Attention grabbing hero copy
Copy about InovCares story, making a human connection
Copy to show how you, as a provider can benefit.
30 second video on how to get started on the app
Simple to read icons showing benefits
Easy to contact and download app
Tabs, like medical folders for some aesthetic fun
How are others liking InovCares?
*Click on image to magnify
*Click on image to magnify
Testing Round 2
These tests we did on our re-design. Again we tested users in our network that were Latinx and Black Women, so to get a more detailed look into what the targeted users are thinking. We used the same questions, to keep it consistent.
Insights
-
Testers could easily identify who the target audience was
-
Testers understood if the site was for a provider or for a patient
-
Testers did not agree with the color choices and felt like they could use a lift