Project Specs
2020・2 wks・Mobile AppMy Role
Product Design・UI Design
Programs
Adobe XD
Tags
Wireframe & Design・Prototyping・
Student Innovation Lead・BU Spark
Overview
PatientEval is a clinical assessment app that helps students practice real life doctor-patient situations. It sets out to assist medical students in understanding how to diagnosis an illness, what key questions to ask, and what physical examinations to perform on the patient.
Problem / Solution
Medical students, our future healthcare workers, require various practices and experiences to learn more about patient types, sicknesses, and procedures. Because pre-med and master-of-med students do not have a license to practice, they cannot fully interact with patients and investigate their illnesses.
The solution is to provide authentic scenarios for medical students to familiarize themselves with the process of diagnoses.
It will include a variety of open cases — which are continuously updated by professors — and offer categories / questions the students may select from to practice their inductive reasoning skills and form a diagnosis.
The solution is to provide authentic scenarios for medical students to familiarize themselves with the process of diagnoses.
It will include a variety of open cases — which are continuously updated by professors — and offer categories / questions the students may select from to practice their inductive reasoning skills and form a diagnosis.
Who will be using the Patient Eval app?
Since PatientEval is geared towards Boston University’s pre-med undergrads and Masters of Medical Science students, the targeted audience are—at a smaller scale—people who are enrolled only in
those majors at the university.
those majors at the university.
Role / Scope / Constraints
Before jumping in on the project, I oversaw this team as the design manager at BU Spark. Since Patient Eval was also missing a product designer in midst a group of developers, I stepped into the role to create the product’s visuals.
This project’s timeline spanned across a school semester—approxiamately 3 months—and I joined in about two weeks before launch day. The main obstacles in my way were to catching up with the team, streamlining the design process, and providing a working prototype at the end of it. The team also made the decision to focus on the student side only for launch day.
This project’s timeline spanned across a school semester—approxiamately 3 months—and I joined in about two weeks before launch day. The main obstacles in my way were to catching up with the team, streamlining the design process, and providing a working prototype at the end of it. The team also made the decision to focus on the student side only for launch day.
Approach
I first brainstormed on what the team already acquired in the last few months, and used the initial design as a basepoint. From there, I created three versions of quickframes that resonated with their research, and professorial contacts.
Quickframes
In two versions, I filled in the wireframes to give the team a hi-fi visual and help them decide on PatientEval’s UI.
Version A Quickframe
Version A Med-fi
Version A Hi-fi
Version B Quickframe
Version B Hi-fi
I also expressed to the team that I imagined PatientEval as a central space that students can easily track their progress with each medical cases they started or completed. And taking in the previous versions 1 and 2, I designed the final version which was chosen PaitentEval’s presentation.
Version C Quickframe
Final version Hi-fi
Version A Quickframe
Version A Med-fi
Version A Hi-fi
Version B Quickframe
Version B Hi-fi
I also expressed to the team that I imagined PatientEval as a central space that students can easily track their progress with each medical cases they started or completed. And taking in the previous versions 1 and 2, I designed the final version which was chosen PaitentEval’s presentation.
Version C Quickframe
Final version Hi-fi
Journey
Landing
The user first selects whether to sign in as a Student or Professor. Then they can choose to either sign up to login, or redirected to the sercure BU login with their designated university ID.
The user first selects whether to sign in as a Student or Professor. Then they can choose to either sign up to login, or redirected to the sercure BU login with their designated university ID.
Welcoming Page
Here, the student is opened up to their hub. They can view any open or completed cases they added to each class. And by clicking on a class folder, it brings them to each case’s progress and due date.
Here, the student is opened up to their hub. They can view any open or completed cases they added to each class. And by clicking on a class folder, it brings them to each case’s progress and due date.
The Senario
A key aspect of PatientEval is the questions section. With the student / patient interaction, this part of the exercise is intentionally set to make the student aware of symptom asking. The team also wanted those interactions to be as real as possible, so I implemented a process that prevents the students from going back to check the answer before checkpoints. Once a question is asked, you can not take it back.
With each question asked, it is also recorded in the following section: your notepad. From there, the student reviews the patients answers, and selects by relevance to make a diagnosis.
The student enters the diagnosis / diagnoses...
...and completes the case.
Here, all the data that were recorded in the case process is shown as a summary. It includes: the score, diagnosis, selected questions (correct, missed and incorrect), and will be added to ‘My Completed Cases” in their hub.
Here, all the data that were recorded in the case process is shown as a summary. It includes: the score, diagnosis, selected questions (correct, missed and incorrect), and will be added to ‘My Completed Cases” in their hub.
Completing A Case
Student Hub: before and after completing a case.
My Open Cases: before and after completing a case.
Viewing summary of a Completed Case
My Open Cases: before and after completing a case.
Viewing summary of a Completed Case
Medical Cases Tab
Cases sorted by categories
Cases sorted by university class
Cases sorted by age
Accounts Tab
This tab includes sub-tabs: my classes, profile, and settings.
Here, the students can add and delete their classes, change their public profile, and alter notifications.
Here, the students can add and delete their classes, change their public profile, and alter notifications.