Ongoing
A vibrant and user-friendly habit tracker with a cheerful digital companion. Its colorful, minimalistic design turns habit-building into an enjoyable journey, keeping your progress motivating and focused.
Video Prototype: A peek into my work
Roles: UX/UI Designer, UX Researcher, Information Architect, Visual Designer, Interaction Designer
Timeline: 1 month
Target Audience: People interested to build good habits or overcome bad ones
Challenge: Users feel discouraged in the face of setbacks and/or are bored by mundane tasks
Objective: Create an app that promotes positivity and entertainment while keeping users focused on their habit goals
Proposed Solution: A colorful and simple habit tracker featuring rewards, a digital pet, and stats reports.
Motivation
In the world of daily life apps, like habit trackers and planners, I've come across several excellent tools aimed at helping individuals organize their lives and become the best versions of themselves. However, I found that I struggled to stick with these tools for the long term.
Before diving into the development of my habit-tracking app, I surveyed my coworkers about their experiences with similar apps. To my surprise, the majority had never used a habit tracker and were unfamiliar with the concept. This revelation ignited my determination to embark on a new project.
What excited me most was the idea of incorporating a digital pet into the app, a supportive companion for users on their habit-building journey. Inspired by iconic figures like Clippy from Microsoft Word and the beloved Tamagotchi, I ventured into uncharted territory. I saw a unique opportunity to combine this concept with a comprehensive habit-tracking application, offering users a memorable way to achieve their goals.
Secondary Research
Habit trackers are valuable tools that guide users and keep them accountable for developing their desired habits, such as drinking water every morning or doing a daily workout. There are many debates on whether these apps are beneficial or not. While some describe them as useful because they improve your mental health and are a good source of motivation, others claim they are ineffective due to users’ overreliance on inflexible technology and artificial support from reminders and notifications. Some well-known habit-tracking apps are Habitica, Streaks, HabitShare, and StickK.
Habits
According to the Encyclopedia Britannica, a habit is “any regularly repeated behavior that requires little or no thought and is learned rather than innate.” A habit can be developed through the following ways: reinforcement, repetition, or on the basis of a single experience that evoked certain emotions.
Forming Habits
It is said that every habit starts with a psychological pattern called a “habit loop”, consisting of a three-part process:
1. Cue or trigger: it tells your brain to automatically behave a certain way
2. Routine: the behavior itself
3. Reward: helps the brain remember the “habit loop” with something it likes
Breaking Habits
Many people have a hard time breaking bad habits not because they lack determination and discipline but because they don’t understand how their habits work or are formed. Thus, with the grasp of the “habit loop” concept and a smart approach, it is possible to break even long-time habits. There are five common methods used to break unwanted habits:
1. The replacements of the old response with a new response
2. The repetition of the behavior until an unpleasant response takes over
3. The change of environment to separate the individual from the stimulus that is prompting the response
4. The gradual introduction of the stimulus that is provoking the behavior
5. Punishment (considered the least effective method)
Studies have also shown a correlation between performing automated behaviors and one’s environment. Apparently, people tend to carry out habits the same way when they’re in the same environment. Hence, if they moved locations such as going on a vacation, it’s likely the behavior would change because old cues and rewards would not be present anymore. Therefore, in that case, people have the opportunity to develop a new pattern and way of doing things.
Competitive Analysis
The aim of this competitive analysis was to select five popular habit trackers from the App Store and discover the unique qualities and features that distinguish each one from the rest. It's fascinating to observe how each app's approach to habit tracking varies, despite all adhering to the same core concept. I view these differences as comparable to personalities. Just as individuals have distinct traits that make them preferable to some and not to others, applications possess features that cater to different user preferences.
OBSERVATIONS
"Eden" and "Productive" struck me most for their creativity and simplicity, respectively. Eden's remarkable customization invites users to truly make the app their own. Productive's effortless UI design makes it very easy to learn, use, and remember its elaborate content. These were attributes I prioritized in my end-to-end application.
Interviews
Among all the UX Design projects I have undertaken, this one posed the greatest challenge when it came to formulating interview questions. I felt lost in the sense that I didn't know what kind of questions would be beneficial for the development of my habit tracker or the specific aspects I wanted to explore. To surmount this hurdle, I contemplated the following questions as a means to reach a solution:
• What kind of information am I interested in gathering?
• What do I want to learn from users?
• What information will help me build an effective habit tracker?
From there, I formulated the following interview questions which focused on participants' habits, strategies, and past experiences. My goal was to listen with an open mind and identify a shared problem.
QUESTIONS
Please state some of your good and bad habits
Which habit-forming strategies or tools (like apps, calendars, sticky notes, journaling, meditation, etc.) do you think are most effective?
Describe your habit forming or breaking experience in 3 different words.
Please share how you developed the habits you stated before
What encourages you to keep working on yourself? (Inspirational quotes, interesting scientific facts, friends and family, incentives, etc.?)
Are there any habits you wished you did or didn’t have? Which are they and why?
Have you tried to form or break the previously mentioned habits? If yes, how?
What helps you get back on track when experiencing a setback?
RESPONSES AND REFLECTION
At the end of the interview sessions, I realized it was going to be nearly impossible to create a one-fit-all habit tracker. It wouldn't be possible to attain universal satisfaction due to individual differences. Nevertheless, these interviews were not fruitless as diligent examination can reveal patterns worth uncovering. Thus, I dissected each participants' replies and discovered these common points:
• All participants are motivated by something or someone
• All participants have good and bad habits
• They are aware of the process of building or breaking a habit and where it stems from
• They've used tools to help them build or break habits
Every participant's challenge with habits followed a similar structure: they have a handful of habits they want to break or build but struggle remaining consistent. Although self-discipline plays a big role, another reason behind their past failed attempts might lie on the deficiency of an effective tool or strategy.
INSIGHTS
The image shows a preview of the affinity map for my interview findings. The six themes represented are the patterns I discussed earlier and will come in handy in deciding what elements to include and how to structure the app.
User Personas
Hana and Adrian represent the two target groups for which I will be developing the app. They are two ordinary people, like you and me, who lead busy lives filled with aspirations and obstacles. At the end of the day their common desire is to pursue self-development and happiness. Despite being successful they know they are not perfect and always look for ways to improve. It would be very helpful if they both had a tool in hand that organized, stored, and kept track of all the tasks they intended to do; one resource containing all.
Project Goals
Establishing project goals often serve as a constant reminder of the importance of teamwork in UX Design. This Venn diagram might not be accurate because I had to wear three hats, two of which were not in my area of expertise. The majority of business and technical goals were thought out using common sense and my mentor's guidance. I look forward to having my own team in the future to work and discuss ideas with.
Specifying the Problem
"Motivation is often the result of action, not the cause of it. Getting started, even in very small ways, is a form of active inspiration that naturally produces momentum." - James Clear (author of “Atomic Habits”)
The concept of acquiring a habit sounds easy: decide what you want to change and go for it.
Simple, isn't it?
Unfortunately, what makes it extremely difficult is the need for consistent effort. A habit cannot be accomplished in a day or a few weeks. It could take months, years, or more. Statistically, it takes an average of 2 to 3 months for a habit to become automatic. A simple desire is not enough to drive us toward change. We need persistence, motivation, and most importantly action. We need to focus on the bigger picture and stick to our plan even when we are reluctant to do so. We often wait for the "right moment" when the truth is we need to create it ourselves.
That being said, my POV statements and HMW questions revolve around two aforementioned aspects of the habit-changing process: action and momentum.
POV STATEMENTS AND HMW QUESTIONS
I’d like to explore ways to help users stick to their habit-building or habit-breaking plan until the end because it’s easy to get discouraged and give up in the face of setbacks.
How might we…
… encourage users to get back on track when experiencing failure?
… help users embrace setbacks?
… help users view setbacks in a positive light?
I’d like to explore ways to make the habit-building or habit-breaking journey fun because people might get bored by tedious, redundant, and unengaging routines.
How might we…
… gamify the habit tracker app?
… make the app fun for a large audience rather than a specific group of people?
… increase stimulation for users through the app?
Feature Set
As I highlighted during the competitive analysis section, two qualities of the apps stood out to me: creativity and simplicity. I wished for my app's tone to encompass those two words, so that's what I kept in mind when formulating the feature set outlined below:
"Simplicity is the key to brilliance" -Bruce Lee
I firmly believe in the power of meaningful simplicity to create user-friendly experiences that are easy to remember. When people use my habit tracker, I wish for them to get out from it precisely what they expected, nothing more nothing less. That's why this feature set is not filled to the brim with extravagant features. Instead, it contains just enough to make it usable and enjoyable and keep users' attention on the original target: habits.
Flows
There are two types of flows: one for new users and one for active users. Because each group of people would see distinct screens and take different steps, I created two flows to illustrate the contrast. I stepped into the each user's mind and wondered: "What would be their most likely inclination?"
• New users: add new tasks and customize the app
• Active users: change their habit list either by adding, editing, or deleting a habit; check for upcoming tasks, and track their progress.
USER FLOWS
Using the habit tracker app for the first time (new users)
Scenario: Hana has been trying to work on her sleep schedule for a very long time, but to no avail. She struggles with self-discipline and self-accountability. She also loses motivation easily and goes back to her old habit of overusing her phone when she feels bored. She wants to give a habit tracker app a try.
Using the habit tracker app after some time (active users)
Scenario: Hana has been using the habit tracker for about a month now and has started to see some results.
TASK FLOWS
Add a new habit
Goal: Adrian is a new user who wants to add a task into his habit list
View daily tasks, monthly plan, and progress
Goal: Adrian completed all his daily tasks for the day. He wants to check them off, view his monthly goals, and look over his current progress.
Branding
Here comes one of my favorite parts of UX Design projects: Branding. This is the time where I freely let my creativity and visual design skills shine through. More than creating aesthetically pleasing designs or combining colors, branding is about bringing a product to life. Choosing the colors, icons, keywords, logo, images, and typeface that will best represent the app. In a sense we are giving these products an identity that will follow them for a long time and dictate their reputation. Because of that, careful thought and attention should go into it.
MOOD BOARD
"Color" is what I wanted my app to fully embody. Not in an overwhelming and chaotic way, but one filled with hope and joyful vibes. For this mood board, I drew great inspiration from influential sources such as costume designer Ágatha Ruiz de la Prada's bold designs and Antoni Gaudí's La Pedrera. I was also captivated by vibrant palette's found in nature, particularly the renowned flower fields of the Netherlands. I was particularly drawn to the harmonious blend of colors and the vibrant, lively images found in these sources.
TYPEFACE
You may notice most of the typefaces present are rounded sans-serif, which give off a casual tone. I sought a typeface that was friendly and easy to read, yet I later learned from my mentor that rounded typefaces are difficult to read in large texts. Hence, I opted to use one of the previously mentioned typefaces for headings and a straight sans-serif for body texts. The users' experience is always the priority!
COLOR PALETTE
As I envisioned a colorful palette, the first word that came to mind was "candy". Therefore, I went with this idea and explored palettes that emulated a bowl of assorted candy.
LOGO DEVELOPMENT
I knew from the beginning I wanted to have a digital pet in my app, and I was almost certain I wanted it to make an appearance in the logo. If you take a look at my logo sketches, the character appears in almost all of them.
For the app name, I first listed as many existing habit tracker app names I could find to avoid plagiarism. After, I brainstormed words associated with the habit-building process, such as "upward", because you're moving forward to improve yourself; and "ongoing", to signify the journey of self-developing is recurrent. There's always room for improvement, so we are constantly changing to be the best version of ourselves.
I was fond of the connotation of the words "Upward" and "Ongoing", so I was torn between these two words. At this point it was up to the logo to finalize the name.
Once I designed some potential logos, I conducted a quick survey with my mentor, friends, family, and coworkers to choose the final logo. First, my mentor mentioned the four arrow logos might be too common and basic, making them less original. Thus, those were disqualified.
Then, surprisingly, most of my friends and coworkers liked the bottom left logo with the blue background and red and yellow turning arrow. The other version of this logo in green ran a very close second.
The bottom-left logo became the final pick, and to match its design I decided on the name "Ongoing".
UI Component Library
Me: “Which pet do you like most?”
Friend: “The yellow one.”
Me: “Why?”
Friend: “Because it looks like me!”
This UI Component Library holds the final versions of each category: logo, typeface, color palette, and icon set. I chose rounded icons to match the typeface and tone of the app, which again is casual and fun.
The digital pets at the very end are the cherry on the cake. Again, inspired by simplicity, the digital pets were no exception of that concept. I was inspired by blob-like cartoons and designed each a little differently to give them character.
My original plan was to have the same character in four different colors. Then I thought users might find it more enjoyable to see more variety and find themselves identified with one of the characters.
For example, the pink pet has a mole by its mouth, the yellow pet has two curly buns, the green pet wears glasses, and the blue pet has freckles. Even though their facial traits seem trivial, they might have a greater impact on users than we think. It always feels good to be represented one way or another.
Wireframes
Ongoing is composed of 8 major screens, which received inspiration from other habit tracker apps, mainly "Productive":
1. Welcome screen
2. Onboarding screens
3. Home
4. Habits List
6. Habit Setup
6. Calendar
7. Stats and Progress
8. Settings
Watch below how the app's vision comes to life starting from the sketches to the high-fidelity wireframes. As the quality of screens increases, so do the details.
Prototype
This prototype demonstrates the task flow: how to add a habit.
Regarding the pets, there's a reason why they are unchangeable once they're picked. The aim was for these pets to mimic a real pet users could grow a connection with. In a way, the pet symbolizes commitment. I wish for users to commit to their goals and feel strongly supported by their loyal pet and become reliant on their encouragement.
Usability Testing
A recurring thought I have before usability tests is: Will participants see my vision and know how to use my product?
This is ironic because as the UX Designer, it's my job to empathize with people, wear their shoes, and gain a sense of their thought process. Yet, for some reason, I can't help but wish we could reverse roles and they'd do the same for me. It's in these moments I recall the value of feedback and iteration. Products are never perfect on the first try, and still won't be even after multiple alterations. As UX Designers we must continue listening to users' concerns, questions, frustrations, and compliments to enhance a product.
Returning to my initial question, despite the uneasiness they bring, I am grateful for this feeling because it shows I genuinely care for both my project and clients. When I care there's meaning, and whenever meaning is involved I know for sure no effort or hard work goes in vain.
PLAN
-
• Determine potential users’ impressions of the hi-fi prototype
• Understand users’ thoughts and decision-making when navigating the prototype
• Detect weaknesses in my design and prioritize revisions for an optimal user experience
-
Goal: Adrian is a new user who wants to add his first task into the habit list.
(refer to task flow image)
-
• Tasks are completed smoothly from beginning to end with minimal confusion and frustration.
• Users easily follow instructions, understand the icons’ purpose, and know what to press to meet their needs.
• Users find the design intuitive, convenient, and fun; they can navigate the prototype without assistance.
-
• Due to time constraints, 2-3 participants will complete a 10–15-minute remote or in-person test.
• Observations will be gathered and analyzed using a Word document and a feedback grid on FigJam.
SUMMARY AND ANALYSIS
-
I conducted an in-person usability test with two participants and a remote test via Zoom with one participant. The objective was to have participants complete a task and test the prototype’s usability and effectiveness. Their job consisted in creating their first habit.
All participants completed the task well, some with a little more difficulty than others. Participants who were not tech-savvy or unfamiliar with apps and habit trackers experienced a steeper learning curve. Nonetheless, they figured things out through trial and error and were able to navigate the app with ease toward the end.
-
Overall, this end-to-end application was successful; all participants completed the task with minimal assistance. Most of their struggles were prototype-related, so those were the only times I stepped in to guide them. However, for the most part they found the app cool, simple, and straightforward. They also praised the app’s design, especially the pets.
-
After gathering participants’ comments on the habit tracker, I’m interested in making improvements in the following areas:
1. First welcome screen’s transition
2. Tutorial
Reasoning
During the usability tests, I observed all participants were taken aback by how fast the first screen transitioned to the next. They either wanted to look at the design longer or needed more time to read the text. I realized it’s better to give users control over when to move on to the next screen for screens containing text since users’ reading paces and preferences might differ.
Participants also had a negative experience with the Tutorial screen because they didn’t know what to do or if they had to do anything. One of them clearly stated that he did not want to read it because he was not interested. Yet, later, he encountered features he didn’t know how to use and wished he could look back at the tutorial again, but he couldn’t.
Possible solutions
These are iterations I can perform within my time constraint,
• First screen’s transition: I will incorporate a “Continue” button to give users the power to control its transition.
• Tutorial: I will substitute the text with a video to clarify this screen’s purpose and better teach users how to use the app. I will also have the tutorial video available in Settings for users’ convenience.
Conclusion
I suggest moving forward with these changes because they have medium to high impact and require low effort. There’s also a greater chance these changes will encourage users to continue using the app at the early stages of the app acquisition.
Priority Revisions
Additional Revisions
If given more time, I would've liked to work on the following:
• Polish the animations and transitions for a more advanced, app-like interface experience.
• Expand the Progress screen to offer users more detailed, clear, and accurate information.
• Offer the option to present daily tips or scientific facts related to habits. User could activate this feature, possibly within the Setting sections. I want to give them the option to choose whether to see that information or not, so that they are not bombarded with extra information, especially when they are not interested.
Challenges, Reflection, and Strategies for Future Projects
This project proved to be one of the most difficult and rewarding experiences in my early UX Design journey. The freedom I had to make decisions across all aspects of the design process was both thrilling and overwhelming. Starting a project from scratch, especially without a clear direction, can be a daunting task. I've learned that user research is invaluable in such situations.
Due to time constraints and lack of experience, I didn't fully leverage research and interview insights to extract valuable information and pinpoint specific user issues. As a result, my application ended up being too general, not addressing the specific user needs uncovered during the research phase. This is an area I'll focus on and develop as I continue to work on more projects.
I also faced challenges getting started, as I wasn't sure which project would benefit users the most. With guidance from my mentor, I learned the significance of embracing ideas I'm passionate about, committing to their execution, seeking insights from others, and diligently refining them during the design process. I've come to understand that combining enthusiasm with a data-driven and user-centric focus will lead to creating captivating solutions that deeply resonate with my audience.
Acknowledgement
I am grateful to my mentor for her honest feedback and all participants who agreed to assist me with interviews and usability tests. Thanks to their guidance and support, I had a positive experience designing this app.
What, or rather who, really motivated me even when I was stumped by the work were my family and friends. I was very excited to keep them in the loop of my progress and show them my work every now and them. Since I had no design team to work with, they essentially became my makeshift team. They were not experts in the field, but their opinions were just as valuable and I took all into consideration.
I keep looking forward to the day I join a team of designers to work on projects with from beginning to end.
