Built a Habit Tracking App with AI
Exploring how AI fits into the modern product development workflow, from planning and implementation to UI refinement and deployment.
Toggle for a quick summary or the full breakdown
Case study
HabitMe
A photo-first habit tracker, designed and shipped solo with AI as a build partner
Role
Product Designer & Builder (solo)
Platform
iOS / Android (Expo, React Native)
Timeline
1 week, May 2026
Tools
Figma, Cursor, TestFlight
Overview
HabitMe is a simple habit-tracking app I built as an experiment to explore how AI tools can accelerate the product development process. The goal wasn't to solve a specific problem or create a feature-rich habit tracker—it was to understand how much of an app could be designed, built, tested, and shipped with the help of AI, and where my own judgment was still necessary.
The app is intentionally minimal: create a habit, capture one photo per day as proof, and track your progress over time.
This project was less about the product itself and more about learning how AI fits into the workflow of designing and shipping software.(If you want to see some stronger product thinking, and more complex technical execution, I'd recommend checking out Blindr.)
Understanding the ground before standing on it
Before opening Cursor or writing a single prompt, I spent time understanding the pieces I’d be directing rather than just naming them. I wasn’t going to write the code myself, but I needed to know enough to ask the right questions and judge the answers I’d get back:
What React Native and Expo actually are, and why most small apps now start with Expo rather than bare React Native
What Expo Go is for (fast iteration on a real device) versus what it can’t do (it’s not your actual shipped app — no custom icon, no splash screen, no App Store presence)
What TestFlight is, how it differs from a public App Store release, and that it requires an active Apple Developer account behind it
Understanding different AI models and choosing the right one for each task.
At a high level, what it actually takes to get an app from “code on a laptop” to “something installed on someone else’s phone” — build, sign, submit, review
This step mattered more than it sounds like it should. Every time something broke later, the fix usually depended on knowing which layer the problem belonged to — was this an app bug, a device-connection issue, or an Apple account issue? Without this groundwork, every error would have looked the same.
The design brief
Once I had the concepts straight, I moved to prompting the build. I didn’t open with a tech stack — I opened with the product, described as user-visible behavior, with reference screenshots attached for the empty state and the active-habit state:
PROMPT 1
Model used - Opus Extra 4.7
Create a Habit Tracking app using React Native. The following are the features and the use cases of the app
1- When there are no habits, the user sees a button to create a new habit.
2- The user types the name of the habit and confirms.
3- Once we have a habit created, we see cards that are tapable in the form of a carousel.The cards can be tapped on to open the gallery and upload an image to show that the habit is done.
4- They can add images of previous days if they have not added it.
5- They can also can also re-upload an image if they want to.
6- If there are more habits, the user can switch between them by tapping on the title on the top of the screen. A chevron will be there beside the title in case there are more than 2 habits.
I have attached the images for the empty states and the states where there are habits for your reference. Ask me any question if you need to before creating the plan.
Reference mockups attached to the opening prompt empty state (left) and the habit card with carousel peek (right).
Once the first version was generated, I asked Cursor how to run it on a physical device. That led me to Expo Go, which allowed me to scan a QR code and instantly view the app on my phone. I wish I had the AI result saved with me so that I could have showed you the comparision, the output was 50% fine and it required tuning. The next section highlights some of the prompts I used during this refinement process and how they helped bridge the gap between a functional implementation and the final UI.
What shipped
Empty state to first habit flow, with no onboarding friction
A 7 day photo carousel with paging interaction and a refined scroll-driven animation
Photo capture, replace with confirmation.
Multi-habit support with a switcher that only appears once it’s actually needed
Fully local persistence no account, no backend, no data leaving the device
A working iOS build distributed through TestFlight.
The goal was never to build a feature rich habit tracker. The app was intentionally constrained so that I could focus on understanding how AI could assist with planning, implementation, UI refinement, testing, and shipping. By the end of the project, the app was functional, stable, and distributed through TestFlight, which was enough to answer the question that started the experiment.
Check out other AI-built products.
Blindr
This is my best attempt till now to build an app using react-native. Blindr is a dating app that solve the problem of photo first, personality last experience.
Cursor
Claude
React Native
Mobile app
Oops, looks like you're on tablet. Sorry for the inconvenience. This portfolio is designed for desktop for now.
Oops, looks like you're on mobile. Sorry for the inconvenience. This portfolio is designed for desktop for now.