top of page

”Little Habits”

Habit Tracker App for IOS

Student Team:

  • Renzo Novelli

  • Andrea De La Torre

Instructor: Snezana Dragusev

School: Iron Hack

Course: Ux / Ui

Tools: Figma

Year: 2023

Timeline: 2 weeks

Quick Links

Use this a menu to skip to the sections of the case study you are most interested in

User Experience

User Interface

Visual Competitive Analysis

Moodboard

Style Guide

Hi Fidelity

Conclusions

Wins

Challenges

Takeaways

Next Steps

Project Overview:

🔧Task for this project

Investigate how technology can be used to help people live healthier lives

🏢The Client

The Daily Health Conference is a fictional client for this project provided by Iron Hack, the client is a non-profit organization dedicated to promoting health and wellness through impactful public talks, participatory workshops, and professional training all over the world.

🧗🏻Challenge

Recently they have seen a substantial ⬇️ drop in memberships.

Now the Daily Health Conference wants to find a way to offer more value to its members. To do this, they have decided to focus on creating a set of digital mobile apps for their members

📉How can we fail?

If the app designed does not attract a significant number of users, or does not increase attention and memberships for the client, then the product would be considered a failure.

Design Process:

We used the Design Thinking methodology.

Empathize, Define, Ideate, Prototype and Test

User Experience

Empathize:

Quantitative Research

 

We created user surveys to gather some context about the habit tracker apps, how people start creating habits and their motivations. About 44 responses were recorded and here are some insights:

  • More than half (61.4%) of respondents were motivated by the goal achievements.

  • 86.4% think that seeing their progress is the most motivating thing while creating a new habit.

  • Almost half (47.7%) do not track their habits because of a busy lifestyle and lack of time.

Qualitative Research

We recorded a total of 5 interviews to gather CC qualitative data. This helped us understand more about the interaction of the user with similar apps, their feelings, pain points and motivations about building a new habit.

Here are some quotes from some of our interviews

 

Affinity Diagram

Now that we got some raw data, we crated an Affinity Diagram to start seeing similarities and trends between all the users information.

 

And here are some insights that we discovered:

  • They like the customizable features of some similar apps or tools they already used to track habits or just to organize themselves

  • Accountability was key for them to kept them motivated

  • Having clear goals was important to start and to continue with any change.

Define Phase

Empathy Map

Having those insights, we worked on an empathy map, so we could get ourselves in the head of our user, and empathize with them and understand better their pains & wants. Pains: Getting Distracted, Lack of Discipline

Wants: Healthier Life, Discipline, Focus

 

User Persona

This helped us to had a clear picture of our user persona and what can be their story. Our user persona is Nicole who is a young professional, she feels she is constantly busy and that she doesn't have time to exercise or get other healthy activities in

 

User Journey

We developed a day in the life of Nicole, where most of the time she is feeling frustrated, not motivated and stuck in a loop of not very good habits. From this day in Nicole’s life we find some opportunities to help her.

 

Knowing who we are designing for, their painpoints and what a life in their day looks like, led us to be able to identify the Problem Statement.

Problem Statement

<aside> ⚠️ Young Professionals need to find a way to create and maintain healthy habits because they lack discipline, accountability, and clear set goals.

</aside>

Ideation Phase

Moscow & MVP

With all the paint points of our user, and having the problem statement clear we started the ideation phase using a MOSCOW map to think through the features needed and develop our MVP.

 

<aside> <img src="/icons/grid-wide_gray.svg" alt="/icons/grid-wide_gray.svg" width="40px" /> Must haves -Habit Entry -Reminders -Customization

</aside>

<aside> <img src="/icons/grid-wide_gray.svg" alt="/icons/grid-wide_gray.svg" width="40px" /> Should Have -Daily Journaling -Motivations -Gamification

</aside>

<aside> <img src="/icons/grid-wide_gray.svg" alt="/icons/grid-wide_gray.svg" width="40px" /> Could Have -Accountability Partner -Productive Task Focus

</aside>

<aside> <img src="/icons/grid-wide_gray.svg" alt="/icons/grid-wide_gray.svg" width="40px" /> Won't Have ****-Video

</aside>

Insights:

  • Customization: we found it important to have the app be highly customizable based on the user interviews, so that they can use the app for many different habits that are tracked in different ways.

  • Accountability Partner: Acknowledging the significance of having an Accountability Partner feature, as users find it easier to maintain discipline with external accountability.

  • Daily Journaling: Responding to users' preference for using notes apps for habit tracking, a should have feature is introducing a Daily Journaling feature for users to freely write and document their thoughts.

Crazy 8

This tool is great to get a lot of ideas down in a quick manner, for example one idea was having a feature that gives you reminders/or changes your background with inspo text about WHY you are building this habit, which later on led to a feature on the prototype where you can customize your reminders.

 

Worse Idea

This tool is a great way to think outside the box, when you are thinking of ideas that are bad, it flips the way you think about the problem, and after some filtering it helps get to an idea that might be useful.

 

We both thought of ideas where the app sends a message to your friends telling them that you are a failure because you have not done your habits, but when flipped this turned into a feature that instigates your friend to send you encouraging messages for you to accomplish your habits.

