Designing a Mobile App With a Novel Approach to Habit Tracking

An app bringing innovative, behavioral-science backed solutions to your habit development woes.

At the beginning of the lockdown, I developed a jogging habit which brought much needed stability into my life during a very strenuous time.

I wanted to bring these same benefits into the lives of others by creating a product that inspires people to cultivate their own habits.
Team
Tenzin Woser (Solo)
My Role
Project Lead
Tools
Figma, React, p5.js
Timeline
Sept 2020 - Jan. 2021
(approx. 4 months)

Problems

Habit Apps don't fit Habit Science
I found that habit tracking apps often don’t follow or go against guidelines identified in behavioral science (Streaks can be detrimental to habit growth).
Doing a habit isn’t satisfying
Habits being logged aren’t as visually satisfying as they could be. A simple check mark or words being crossed off feels insubstantial.
Habit apps have low user retention
Most users quit using habit tracking apps within 10 days of downloading them.

I. UNDERSTAND

Researching Habit Formation

I began with trying to understand how people build habits by researching on Google Scholar and O’Reilly.
Insight 1:
Event cues are powerful tools to build and reinforce habits

Result - Final app supports event cues in the form of notifications
Insight 2:
Existing apps lack features supporting habit formation, event-based cues, and implementation intentions

Result - Pushed app towards behavioral research-proven practices for app features
Insight 1:
Most people who use habit tracking apps are young to mature adults (18 to 49 years old)

Result - Informed interviewee selection and research during research collection.

Competitive Analysis

Next, I set out to understand what users expect from habit tracking app functionality and how apps approach habit set-up. I wanted to explore a breadth between stylized and minimal so I chose the following 5 apps since they captured a breadth of UX/UI approaches.

Identifying features people expect

Since a big part of using a habit tracker is setting up the habits themselves, I wanted to isolate my understanding of how apps approach this part of their functionality.

To do this, I organized the features into two sections: one for features related to setting up a habit and another for features related to general habit tracking app functionality.
Using the findings from the breakdown, I identified key features users expected from habit tracking apps.

I implemented all of these features in the final version of the app after considerations from user interviews and analysis.
Expected features from general habit functionality
Feature 1:
Calendar View
Feature 2:
Weekly Habit Cycle
Expected features from general habit functionality
Feature 3:
Schedule reminders in weekly time frames
Feature 4:
Ability to personalize habits(coloring, shapes, etc.)

Understanding opinions of habit apps

I dove into the Google Play Store and made note of the most constructive and popular comments in the reviews section of each app in my competitive analysis.
Popular opinions about habit app functionality
Opinion 1:
People value attractive & simple user interfaces

Result - I stuck to a minimal UI even though I was considering many compositions
Opinion 2:
People overestimate the effectiveness of 'streaks'

Result - Though it was not behavioral-science backed, the reviews revealed I had to implement some minor streak tracking functionality

The Tree Concept

With the information I’d gathered up to this point, I saw the need for a novel feature encouraging users to develop their habits. I had an idea for a digital tree growing as a person completed their habits inspired by the mental health benefits brought from cultivating houseplants.
After sketching up a few concepts and ideas, I felt prepared to jump into interviews to see whether this idea intrigued people.

Interviews

I now had a good amount of information to go off of but I needed to confirm that my findings up to this point are relevant to my target audience.

I decided the best option would be to jump into some user interviews with the goal of identifying how relevant my findings were and how potential users interfaced with their habits.

Recruiting strategy

Six interviewees eventually got back to me:

In the interviews

To understand how people navigated their own habits, I asked questions about how they navigate their habits day-by-day and their experiences with habit tracking apps.
This is what people had to say:
Key findings from interviews
Finding 1:
Users expected more support from their apps to accomplishing their goals

Result - I considered as many possible ways that a habit tracking app could encourage users without becoming a large external motivator
Finding 2:
Users craved control over habit tracking functionality - especially when it came to notifications

Result - I pushed to implement features allowing users to control their experience with their habit
Finding 3:
Users were interested in the tree feature I had imagined

Result - I moved forward with the tree concept I had in mind during the design implementation process

II. ANALYZE

User Personas

To distill all of the research I’d done into a concrete and reference-able form, I created two user personas. They were representative of the distinct user populations I identified over the course of my research.
Apps [Persona] is Familiar with - a section that guided my understanding of peoples’ mental models, familiar user interfaces, and familiar workflows they had.

Minimum Viable Product

I then identified a list of aspects of the app that were mandatory based on user expectations and important features for habit development. I was constrained by my experience as a solo novice developer, no budget, and creating the app on a mobile platform.

Mapping out the User Flow

With the MVP of the app clear in my mind, I generated a high-level flow between each feature that would make the experience the most seamless for users.

III. DESIGN

Tree Idea Proof of Concept

Since I was feeling confident in pursuing idea of generating habit trees after the interviews, I had to figure out if it was actually feasible. I fleshed out my idea then programmed it with p5.js within React to test.
Key findings about how the tree should work
Finding 1:
The implementation that would be the most visually engaging was if the branches animated each time a user completes a habit
Finding 2:
Randomly generating the trees’ branch length and angle allows each to be unique and meaningful
Finding 3:
The generation of the tree must be capped because the branches and leaves that have generated will begin to overload the system eventually

Merging Habit App with the Tree Idea

I then had to think about how the tree would fit into the rest of the app. There were multiple ways to implement the tree in the app which were mutually exclusive. After considering many options, I identified three ways that the tree could function.
Implementation options
I conducted semi-structured interviews/usability studies by making the frames into a prototype allowing users to explore the UI as they spoke about their thoughts.
I hypothesized users would prefer having both but user testing revealed users responded best to just have a tree for every habit.

Lofi Usability Studies

With new screens, I dove into some formal usability tests once again to find out if these were good bones that I could build the hifi screens off of.
I asked users to do specific tasks:

Adjustment #1 - Habit Card

Adjustment #2 - Habit Input Process

IV. REFINE

Giving the App a Personality

Since I was feeling confident in pursuing idea of generating habit trees after the interviews, I had to figure out if it was actually feasible. I fleshed out my idea then programmed it with p5.js within React to test.
Soon after assembling the moodboards, I jumped into iterations of the home screen’s design.
I designed the UI to be as light-weight as possible so that users found tracking their habits approachable.

After creating the home screen, I applied the styling to all other screens that were previously grey-scale/un-styled.

Final Usability Studies

With new screens, I dove into usability tests once again to assess the performance of the new aesthetic and make final adjustments to the interaction design.

Experience 1: Home Screen

Experience 2: Overall Habit Creation

Experience 3: Habit Creation

Experience 4: Habit view

Experience 5: Calendar View

Conclusion

The Future of this Project

I am currently collaborating with an engineer friend of mine to develop this app. Reach out to see how it's going!
Things I'd like to implement in the future

Key Learnings

Being my first end-to-end project, I learned an incredible amount form this project.  First and foremost, usability tests are brutal, necessary, and infinitely insightful. Also, no matter how confident you are in your design, there is always going to be some way to iterate or improve on it - never stop looking for improvements.
Things I'd change about my process