Maslow
View the entire case study on the desktop version of this webpage joshuadema.com
Neumorphism meets Accessibility.
Improving the design and function of a spinal cord injury lifestyle assistance app.
Short on time?
Quick Summary
1. Problem
Young people with spinal cord injuries need a way to communicate their complex care needs to support staff, who may change unannounced
2. Research Insights
Users with spinal cord injuries use their phones in unique ways depending on their injury. Some use their phone in their lap, some cannot feel the screen with their fingers
3. Solution
We designed an app that blends neumorphism and visual feedback to assist users. We included a schedule creator that can share routines seamlessly
Project Overview
Maslow is a digital assistant to the rehabilitation journey for young people with a spinal injury.
The Maslow app helps young people inform their daily habits, to maintain compliance to vital health management activities such as respiratory health, pressure care management, and mental health.
My Role
Tools
The Team
UX Research
Affinity Mapping
Ideation
Rapid Prototyping
Usability Testing
Stakeholder
Management
Tom Cox
Desiree Khng
Mine Xie
Figma
Miro
Google Forms
Otter.ai
Time Frame
2 Weeks
Aug 2020
The Problem
Young people who experience a traumatic spinal injury have to adjust to an enormous amount of changes. They are required to remember and practice detailed care and exercise routines during their rehabilitation, while adjusting to the mental and emotional strains of the new situation.
Making their lives easier, and providing a central hub of information for their required exercises is essential in ensuring they can manage their health, recover as much function as possible, and make continual progress.
Our Mission
Make the lives of Maslow users with Spinal Cord Injuries (SCI) easier
-
Identifying pain points and challenges in their day to day lives.
-
Understand their routines and the importance of rehab.
-
Suggest and design new features to integrate with the existing Maslow app.
-
Connect the suggested new features to the needs of the users and recommend a plan for future developments.
Our Process
We followed the Double Diamond from end to end, delivering a high fidelity mobile app prototype at the end of the two week sprint.
Discover & Research
Let's get Started!
After meeting the team at Maslow, we proceeded to affinity map Andrew's (Maslow Co-Founder) insights and our own thoughts onto a synthboard.
We summarised our assumptions about user pain points and got a sense of who we were designing for. We would need to validate these assumptions in the research phase.
Our research goals were as follows:
-
Find out day to day challenges for users with SCI
-
Do they establish routines and track progress?
-
What motivates them to complete their routines?
-
Validate Existing Company Research
So.. who's involved here?
Our problem space involves three key players, the User, their Therapist and their Carer. Carers may come from an agency, or be a family/friend.
Ecosystem Research
With the help of our favourite search engine, we began to understand Spinal Cord Injuries.
>80%
of traumatic spinal cord
injuries are Male
$5-10M
Lifetime Care Cost
(Depending on Injury)
15-34
Common Age Bracket for Spinal Cord Injuries
Understanding Spinal Cord Injuries
In order to empathise with our users we had to understand how their injuries might impact their lifestyle and device usage.
Cervical Nerves
(C1-C8)
Person likely to have some or total paralysis of wrists, hands, trunk and legs.
Nerves effect wrist extension and flexion
May have difficulty with fine motor movements
Person requires daily assistance with living
Thoratic Nerves
(T1-T-12)
Nerves effect muscles, upper chest, mid-back and abdominals
Arm and hand function may be reduced
Person may requires assistance with daily tasks
Lumbar & Sacral Nerves
(L1-L5) (S1-S5)
Loss of function in hips and legs
Arm and hand function is usually normal
Person may require a wheelchair and may walk with braces.
Qualitative and Quantitative Research
Time to get out there and speak with some real people to identify their pains, gains, and get to know them!
We designed a survey to quantify our insights, and conducted a number of 1:1 interviews.
7
Survey
Responses
9
Interviews
People with
Spinal Cord Injury
4
Interviews
Carers of people with
Spinal Cord Injuries
What did people have to say?
“A good routine makes my life more efficient and allows me to be and do more in life.”
- Stephen
"Every injury is different and unique" - Andrew
"No matter how long you've been in the chair, you will forget" - Hue
What did the experts have to say?
In order to empathise with our users we had to understand how their injuries might impact their lifestyle and device usage
We found that rehab routines are difficult for people to manage when leaving structured care. Users become overwhelmed with information and struggle to remember it all.
Spinal Cord Injury users have unique needs and care routines depending on their type of injury, and the bulk of recovery progress is made in the first 2 years post-injury.
Consistency of engaging in routines is key, with carer inconsistency and lack of motivation being the main obstacles for maintaining a routine.
With all this research and insight, it was time to define the user....
DEFINE
Key Insights from Research Period
Every Injury is Unique
Routines Are Essential
Changing Carers is Hard
Rehab Requires Structure
People have different goals
First 2 Years Post-Injury are Vital
Humanising Our Research
We identified a primary and secondary persona to guide our design thinking the persona really helped us, and our client to empathise with the users. We kept our personas in mind throughout the process.
Persona #1
Bryan is a former painter who had a work accident and obtained a C4 injury. He adheres to a strict routine each day, and is meticulous about his health and progress. Bryan gets frustrated when his carers change, as he has to explain his entire care routine to them, he often forgets key steps.
Click to enlarge
Persona #2
John is an academic researcher, with a wife and one child. He has had a C4 injury for 10 years now. At first his wife was his carer, but as his needs have increased over time he has started relying more and more on carer agencies. John wants to spend less time dealing with carers so he can focus on his family.
JOURNEY MAP
The next tool we developed was a Journey map, a timeline focused on pain points experienced by a Maslow user.
We’ve mapped actions, emotions, thoughts, pain points and opportunities onto this board.
HOW MIGHT WE
Finally we were able to define our problem statement and HMWs
HOW MIGHT WE make it easy for users to create routines and set reminders.
HOW MIGHT WE allow users to share information with their support workers.
HOW MIGHT WE allow users to set goals as a way of remaining motivated.
DEVELOP
IDEATION
We set out to design app features that would address multiple pain points for users.
Our access to existing client research data allowed us to start the ideation process earlier than anticipated, and we continued to conduct research concurrently with our initial concepts.
How we approached ideating:
-
Crazy 8s
-
Looking at competitor applications to benchmark useful features and layouts
-
Initial sketches were hand drawn and voted on by the team
To address Bryan’s pain points, we decided to focus on adding the following features to our design prototype:
1. Create a daily schedule
2. Customise task reminders
3. Share the schedule to support workers
4. Track exercise milestones, share to therapist
5. Set personal goals
These features would together allow Bryan to build his own unique routine and put him in control.
User Flow
We designed our user flow to list the logical steps and pages that are needed when using the app, note that there are up to three users that will interact with the app the user, their carer and the therapist.
User Flow
Initial Wireframes
Eager to get on the tools, we jumped into figma and started designing some wireframes to test our features.
Early Wireframes
Click to enlarge
PIVOT TOWARDS ACCESSIBILITY
We presented some of our concept wireframes to the client to engage their feedback and involve them in the solution process.
While they were impressed with the depth or our research, they suggested we needed to keep accessibility in mind as we progressed with the design.
The prototype screens we presented were not suitable for their users in terms of accessibility.
Designing for Accessibility (Spinal Cord Injuries)
Problems
-
Users may use their phone in their lap the see the screen from a further distance
-
Users may have no sensation in their fingers
-
Users may have limited wrist dexterity
Solutions
-
Design larger buttons and font sizes
-
Simplify screens, less is more
-
Users need to visually see when a button is being tapped
-
All interactions need a wide space margin for error
CRASH COURSE IN ACCESSIBLITY
On the technical design side of things, we found the following design specifications to adhere to.
-
Pointer targets of at least 44 x 44 dp
-
Word spacing at least 0.16 x font
-
Touch target spacing separated by > 8dp of space
-
Font size no smaller than 13pt
LOW FIDELITY PROTOTYPE
We got straight back to designing prototypes, this time with a more functional approach to accessibility
10
Usability
Tests
Moderated Via Zoom
People with
Spinal Cord Injuries
Insights
-
80% of users rated the features app 8/10 of more
-
Users reported that navigation was "Average"
-
We found out users wanted availability of choice.
"I am not my disability - things about me should be first, injury should be afterwards” - Beth
“I would want to be able to choose what gets sent to carer." - Hue
Applying Neumorphism
In our quest to make this app as accessible as possible for users, our we looked into Neumorphism
Neumorphism, or soft UI, is a visual style that combines background colors, shapes, gradients, highlights, and shadows to ensure graphic intense buttons and switches. All that allows achieving a soft, extruded plastic look, and almost 3D styling.
We utilised Neumorphism in our app, you can see it in action to the right.
I wired up these interactions in figma, let me know if you would like to find out how - contact me
HIGH FIDELITY PROTOTYPE
4
Moderated Usability Tests
People with
Spinal Cord Injuries
5
Unmoderated Usability Tests
Via Google Survey
Insights
-
Testing revealed that we had some issues with terminology and iconography
-
We changed the word "rehabilitation" to "training"
-
We changed the word "Carer" to "Support Staff"
-
We changed the basketball icon to a dumbell
-
-
Users did not realise that they could click the profile picture to access profile screens.
-
We added a more visibly clickable profile icon.
-
-
We further refined accessibility
-
Visual feedback (consideration of button styles)
-
Navigational flow
-
Clarity of functions
-
DELIVER
THE FINAL PROTOTYPE
The home page,
where all the magic happens.
Users can access all the app features easily OR pass their phone to a support staff member (carer) when they arrive
When your carer arrives, they get a whole flow to themselves to make sure they don't miss any care tasks
Set up your schedule for the day, week or year.
Users build their routine into the app, and can share easily to their support staff
Add a new carer
See what's happening
next
'My Profile' allows for adjustment of Bio, Goals and Report. In response to user feedback; "I am not my disability" we changed the order of information in the bio so recipients will learn about the person first, injury second
Set personal (non-therapy based) goals
to keep you on track
Send your schedule
to your carer
In the training program flow, users receive guided instructions and videos to help them complete their routines, including achievement tracking, and ability to send results to their therapist
CLIENT FEEDBACK & REFLECTION
The Client has some very positive feedback for us
"During the discovery you immersed yourselves into a very niche space, were able to find and contact a traditionally hard to reach cohort, and were able to get insights that normally remain quite a hidden issue."
Andrew Akib - CEO Maslow
"I think you all excelled across all phases of the sprint. The ideation recognised some fairly consistent needs for users, and the design process took on the lens of accessibility and ease of interaction given potential physical limitations"
Andrew Akib - Maslow CEO
I looooved working on this project, having the opportunity to contribute to the disability-tech space made me feel like our designs were solving some real problems for people.
What I did well
-
Lead The Team: Leadership is a natural quality of mine, we had a cohesive team, but I took the role of overseeing the strategy and timeline for the project with great success.
-
Interaction Design: I was able to excel with my prototyping skills here, I programmed the touch interactions to mimic the button changes.
-
Research: In a short amount of time we were able to really understand the users, knowing what questions to ask in the interviews and analysing the data we were given set us up for success.
What we could have done differently
-
Accessibility: If we did this sprint again, I would have liked us to understand the accessibility piece a bit earlier on, this became pivotal in our design and it would have been nice to test further iterations earlier.
.png){kind=small}