Habitify

A mobile app that helps users form habits.

Overview

Everyone has a habit, whether it's good or bad. To cultivate good habits and break bad ones, the habitify is available to help users manage their habits. But it has a lot of complexities for users to easily form a habit, and it is difficult to grasp the habit progress at once. I made it easy and shows their consistency at once, so that users can use the habitify more frequently to create a habit.

My Role

User research
UI/UX design
Testing

Project

Solo project

Duration

8 Weeks

Tools

Figma, Miro,
Photoshop

Easy-to-recognize button at once

The buttons are of different sizes and colors, so it is difficult to recognize them.

I removed unnecessary buttons and added an undo button for convenience. Additionally, I made sure to place the date and time texts close to each other, making them easier to recognize at a glance.

Making graphs simple to view

The tracking graph is causing confusion for users as it displayed a mood score, making it feels complicated.

I made it to display only the progress of today's habit in a summary, and it is easy to check it at once with a calendar. These make it more straightforward for users.

Shows information about habits at once

Information on habits was too scattered, making it difficult for users to know where to look.

I made it possible to see all the information on a single page, and the calendar show the next step. It is easy for users to see how consistent the habit is.

01 DISCOVER

I compared various habit-tracking apps to identify their strengths and weaknesses. I find out what makes it difficult to check habits and look at tracking graphs.

Competitor analysis

02 DEFINE

Empathy mapping

Based on pain point of research using empathy mapping. Through this, I figure out the features to focus on and identified what users ultimately desire and what they aim to achieve.

Pain Point

Solution

Button

Make sure users can use the buttons without getting confused and important buttons are clearly visible.

Progress

It shows the progress graph simply and clearly and shows only the user's habits, not the mood score.

Mood

Make it fun for users to use, but less important than habit.

03 DEVELOPE

Before starting the design, I thought about what to show mainly through sketches and wireframes. I focused on designing the app within the parameters of conventional habit-tracking app, while prioritizing user-friendly accessibility to features.

Sketch

04 DELIVER

Considering the visual hierarchy, a high-fi design that can be actually used has been completed.

Onboarding

Journal Page

Progress Page

05 TEST

After the processes were completed, I asked 5 participants to compare the original to the redesign and gave them two tasks:

Swipping to complete or skip a habit
Add a habit of drinking water

Usability Test

Task1 & Task2

Result

The first task was 75% complete, and the second task was completed with some errors. It took about 5 and 15 seconds, respectively.

Feedback

There were often cases where swipe was not recognized, and the menu icon at the top was recognized as an add habit button.

Score of satisfaction

Result

After the test, I asked about satisfaction. The average score is 3.8 points and all of them answered that the redesign was good.

There was feedback that the button for editing at the top is like a button to add a habit, so I changed it to a calendar icon. The edit button is pasted next to the title of today's habit under the toolbar to show that it is an edit button needed for habit.

06 REFLECTION

What I learned from this project

Importance of simplicity

Users should be able to find what they need quickly and easily. If there are too many complicated buttons, users may have difficulty taking action, leading to decreased usability. To improve the user experience, the buttons should not vary too much in color and size.

Decluttering layout

Too much information on one page, users may have trouble finding what they need, especially when scrolling on mobile. In the case of graphs, it can be difficult to read if they are cut off during scrolling. Instead, it is better to break up the information and present it in a step-by-step.

Next Step

I'd like to know more about what motivates users to use a product. It shouldn't just be easy to use, it's a combination of several factors. I want to design a product that users will be eager to use again.