Executive Summary
The ScreenMe app provides the needed experience by dividing the patients into various “care types”. Patients will have unique experiences through the application.
The homepage of each patient is an easily interactable card as a daily to-do list; conveying a feeling of diary, to fill in the needed info for their coach or consultant.
The patients can follow and watch their health journey and lab results via visualizations and notes from their consultants.
Does our objectives align with what users need?
A diary study was chosen as a method to test our hypothesis which resulted in two user persona as our early adaptors.
Information architecture and wireframing, A/B test and rapid prototyping were done to ensure the ideal user flows, best case of content strategy and to reduce the comebacks and revises from the development team.
Approachable, trustworthy, safe and clean and the brand book compatibility were the objectives we had in mind while building the design system.
Our process
Project brief
Research
Why this method?
Focus on Daily Use: ScreenMe is about patient-coach interactions. A diary study (lasting a week) lets you see how participants experience the app in their daily routines.
Real-Time Feedback: Participants record thoughts, feelings, and frustrations as they use the app. This provides valuable insights for improvement.
Quick & Easy: The daily Google form should only take about 6 minutes to complete, thanks to open-ended questions, timers, and rating scales. This keeps participants engaged.
Findings:
Of participants were unsure of the quality, quantity and the accuracy of their report in order to get the best treatment and diagnosis.
Used similar structure and sentencing to write short and simple keywords to shorten their report.
Of participants chose their mobile devices to fill in reports as a daily task, it seemed more convenient comparing to a sitting task.
Was the average time spent of filling in reports during the diary study research across participants.
Define: user persona
Sketching ,wireframing and rapid prototyping
We aimed for a smooth development phase with least errors or dead-ends frequency.
We used a wireframe prototype to both verify the accuracy of the flow and client’s expectations.
Design system
The clients already had a brand book as our source .
...But it needed a bit of tinkering to fit the standards of a mobile applications.
Approachable, trustworthy, safe and clean were the objectives we had in mind while building the design system.
Nunito
ABCDEFGHIJKLMNOPQRSTUVWXYZ
ABCDEFGHIJKLMNOPQRSTUVWXYZ
1234567890
Primary 1 Color
#314B50
Accent 1
#C5B677
BG Color
#F3F3F3
Accent 2
F3EAFF
Primary 2 Color
#F36D3D
Testing
According to the existing business website, calendar mode or view had more than enough interactions to be considered an important feature of the application.
We wanted the homepage to feel like a diary but also interactive enough for users to feel connected simultaneously.
In order to assure the first access point was usable enough we did a small scale test in Maze.
Before testing
Obviously users didnt find the calendar button, clickable
Changed > toggle component with enough contrast for better conversions.
Changed >A more satisfactory button was replaced for better conversions.
UI screens
