DayTwo

Role
Product Designer (AI)
Client
ONOW Ascent
Year
2026
Tools
VS Code, Lovable, Claude Code
The app now ships on the new design system, and the development team builds against it without a designer in the loop.
What's DayTwo?
DayTwo is a finance tracking app for small cash-business owners. Shop owners and vendors record daily income and expenses, track debts they owe and debts owed to them, and get help from Bizzy, an AI agent that keeps an eye on their money and suggests what to do next.
The people using it are not the people design systems usually get built for. Many are on low-end Android phones and are offline for stretches of the day. Most users are using an app of this kind for the first time, with nobody sitting beside them to explain it.

One Source of Truth
Two artifacts means two sources of truth, and they start drifting the week engineering begins building. On a small team shipping fast, that drift isn't a risk — it's a schedule.
So the source of truth became tokens, written once, in code. The docs site, the React Native components and the AI harness all read from them. The previews on the documentation site are the shipping components.

How It's Built
The design system is written in React Native. Every component runs on iOS and Android from the same code. There is no separate iOS version and no separate Android version to keep in sync.
Developers import a component and pass props. Spacing, colors, type sizes and states come from tokens inside the component, so they do not have to look up values or copy styles from another screen. Variants are props, not separate components.
Each documentation page shows the exact code for the component, so it can be copied straight into a screen.

One Color Per Screen
A first-time user scans for the brightest, most saturated thing on screen and assumes that's what to tap. No amount of clearer labeling changes that, so the color has to do the work.
Teal is spent on one thing per screen — the primary action, or the single element that should be noticed. Everything else stays neutral. Demoted, not hidden: still perfectly legible, just not competing for the eye.
It's a restriction on the system's own brand, and it's the rule most often broken by accident. Two primary colors mean no primary.

A ฿3,000 Phone
The system writes its performance floor as a price, not a spec: a ฿3,000 phone. That's the device the people using DayTwo actually hold.
It turns into a budget. Only transform and opacity animate, because animating layout forces a re-layout every frame and stutters. Blur and shadow are capped at a couple per screen. Any list of user data needs an answer for 500 items, not an unbounded map in a scroll view.
Touch targets take Android's 48dp floor, not Apple's 44. Owners tap quickly between customers, one-handed, sometimes on a cracked screen. When a layout gets tight, the target wins and the content moves.

Old Screens, New Rules

Seventeen Ways to Break

Built to Be Read by AI
The docs site and the components read the tokens. So does a third reader: a Claude Code plugin that ships with the system.
It installs three skills — create, review, simplify. Each one reads the generated tokens.json and USAGE.md at the moment it runs, not a copy written down earlier. Agents that can't take a plugin get the same rules as a pasted brief.
It's the same bet as the rest of the system. A prompt that describes the rules drifts the way a Figma file does. A skill that reads the source can't.

Twenty Nine Components
Twenty-nine components, every one a real React Native export. The previews on the documentation site are the shipping components, so the code on each page is the code that runs.
Every page follows the same ten sections: live preview, purpose, anatomy, variants, code, when to use and when not to, the correct scenario, anti-patterns, edge cases, and the exact tokens it pulls from. The template is the governance. A component isn't documented until it has shown its wrong version and named the states it handles.
They divide by what the owner is doing — entering money, reading it back, or hearing from the coach.



What Outlasts Me
The system's stated reason for existing is succession: tokens written once, so the app, the documentation and the rules stay in agreement after the people who built it move on.
That part isn't finished. There is no changelog, no versioning, no deprecation policy and no named owner. A system designed to outlive one designer currently depends on one.
Drift came back somewhere new, too. The documentation still says the app ships in Burmese and English. It ships in more languages than that now, in more markets. The system closed the gap between design and code, then opened a smaller one between the docs and the product.


