Casper, a mattress company, wants to develop a mobile or app experience that helps people track their mood and sleep and build healthy sleep habits. They are also developing a smart mattress to be linked with the app, although people without the mattress would also be able to track their sleep through their wearables or phone.

Sprint Duration: 2 weeks
Industry: Health and Device Tracking
Brief Type: Concept
Deliverables: High fidelity prototype and mock client presentation
Team: (4) N. Vania Muriuki, Alex Isitt, Lucinda Neagle, Diego Raspati
My Role: UX/UI Designer
Tools: Figma, Slack, Excel, Zoom
My Contribution: Competitive analysis, user interviews, affinity mapping and designing and iterating onboarding, home, and progress screens, creating the high fidelity prototype, developing visual design, usability testing and presenting the final product

Product: Developed 4 user flows including 95 screens that allow users to track mood and sleep habits, connect multiple devices, and access insights and tools to build healthy sleep habits

Discovering the Problem - UX Research

Our research process included user interviews and competitive analysis which served to empathize with our users, understand their needs, and understand the current market. Data was analyzed through affinity mapping and user journeys to create Jobs To Be Done and "How Might We" statements which were used to explicitly define the problem statement and solution approach.

The Design Studio - Crazy Eights, Moscow Method and rounds of iterations

With our "How Might We" statements framing our design process, we entered the development phase which consisted of a Design Studio, Feature Prioritization, Mapping User Flows, Prototyping , Iterating, and Testing.

The Design Studio included rapid rounds of sketching and ideation around the How Might We statements.

This was followed by Feature Prioritization using the Moscow Method to identify crucial features that would be included in the prototype.

After this we created a 4-part user flow to map our user's journey around the key problem and solution areas. 3 rounds of low to high fidelity Prototyping and Usability Testing followed as we iterated to ensure our design provided a user-centered experience.

UI Audit and Visual Design

Casper uses their visual style to illustrate the experience of comfort, tranquility, and relaxation achieved with their products. Their visual style is used strategically to ensure Casper's values are represented throughout their website.

Because Casper was targeting a different type of user through their proposed mobile app experience, we aimed to establish a clear, albeit indirect connection between the online store and the sleep tracking mobile app. Though our integrated design did not need to be a replication of the online site, it needed to match Casper's existing brand identity. We desired to understand how the brand’s beliefs and values influenced and determined their visual identity. By understanding their creative process, we created our own style guide and visual experience, which both reflected the online site and retained its own unique mobile app identity.‍

Key Learnings & Next Steps

My key takeaways from this project are:
‍
Work on 1 JTBD and 1 HMW at a time: I believe part of the negative testing feedback we received on the app navigation was because we were attempting to work on 2 JTBD and 4 HMW at the same time, essentially trying to solve 4 problems simultaneously. Instead of trying to accomplish too much within a short time-frame, we should have focused on 1 aspect of the app at a time.
‍
When testing results are inconclusive, prioritize testing more: I saw this principle of UX come out as we agonized over the functionality of designs, only to see it cleared up by multiple rounds of testing. I believe we could have saved time by obtaining conclusive results about ambiguous features, before advancing the fidelity of the design.

Teammates help to drive a user-centered design process: Working within a design team made me aware of my biases with user research and usability testing. I found that paying attention to my teammates critiques and providing honest feedback as well, helped us keep the user at the center of the process and design

Next steps to finalize an MVP for Morpheus would be to address prototype bugs outlined in the latest round of usability testing, conduct accessibility testing for the full app, revise UX writing especially on onboarding screens, and address UI aspects such as negative space/congestion, alignment, and clarity.

Making Sleep Support and Sleep Tracking Delightful and Easy -

Discovering the Problem - UX Research

The Design Studio - Crazy Eights, Moscow Method and rounds of iterations

UI Audit and Visual Design

Demo & Interactive Prototype

Key Learnings & Next Steps