Kaizen Tracker
The Product
Concept → Build → Ship
Kaizen (改善) is a Japanese philosophy of continuous, incremental improvement. Kaizen Tracker is a personal app built on that idea — a tool for logging things worth changing in your life, tracking how they're going, and seeing whether they actually stick.
I designed and built this solo from concept to deployed product. It's a live, working web app — not a prototype.
kaizen-tracker.vercel.app (login required — free to create an account)
Timeline
Jan 2026 – Present
Platform
Responsive Web App
Role
Product Designer + Developer
Desktop home view — click to enlarge
Design Approach
Owning the full stack — design through deployment — meant every decision could be made with both user needs and technical reality in mind simultaneously. No handoffs, no context lost in translation.
Status Lifecycle
Considering → Trying → Adopted / Abandoned. The friction is intentional. Moving an improvement forward requires a deliberate tap — it prompts you to actually reflect on whether it's working, not just forget about it.
Impact & Effort Ratings
Every improvement gets rated 1–5 for impact and effort. The goal: surface quick wins (high impact, low effort) at a glance and help you sequence improvements in a realistic order.
Category Taxonomy
Eight categories — Health, Career, Mindset, Relationships, Finance, Learning, Productivity, Creativity — designed to cover life domains without becoming an overwhelming taxonomy that nobody uses.
Annual Goal Bar
A progress bar showing improvements adopted toward an annual goal (e.g. 10/100). Borrowed from habit research: visible progress toward a concrete target is a stronger motivator than open-ended streaks.
Mobile-First Layout
Most reflective journaling happens in small moments — on the couch, in line, right after a realization. The core flows are designed for one-handed mobile use first. Desktop gets a side-by-side panel layout for deeper review sessions.
Process: I sketched rough flows on paper, then iterated directly in the browser using Tailwind. No Figma — building in the actual medium kept me honest about feasibility and forced real decisions faster.
The Stack
Choosing tools for a solo build that could actually ship — and scale if it needed to.
Next.js
React framework with file-based routing and server components. Fast to build, easy to reason about, and deploys seamlessly to Vercel.
Tailwind CSS
Utility-first styling. Kept the design system consistent without writing custom CSS files. Ideal for iterating UI quickly without context switching.
Supabase
Auth (email + password), PostgreSQL database, and row-level security — so each user's data stays private. Saved weeks vs. building auth from scratch.
Vercel
Hosting and serverless functions with automatic deployments on every push to main. Zero-config for Next.js projects.
GitHub
Version control and the trigger for Vercel's CI/CD pipeline. Push to main, app deploys automatically — no manual steps.
Claude Code
AI-assisted development partner. Used throughout the build to scaffold components, debug edge cases, and review patterns. More on this below.
Development Process
How I used Claude Code as a development partner — and why directing AI effectively is itself a design skill.
I used Claude Code throughout the build: scaffolding components, debugging tricky Supabase RLS policies, reviewing data model decisions, and working through edge cases in the status lifecycle logic. But the most important thing Claude Code can't do is decide what to build — that required constant UX judgment on my end.
The iterative loop looked like this:
Idea
I'd identify a feature or UX problem — e.g., "users need to see their quick wins, not just a flat list"
Design Intent
Articulate the intent clearly — what problem this solves, what constraints exist, what "done" looks like
Prompt → Output
Claude Code scaffolds the implementation, suggests patterns, surfaces potential issues
Review & Refine
I evaluate the output against the original intent — does this actually solve the problem? Does it feel right in the browser?
Ship
Push to main, Vercel deploys, check it live on my phone
"Knowing how to direct AI effectively — giving it context, constraints, and clear intent — is itself a craft. The designers who learn this are going to outpace the ones who don't."
Key Features
The app in action — a walkthrough of the core screens.
Improvement Feed
Designed for quick scanning. Status badges and category chips let you assess your full list without reading every entry. Sort and filter keep the signal high.
Log Improvement
Minimal required fields to reduce friction at the moment of insight. You can always add more detail later — but if logging is a chore, you won't do it.
Filter & Review
Filter by category and status to find patterns: where do you abandon changes? What categories do you never touch? The data surfaces what you'd miss by scrolling.
Entry Point
The login screen sets the first impression — brand color on the primary action, no distractions. Auth is handled entirely by Supabase, so this screen's only job is to get you in cleanly.
Deployment
The full pipeline from local change to live app in under two minutes.
Local
Code Change
GitHub
git push main
Vercel
Auto Deploy
Live
kaizen-tracker.vercel.app
Auth & Data
Supabase handles email/password authentication and stores all improvement data in PostgreSQL. Row-level security (RLS) policies ensure every user can only read and write their own data.
Serverless
Next.js API routes run as serverless functions on Vercel. No server to manage or scale — it handles traffic spikes automatically and costs nothing at low volume.
CI/CD
Every push to the main branch triggers a Vercel build. Preview deployments are generated for branches, so I can check changes on a live URL before merging.
Reflection
What building this taught me — as a designer who writes code.
Design ↔ Build Feedback Loop
Designing and building simultaneously made every decision more grounded. When I knew I'd have to build it, I designed more realistically. When I was building, I made better design calls because I knew the product deeply.
Constraints Drive Simplicity
Implementation constraints turned into design virtues. The minimal log form exists partly because a simple form is easier to build — but it's also just better UX. Constraints forced me to prioritize what actually mattered.
AI Amplifies Product Thinking
Using Claude Code effectively requires strong product thinking. Vague prompts produce generic results. Clear intent, good context, and defined constraints produce output worth shipping. The quality bar is still yours to set.
Next Steps
- Native mobile app (React Native) — so logging a quick improvement feels as fast as a note
- Data visualizations — category breakdowns, adoption rates, effort/impact scatter plots
- Shared team improvements — extend the model to small teams tracking collective kaizen
- Export — CSV or PDF summaries for personal review or sharing with a coach/manager
Thank you
Thank you for your time reviewing my work on Kaizen Tracker!
If you'd like to get in touch, please say hi!
claytonanderson.work@gmail.com
