Habit Tracker

A project created by Franz-Aurel Huber and Marcus Fichtinger during the creative codelabs at the UAS St. Pölten.

Overview

We have chosen use case C and decided to develop our own idea. The app is supposed to be a habit tracker. It should help users of any age keep track of a habit and keep those habits or maybe break bad habits in the long term.
Users can add habits they want to get accustomed to into their daily life. They then can tick a habit they have done for that day as finished. Users can get reminded by the app, that they should check on their habits and also get motivated through them.

Example use cases:

Some example apps:

HabitNow, Loop Habit Tracker

Userflow

Userflow

Hi-Fi App Designs

Main Screen Add Screen Edit Screen Statistics Screen

Database table

Database Layout

Heuristic Evaluation

For the heuristic evaluation, Nielsen’s 10 Heuristics were used.

Visibility of system status:

Positive: The app provides feedback through UI elements like toasts and text updates.

Match between system and the real world:

Positive: The use of icons for "Add", "Edit", and "Stats" is in line with other apps, well-known and consistent.

Negative: Some technical terms or icons, such as the circle when it is not checked, might not be intuitive for all users.

User control and freedom:

Positive: Users can navigate back using the "Back" button or the system-wide gesture.
Users can undo a checkmark by using the same swipe gesture or by tapping the same button again.

Negative: The delete button might be frustrating because of accidental deletion, because there is no confirmation dialog, for example. (Changes will be made accordingly)

Consistency and standards:

Positive: The app uses consistent design patterns and color schemes.

Negative: A swiping gesture might not be the most known standard (intuitive) for ticking off a checkmark, therefore a tap to check should also be implemented. (Changes will be made accordingly)

Error prevention:

Positive: The app minimizes errors by providing clear options and feedback, such as when trying to check a habit on a day other than the set repeating day.

Negative: Some error prevention mechanisms might be too restrictive, limiting user flexibility. (Delete confirmation might slow down a user)

Recognition rather than recall:

Positive: The app displays options and information directly, reducing the need for memory.

Negative: Users need to remember which day they set to repeat on the main screen, because it only tells the user how many days in the month this day exists. A user also needs to remember the swipe gestures (Changes for redundancy will be implemented - Expert Users)

Flexibility and efficiency of use:

Positive: The app supports efficient navigation with buttons, gestures and transitions.

Negative: Advanced users might find the app lacking in terms of customization options.

Aesthetic and minimalist design:

Positive: The design is clean and focused, with minimal clutter.

Negative: Minimalist design might lead to oversimplification, hiding important features or information behind icons etc.

Recognize, diagnose, and recover from errors:

Positive: The app provides clear feedback for actions, helping users understand the system state.

Negative: Error messages might not be detailed enough to help users diagnose and recover from issues.

Help and documentation:

Positive: The app's design is intuitive, reducing the need for any documentation.

Negative: Lack of any tutorials or documentation might leave users confused and frustrated. (Changes have been made - Onboarding added for first-time users)

Test Protocol

The main focus of our user test is to find out any problems or unintuitive elements of the app. By testing the ease of use of many functionalities of the app, we want to determine if there are confusing or unintuitive parts that need reiterating. Besides the methods mentioned below, observations also play a part in determining where a user might be struggling. Information about the user test was given to the participants at the beginning of the form.

Hypothesis

Methods used

Testing Protocol:

Starting Task: Add as many habits as you would like to and play around with the app.

Task 1: Please create a new habit that repeats every Monday and has the name "Meditate". You can also choose any color of your liking.

SEQ

Task 2: Please edit the habit created beforehand and change the repeating day to "every day".

SEQ

Task 3: Please mark the habit you just edited as finished for today.

SEQ

Task 4: View the days on the "Meditate" habit where you finished the habit.

SEQ

SUS

Additional questions

User Test Results

Overview

In total 7 participants did the user tests with 2 different versions of the app. Between the 2 different versions of the app, the app was updated accordingly depending on the received feeback of the participants. Because of the large amount of feedback only 3 users did the first test before already doing changes to the app.

Demographics:
First test: 3 male 20-25
Second test: 1 male, 2 female 19-24 ; 1 female 50-59

SUS Scores

The average SUS Score of the 1st test was 65.83. And after making the changes based on the feedback received by users the average SUS Score of the 2nd test was 85.625. The SUS Score increased by around 20 points, which speaks in favor of the made changes.

SEQ Scores

The process of editing (Task 2) was significantly more intuitive after the changes were made. The changes included an onboarding tutorial and the ability to click the circle itself to tick off a habit. Task 4 is left out here, because in the first test version there wasn't a 4th task, therefore it can't be compared.

SEQ Before SEQ After

Gesture intuitiveness

As described before the tutorial helped users understand the swiping gesture to tick off and edit a habit. Before the changes a total of 3 people said the gestures were unintuitive. After the changes 3 people said the gestures were intuitive with 1 person still finding them unintuitive.

Gesture Intuitive Before Gesture Intuitive After

Most relevant feedback and made changes

App Screenshots

Tutorial Main Screen Gesture 1 Gesture 2 Edit Screen Stats Screen Notification

Final reflection

Franz-Aurel Huber

I am very proud of how close we got to our initial Figma designs and our vision of how the app should work and behave. The app looks almost identical to the mockups we created and feels good and stable to use. We started the entire project with a shared Kanban board (Trello) to keep track of what still needed to be done. This turned out to be a great idea because, on the one hand, the workload was split very evenly, and on the other, the variety of coding challenges each of us had to implement was great because we always just picked the next item on our "Not Started/Ideas" list as soon as we finished something.
If we had more time for the project, I would have loved to polish the notification feature even further with features like marking a habit as done directly from the notification or setting a specific time to be notified by the app. Another feature I would have liked to see, which we weren’t able to implement, was reordering the habits on the MainView.

Marcus Fichtinger

The most challenging part overall was definitely the constant reiterating of the app design based on user tests. The tasks were spread by having a shared task list where we both worked on different parts of the app. The initial design was mostly done by Franz and the database setup by Marcus, with the rest of it being split up evenly.
We have gotten very close to our initial concept and I think we have reached everything we aimed for. The notifications aren't as customisable yet as we would have liked them to be and the statistics screen could have more information to motivate a user to keep up with their habits. For example scrolling back through the past months.
But overall we are very happy with the outcome of the project.