Inovcares

Macbook Pro.png
InovCares%20HomePage_edited.jpg

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.

InovCares Project (2).jpg

*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

Heuristics Analysis 1.png
Heuristics Analysis 2.png

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. 

LaptopAngleImage.png

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
InovCares%20Project%20(3)_edited.png

*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. 

1stDraft_InovCares HomePage.jpg
1stDraft_InovCares Patient Portal Page.j

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

Style Guide

Style Guide InovCares Landing Pages.jpg

Deliver

 

High-Fidelity Prototypes

Please scroll at your leisure

Macbook Pro.png
Macbook Pro.png

THANK YOU