Type
Personal Project
Date
Sept – Oct 2023
Frameworks & Tech
SwiftUI, SwiftData, Figma
Every day, I found myself putting off tasks that I needed to do, only
remembering when the day had already passed. I wanted a way to keep
track of these habits. Turning to the app store, many of the apps were
cluttered with features and locked simple functions behind paywalls.
I sought to create an app that would alleviate my problem, leeting
users create a wide range of habits, sort them into categories, and
feel motivated to achieve their goals.
The first couple weeks of the project were dedicated to creating a home page with a date carousel where the user could perform CRUD interactions on habits. The habit model was originally developed using CoreData, but I was made aware of SwiftData's recent release after a few days of work and rewrote the code. Since SwiftData is not very capable when it comes to storing small quantities of data/variables, the habit model has become extensive, storing current streaks, dates and their completion statuses, etcetera.
Once the base actions were developed, I could begin deriving
statistics from each habit. I developed a grid to display habits and
their current streaks which are calculated and updated once the
statistics page is entered. There's also a weekly completion view that
shows a user's progress with colors that are tied to each habit
status.
The visuals attempt to convince users to continue competing habits by
displaying negative colors when missed, reminding them of previously
missed habits, and forcing them to consider the progress they've
already made.
After having completed the homepage, statistics page, and basic reset
functions in the about page, I could focus on a few extra features
that would polish the app. I designed and implemented a timer that
could be activated on any habit with a minutes unit, displays confetti
when finished, and has its progress halted and saved upon exiting. I
then updated designs throughout the app to be more cohesive and
streamlined before finally adding in an achievements page.
I used Figma to design my own achievement badges which would be
displayed within a new achievements page in the app. These unlockable
icons would futher reinforce habit completion and expand the ways in
which the app appeals to a user's intrinsic reward system.
All code for the confetti effects was provided by @shaundon on GitHub under the repository ConfettiDemo.
Basic style concepts were taken from Habit Tracker mobile IOS App by Purrweb UI/UX Agency on Dribble.