A habit-forming application designed to improve work-life balance of students and recent workforce entrants through necessary downtime breaks.
MSÂ UX & Interaction Design
IDD-621n: Digital Experience Design Semester Project
Solo Project, UX/UIÂ Designer
Aug. 28th, 2022 - Dec. 13th, 2022
17 weeks
Adobe XD, Adobe Photoshop
Nir Eyal's Hooked model describes how a user with a produce through four stages; a trigger to kick start their interaction with the product, the action completed within the product, a variable reward for completing the action, and an investment that ultimately increases the value of the product over time. By utilising this model, designers are able to "manufacture" desire, and can essentially control users.
The goal of this project was to harness this model to create a product that promoted a positive habit that could be integrated into users' everyday routines. I chose to focus on recent graduates work-life balance; with many graduates moving to new cities with limited knowledge of social activities near them and the stress/expectation of new jobs, a strong imbalance is put on their career over their well-being.
HMW... Improve the work-life balance of students and workers by empowering them to take much-needed relaxation breaks.
After narrowing down the positive habit I wanted to enforce, the next step was to brainstorm and breakdown features that could be integrated as part of my solution; using the MoSCoW sorting method to breakdown brainstormed ideas based on feasibility of the project timelines and necessity.
In the end, I decided that the features that were the most necessary were product partnerships that would populate the marketplace for users to bid on, as well as creating a verification system to ensure that the positive habit was being enforced that used the users phone camera.
The user flow gave me a was crucial in giving me a way to not only visualize the user's experience, but better plan out how the four stages of the Hooked model could be cross referenced with the features that had been narrowed down previously.
The fours sections of the Hooked model were relatively isolated with the users' experience within specific sections of the user flow, however it was necessary that each section would be accessible and linked on the back end to further enforce the cyclical nature of the habit-forming model.
For the first iteration of wireframes, I expanded on the feature ideation to create a full workflow that the user could work through to emphasize the positive habit I wanted to enforce. My proposed solution would allow users to select hobbies that they were interested.
After importing their schedules and setting up their downtime, users could trigger their downtime start time and track their progress through the application. Completing their downtime rewards the users with ChilBux, a virtual currency which users could use in the Marketplace to bid against others users on real items.
The second iteration of wireframes built on the feature ideation from the first iteration of wireframes and created full workflow that the user would be able to work through in order to performance and validate their downtime, as well as working through the process of utilizing their earned reward in the Marketplace. A key insight from the initial wireframes was introducing a series of notifications that could be sent to the users that would be a more effective Trigger to ensure the users would enforce their positive habit.
With the wireframes and structure of the application finalized, the next step was moving from low-fidelity to a high-fidelity prototype. In order to create the right visual identity, a mood spectrum would allow me to narrow down my brainstorming and create a visual identity that fit the users the application was being built for.
I was designing the application for recent workplace entrants, so I wanted to emphasize a discreet style that would mirror similar applications that users would have on their phone (Slack, Teams, Outlook), which emphasizes simplicity and usability over flashy visuals.
With the general theme of the style guide narrowed down, I created some modabord based on the mood spectrum results with inspiration built around keywords.
For the final style guide, I decided to focus on a functional design system that would allow me to prioritize the function and workflow of the application with minimalist design components and a clear, sleek typeface. The colour scheme uses a monochromatic range of blues that work well with natural white and blacks
With my style guide and user flow finalized, the hi-fidelity gave me a much clearer visual of the components and how they all fit together. The large amount of marketplace icons made creating a consistent icons set difficult and eventualy led me to create my own icon set to maintain a uniform visual across my final prototype.
Once the final mockups were designed, taking the prototype to real users allowed me to gain valuable feedback on improvements that could be made to better suit the user. Across 6 users, the testing broken down into each section of the Hooked model, with each task broken down further in smaller workflows. Tasks were measured with the users' ability to complete each task, giving values to their confidence and ease to create a quantified value set testing of future iterations.
Burnout is very real. From students and recent graduates to people in the workforce for years, the concept of a strong work-life balance is something that people struggle with at any stage of their career. Downtym is an app that helps users carve out necessary relaxation periods during their schedules. Downtym gives users a selection of activities that they can during their downtime that can help them relax. Completing these activities as well as your downtime gives rewards users with ChilBux which they can use in the Marketplace to bid on and win real prizes and items from brands they love!
Working within a structure. Having to work in conjunction with a new user experience cycle allowed me to think more about each step of the process, specifically during the feature ideation stage.
A wide range of skills. Working from ideation all the way through final designs let me wear a variety of hats (visual identity design, feature ideation, workflow design) and build a more robust foundation of design skills.