Vaden Patient Portal Re-Brand

For: Stanford University

Class: DESIGN 141 - Product Design Methods

Quarter: Winter 2023

Length: 4 Weeks

Tools: Figma

Skills: User testing, heuristic evaluations, UX/UI mock-ups, wire-frame creation, brand updating

Type: Team Project

Why?

Redesigned the Vaden Patient Portal using Figma wireframes and paper prototype user testing to improve usability, navigation flow, and overall intuitiveness.
Maintained Stanford’s brand identity while refreshing the visual design to be more engaging, user-friendly, and lively.

Final Figma Wireframe: Ulises Medina

Identify Problem and Users

Flow Diagram

Flow Diagram: Caelan Koch and Liv Alyn

Paper Wireframe Prototyping

Heuristic Evaluations: Caelan Koch and Abby Romo

Wireframe Redesign

Old design

Multiple pages
Lots of confusing selections

Wireframe Redesign: Team Effort

User Testing

Make Text Bigger

Difficult to read/see text

“I have to squint to read it” - Mathi

Turn little boxes into taking up the entire page

No need to restrict our space, makes it difficult to navigate / read

Add checkpoints to the progress bar; make it clear it’s changing

No one noticed it; needs to grab attention

Add explanation for or remove skip function

“It’s not clear what you’d use it for” - Natalie

Our home page was set up well in that the most important tasks were right in front of you to click on

“Pretty easy to find all tasks” - Natalie

“Flow through the website worked well” - Natalie

“The home page is a good standard design for a lot of websites” - Viruni

User Testing: Team Effort

Final Design & Best Features

Toolbar with clearly labeled selection choices

Text box to further explain medical issue

Multiple selections on one page to reduce unnecessary steps

Back button to easily navigate through process

Progress bar for status visibility

Layout/theme matches existing Stanford websites

Paper Wireframes: Caelan Koch, Ulises Medina, Liv Alyn

The Vaden Patient Portal is an essential tool for Stanford students (user) to schedule appointments, contact healthcare providers, and upload medical information, among other health-related tasks. The current website is confusing and hard to navigate.

Original/Current Vaden Patient Portal Design