Prototype and Test

Concept Sketching

We got some ideas down on paper, and started to visualize what the app & screens could look like using some of the features that we got from the ideation stage.

 

Low-Fidelity prototype

We then designed our Low-Fidelity prototype and did some usability test with users. Based on their feedback and keeping in mind our user persona we made changes so we could start our mid fidelity prototype.

 

Mid-Fidelity Prototype

Based on the tests we did with user with our Low-Fi and some other test using the first version of our Mid-Fi, we change some features and added other so the experience could change. We discovered that the app should be specific and simple. Customizable and straight to the point.

 

User Interface

Visual Competitive Analysis

We analyzed the visual identity of our competitors.

 

Moodboard

We developed a MoodBoard and chose our brand attributes catering to Nicole, our User Persona with the intention of making an app that felt friendly for the user, to empower them to be able to change their habits one small step at a time.

 

Style Guide

During this section we also brainstormed the name for the app, since the idea was to keep it friendly we distilled it down to “Little Habits” and to continue to the idea of friendliness we illustrated fun and simple characters that represent the Little Habits you are building during the process.

 

Hi-Fi prototype

Applying this visual design and the elements of our Mid-Fi, we got our High Fidelity wireframes. Adding colors and details adds a level of emotion and connection to the product.

This is where we see Nicole using our solutions and improving her life by starting to create new habits while giving her the accountability she needs and some extra motivation.

 

1.Welcome screen is the welcome screen, making it very clear the product guides you to start your journey with creating your first habit.

2.Habit Creation is where you fill out your habit information including a “Why” Section, this gives user a sense of purpose which helps them to stick to their goal.

3.Home Screen we see a very simple layout with 3 habits at a time, an accountability partners section, and a Daily Motivation section, where you will receive tips & tricks for you to stick to your goals.

 

1.Habit’s screen, here you can customize your habit and look at the progress, the blue line circles show how much of a process you’ve had on the day, helping users feel that there is progress even if they didn’t fully accomplish the goal they set for themselves daily

1.b.Reminders gives you the ability to edit and turn on/off your reminders.

2.Settings Lets you customize your options

3.Accountability Partners & Groups This screen lets you add, chat and make group with friends, for you to keep each other accountable and to motivate each other.

3.b.Friend’s Profile Here you can view the percentage of completion of their habit (instead of real data, to keep some sense of privacy for the user) and you can send premade messages to motivate them on each habit, or congratulate them for finishing this habit, and you have the ability to chat with them through a regular chat feature.

4.Journal You can write daily with also space for random prompts to give you ideas to write, with an added mood tracker bar.

Conclusion

We would consider this project a success based on the feedback received. Users express excitement about this tool. However since this is a student project we didn't have the capacity to put the product into the world and get real feedback on client attention and memberships. Nevertheless the feedback we got from testing assures us that we are in the right direction with the app.

Our suspicion is that with the friendly branding in place, it could translate to a smooth process of marketing the app , potentially leading to a significant number of user adoptions.

Wins**:**

<aside> 🏆 Users Loved it & see it as an useful tool: Users we tested the prototypes with remarked that this felt like a very useful tool, with one user asking “when is this app releasing? I really want to use it”

</aside>

<aside> 🏆 Fun and approachable product: The UI aligned with the brand attributes and messaging, making the experience of building habits seem like a fun and easy process.

</aside>

<aside> 🏆 Reminders: For users that don’t love reminders, having the option to turn them on/off and customize what they say was a great feature.

</aside>

<aside> 🏆 Clear & Easy to understand: We found our users to be able to navigate the prototypes with ease and where able to find everything they where looking for.

</aside>

Takeaways:

<aside> ✅ Privacy: Users like to keep information like their health or habits private, so they are not open to sharing it publicly, but in the case of close friends they are way more open, so it’s important to keep this idea in mind with the Accountability Feature, keeping it in small circles and for it to not expand into a board or social media like

</aside>

<aside> ✅ Simplify: Although Users expressed a need for a lot of customization, keeping the main way to use the app simple and clear helps the user get to where they need first, then you can add options for customizing that are more advanced.

</aside>

<aside> ✅ Designer Roles: This was a great project to work with Andrea, although we both took parts on all the process it was great to see that I could really a lot more on her when it came to UX and due to my background in Design we could rely more on me for UI

</aside>

Further Steps:

<aside> ➡️ Customization: The final version of the app could be more customizable for tracking different habits that require different sets of metrics, while still keeping the design simple and minimalistic, this is the level of sophistication we aspire to get to, keeping the design customizable and robust while simple and very user friendly.

</aside>

<aside> ➡️ Mood Progress: Designing a screen for showing data where you could see a correlation on your daily mood and the habits you’ve achieved can be a good way to keep users informed and make them take better decisions about what habits to keep doing and how this habits are impacting their mood overtime.

</aside>

<aside> ➡️ Expand Platform Accessibility: Make the app adaptable for Android devices and smartwatches.

</aside>

<aside> ➡️  Iterative Testing: Continue testing the High-Fidelity prototype.

</aside>

Thank you for reading!

bottom of page