A native mobile app to help cancer patient track and manage their sleep habits for better quality of life.
- Branding, illustration, and animation
- UX Designer
- Front end development
Branding / Illustration / Animation
This project was asked by the researchers to feel like “a sleep coach in your pocket”. We ultimately arrived at a chat bot being an approximation of a real life sleep counselor.
Through guided session, the app gathers knowledge about a users’ sleep habits, and helps provide a path to “more good mornings”.
The path to better mornings was through our chatbot: a friendly coach who checks in every morning and helps you track your sleep, and manage any issues you’re having based on the advice of a real sleep therapist. The avatar was based off the researcher’s likeness, but made more like emoji / robot to alleviate any uncanny valley concerns.
The overall aesthetic was designed to be colorful, cheerful, and friendly. The team came up with an analogy of a “sleep garden” where you thought of tending to your sleep like a group of plants.
The team discussed overall goals with the client and a sleep therapist over the course of weeks, determining best practices and solutions. We created flows for each part of the process. Taking those finding and high level flows, I worked on solving how a user would progress through each process, things like:
- Onboarding the patient to the app
- Tracking their sleep each day
- Reading content related to sleep health
- Navigating through the chat bot experience
- Activities to help with sleep like meditation
Front End Development (Vue.js)
Working with a developer, I was responsible for layout and aesthetic using html, Vue.js components, and SCSS. Normally in the process it’s a back and forth between a developer setting up a base app shell and some core functionality, while I come in and put things in their place and on brand.
For this particular project we working within the constraints of framework7 – providing us with a lot of the app components to work with. We took this into consideration when designing the rest of the app.