Olive
Olive is a web-based project that aims to provide a tool to help people with spinal problems exercise, reduce pain symptoms, and maintain a normal lifestyle.
ROLE
UX Research
UI Designer
DURATION
7 months
TOOLS
Adobe XD
Illustrator
Photoshop
Optimal Sort
Miro
Invision
Marvel
Approach
-
Deep research into the topic and figure out the design problem.
-
Stripped down the findings into the design objective.
-
With the design objective, start ideating, sketching, testing, revising
User research
Design challenge
Back pain was previously believed to be uncommon in young adults. But now, it is a global problem in terms of disability and financial costs, with a large burden to both the individual and society. Many people nowadays are aware of this serious situation and seeking ways to improve their spinal health.
Solution
After conducting user researches, I considered three main components that users are seeking for a healthcare web app, these being:
01.
Exercise browsing for certain pain
02.
Allow patients to keep track of their medical records
03.
Be able to book appointment and receive reminders
Fidelity progress
Low-fidelity
Basic drawings with pencil and paper
Mid-fidelity
Placement, size and more mid level navigation established
High-fidelity
Graphic elements, specific writing and fonts included
Testings & Revisings
A few screens that I have revised after testings
Version 1
P5 felt the ‘uploading file’ screen is quite annoying her and block her view.
01.
Usability test
Version 2
Participants said “I like to have the document types a bit bigger though”
Version 3
Participant stated “The readability of each file entry is better”
02.
Preference test
Version 1
Version 2
Final design
To ensure that I'd achieve my goals by the end of my design process, I came up with several interactions that correspond with each one.
01.
Exercise browsing
Users can create a personal account to store exercise videos related to the osteoarthritis problems they are interested in
02.
Storing medical records
Users will receive medical reports from the hospital and can store them all here without having to rummage through documents every time they need one.
03.
Book appointment and get reminder
Booking appointments with medical centers and receiving confirmation messages allows users to add reminders easily.