BACKGROUND
InovCares is founded by Mohamed Kamara who suffered a family tragedy that propelled him to revolutionize chronic care management to inspire mindful health and fitness decisions. As well as connecting customers to culturally-relevant wellness coaches and doctors, creating a community to collaborate with others, gamifying wellness goals through rewards.
The client is looking to create an MVP website that shares the founder’s story and incorporates the ability to download existing provider and patient mobile applications. The client still wants to maintain certain aspects of their current website; podcast, and informational video.
TIMELINE
3 months
ROLE
UX/ UI Designer, UX Researcher, Team Lead
TOOLS
Pen & Paper, Miro, Figma, Draw.io, Photoshop, Illustrator
MY ROLE
My role was the team Lead UX/UI designer for this project. I led two other designers, and we worked closely with the CEO. My focus was organizing workshops, facilitating meetings, and designating tasks for the team; I was the project's primary contact. I contributed to the research by interviewing potential patients and member providers, delivering high-fidelity prototypes, and finalizing responsive screens for development handoff in this project.
▹
DISCOVER
THE RESEARCH:
We propose user research to discover the best methods to incorporate the founder’s story and highlight the focus of the mobile applications. This would then be followed by a user-centered design process to create a web experience that empowers LatinX and women of color to take charge of their health and wellness.
METHODOLOGY
Competitive Analysis:
The objective is to analyze top telehealth websites available to users of InovCares in order to identify what competitors are doing well that InovCares is not.
Our team compared and contrasted the visual features, the layout of the onboarding, general experience, and UI of the following competitors:
Key Findings:
Images on top of competitors' web pages were pleasing and inviting.
Competitor sites had clear, concise landing page explanations.
Competitors had compelling colors and photos with links.
Simple and clear navigation process.
Register / Sign
Heuristic Analysis
A heuristics analysis, using LEMERs, was conducted to provide us with some insight into the usability of the client's current website. There were some major changes that were needed and some were minor aesthetic adjustments. Recommendations suggested for what should be prioritized.
Recommendations
Make call-to-action buttons clear
Customize each site for each user.
Clarify the downloads are only for mobile sites
Personas and User Journey
For this project, we needed to use two personas, because we had two primary target audiences. One is the patient and one is the provider and we wanted to show the two perspectives when viewing InovCares's website. We honed in on the patient as the default landing page.
▹
DEFINE
What's the problem?
From our research and hours of deliberation, we honed in on the patient as our main focus. The main problem became:
"I am a woman of color trying to access a culturally sensitive doctor who understands my unique cultural experiences. When searching, I cannot find information that offers those insights, which makes me feel stressed, confused, and unheard."
The current website was not catering to the client's target audience and the download app rate was declining. How can we change this?
▹
DESIGN
IDEATION:
We wanted to show two different sides of the website that caters to the patient, where it is inviting and how it benefits the patient, and for the providers, where its focuses on benefits for their practice. Our constraints were just keeping with the brand colors and being reactive for where ever the user will be interacting with the site whether laptop or mobile.
Original Website
↓
→
Provider Home Screen
USABILITY TESTING AND ITERATIONS:
I conducted a few usability tests and here were our findings and our iterations.
Download button was not clear as to what the user was downloading and the user did not see the value to download the app right away. We decided to change the micro copy.
The decision to use APIs for capturing the customer's name and phone number to get more information on the customer and deliver the appropriate app ensures the continuous flow from interacting on the web to the download of the application on mobile.
→
Given another opportunity to enable the download of the app, and made some minor UI changes on the footer ensures visibility of the application.
↓
▹
DELIVER
PROTOTYPES
Check our Figma prototype HERE
WHAT'S NEXT
Recommendations:
Upon completion of the redesign, there were action items that were recommended to the client to be addressed to make the experience a more usable design.
Get high-quality images for your podcasts of real doctors. Set aside a budget for high-quality photos for the website.
Integrate the web application sign-in into the landing pages for existing customers to log in.
Update phone applications to reflect values and target audience.
REFLECTION
What did I learn? 🤔
APIs are a game-changer for me, in this project. It would make the developer's workload easier and save time in the development stages. The utilization of the API to acquire user information increased the engagement of their target user. InovCares was able to follow up on their user after they have downloaded their telehealth app.
