Project Overview

This studio project was for a studio class IS 279 UXD during my graduate study in UCLA under instruction of Professor Boyden. It was an opportunity for the class to design an industrial project, and to help UCLA Student Health website serve the community better.

Team Member

Jennie Lee__ Project Manager

Lily Zhuo__ Client Partner

Hajar Azzam__ UI UX Designer

Ada Gu__ UI UX Designer

Edda Chan__ UI UX Designer

Darin Buzon __ UI UX Designer

Stakeholder

Amrit Nagra_ Director of Clinical Operations

Matthew Geddert_ Developer

David Beren_ Executive Director of Student Health

My Role

User Research, Research Deliverables, Wireframes

Project Kickoff

UCLA student Health & Wellness Center is a critical online service for students. It mainly deal with UCship insurance, Vaccine, and clinical appointments.

UCLA Student Healthy website has not been updated over a decade. It is currently facing a lawsuit due to the accessibility issue. As other UCLA websites are evolving into a more modern and consistent branding style, Ashe Center website, as a critical online service, needs to keep up with the bigger picture as well as improve its user experience.

• Critical online service for students.
• Website facing lawsuit due to accessibility problem.
• Did not updated in over a decade.

User ResearcH

Research Plan

A User Research Plan was created right after the meeting to layout the whole research process.

The team conducted email survey and google analytics research to gather quantitative data for the research. At the same time, email survey helped us to recruit further more for the qualitative research.

Quantitative ResearcH

Screening Survey

We collaborated with the UCLA Student Affairs IT Team (SAIT) on a user survey. After finalizing the survey design, the survey was released on the UCLA SAIT website.

We identified 56 people interested in the in-person research methods, and four people were able to participate in our two in person research sessions.

View full survey result here.

Quantitative ResearcH

Google Analytics

From Google Analytics, we were able to gather quantitative data collection regarding the following categories: Traffic, audience demographics, acquisition and behavior flow.

View the full report here.

ResearcH Synthesis

Quantitative Research Insights

Check out what I found out about the market.

🔍 Insight 01.

Top reasons to visit the website

28% Student who visit UCLA Student Health website for scheduling an appointment. 24.7% of them are trying to check informations about either immunization or vaccine.

🔍 Insight 02.

Information required the most

16% Of the student require to have obvious and direct button to the scheduling the appointment. 16% want to have easy access to the UCSHIP insurance.

🔍 Insight 03.

Acquisition

79.3% Users use Chrome through organic search to access the page. And most of them are from the mobile device.

🔍 Insight 04.

Californian & New Yorker

PeakTraffic comes beginning of each quarter. Most users are new users or occasional returning users.

Qualitative ResearcH

Usability Testing

We recruited 4 participants for the qualitative research through the surveys with compensation. In-person quantitative user research including usability test, followed by a in depth user interview.

The interview and usability testing is created base on the data from qualitative research. Most mentioned 6 simple tasks and 2 hypothetical scenarios were presented to participants.

View the full report here.

Schedule An Appointment

50% failure rate

Find UC SHIP Coverage

75% failure rate

Immunization requirements

50% failure rate

ResearcH synthesis

User Journey Map

Meet our user Amelia!

ResearcH Synthesis

User Pain Points

the team classify and synthesis the research informations together, and came up with three main user paint points.

🔍 Pain Point 02.

Most Needed Info

No student focus content hierarchy to help with usability. The most needed information buried under the pile.

🔍 Pain Point 01.

Accessible Navigation

User experience cognitive overload, too much information simultaneously, resulting in the user not being able to navigate the website.

🔍 Pain Point 03.

Branding

UCLA Health & Wellness Center website has not been updated in over a decade. It is not consistent with current UCLA branding.

Define & Ideation

Problem Statement

Define & Ideation

Brainstomring

How might we help the users to find the information more efficiently?

Define & Ideation

Goal Statement

Design

Information Architecture

The team conducted both open and close card sorting in order to understand what users’ point of view for the layout of the website.

🔓 Open Card Sorting

For the open carding sorting, we provided a stack of cards of current tab on the home page for user to classify, along with sticky notes to write the titles of different groups they sorted the cards under.

🔒 Close Card Sorting

After that, close card sorting session were conducted with another group of user with same stack of card and group titled with combination of current website main page name and the result of the open card sorting.

Design

Site Map

The existing site map has no structure. All the information are just cluttered on the homepage. After the result of card sorting activity came out, the team organized them in a proposed site map.

The proposed site map focusing on the hierarchy of the information architecture. It also involves some visual design decision making, for example, differentiating patient portal as a CTA from service and insurance as a sub page.

BEFORE

AFTER

Design

Style Guild

The design follows the UCLA brand guidelines to keep the consistent look and feel for UCLA brand. On top of that, the team developed components using the fundamentals elements to differentiate the portal from other UCLA website.

Checkout the full guideline here.

design

Hi-Fi Prototype

💻 Desktop

Homepage Re-design

User will be able to access the needed info through the organized information architecture and web page layout.

usability testing

Impact

The last round of usability testing on the prototype, since we did not have the whole flow redesigned, we compare the time user spend to find the information to measure the effectiveness.

84 sec ↑

Schedule An Appointment

72 sec ↑

Find UCSHIP Coverage

116 sec ↑

Immunization requirements

Retrospective

Takeways

🤝 Teamwork

Different design roles in the same team has different emphasize.

It was an interesting experience, instead of each team member trying to toggle with different design tasks, we developed coordinate roles like, client partners who mainly taking care of communication with the stakeholders, and project manager who keep track of the timeline.

💻 Design Testing

Usability testing Key performance indicator needs to be consistent.

Instead of using failure rate to measure how hard it is for user to complete the task in the beginning, later we realized due to the constraints of time and scope, we can only redesign the homepage, which made us change the KPI to time on completing the task.

Process Deck

UCLA Student Health & Wellness Center

Homepage Re-design