JVMC Client Redesign

Joan Viteri Memorial Clinic (JVMC) is a UC Davis School of Medicine Student-Run Clinic that provides free unbiased healthcare services to individuals in the Oak Park area of Sacramento, CA who use intravenous drugs, work in the sex trade, or identify as transgender, as well as to their families. JVMC is serviced by UC Davis undergraduates, medical, PA, NP students and the generosity of physicians.

Duration: October 2024 - Present

Team: 6 designers, 2 design leads, developer team

My Role: UX Researcher, Product Designer for Community Partners page, gave feedback & criticism on other designer’s pages, Graphic Designer

Tools: Figma

The Problem

The current JVMC website lacks detail, cohesion, organization, and a welcoming theme.

Things that could be improved on:

readability
Cohesive design system

Things that could be improve on:

Welcoming/professional look
Information organization
Color palette

Pain Points

Four Major Pain Points

more descriptive
text & headers

more cohesive
design system

more organized layout and page flow

more friendly
website design

The Solution

Fixing Pain Points

cohesive design system throughout site
Improved readability

Improved information organization through built in calendar
Improve color palette

Competitive Analysis

Competitors like the American Red Cross effectively tackled JVMC’s key issues.

User Personas & User Flows

JVMC’s target audiences are patients and volunteers.

Patient User Persona

Patient User Flow

Volunteer User Persona

Volunteer User Flow

Low-Fidelity and Mid-Fidelity Wireframes

Major Changes Throughout The Ideation Process

User Testing

Users generally liked the New Changes

I conducted usability testing with four target users to gain insights about both my individual page and the flow of the website as a whole. I asked them general questions about how the felt about the website and then gave them tasks to do such as “find the mission statement” to help me gain insights on how users moved throughout the website and how they felt about it.

Positive Feedback

generally looks clean
the drop down shadow on the card looks nice
liked how the card alternated photos and text
information was easy to locate
icons were effective for scalability
enjoyed the textual hierarchy, made it scannable

Negative Feedback

unclear about the services offered by each partner
felt that the website looked “oversized” and claustrophobic with how large the was and how small the margins were

High-Fidelity Iterations

Polishing the feel and clarity of website

Utilizing the information from user testing, I made the appropriate edits & some extra edits from my design lead' and design team’s feedback

Design System

Our Design System improved the website's consistency

This design system was created based on our client's requests for the website's look, with adjustments made by my design team and I.

Custom Graphics

My Graphics improved the website’s welcoming theme

I created vector graphics of a teddy bear on Adobe Illustrator. The stethoscope reinforces the medical theme, and the rainbow heart helps incorporate the design system for cohesiveness and reinforces that the clinic’s target users are underrepresents groups such as LGBTQ groups. This teddy bear was added to the hero image of the landing page.

Final Product

See for Yourself!

Reflection

Journey in Review

Earlier User Testing: My user testers had a lot of feedback regarding the overall website’s information organization. If I were to do this again, I would have conducted user testing earlier to allow myself enough time ot speak with JVMC and present the user testing feedback to them to ask them if we can make these changes to their original website.
Better Team Communication: Because each of my design team members were responsible for their own individual pages, we had a lot of differing ideas on how to present the information on the page. Even though our pages were cohesive with in and of itself, we had to make later changes to make them cohesive with each other. Proper communication about design decisions could have made our progress more efficient

What I would do better next time

Next Steps

Web Development: My team and I have recently presented our design to the tech team during our tech handoff day. We are currently waiting for the tech team to pair each designer with a developer to start developing the pages to be fully functional
Client Hand-Off: After developing the website, we will be presenting our designs and the finished product to JVMC to launch as their official website.