Building a unified design language for a growing wellness platform — enabling a small team to ship consistent, accessible experiences at scale.
Outcomes
Created the core design system for NatureCounter, a wellness app promoting outdoor journaling. The challenge was building a scalable token-based system that non-design-system-savvy engineers could implement without friction — while maintaining visual richness across 40+ component types.
I led the design system initiative from scratch — establishing foundations, building a component library in Figma and code, and creating documentation that made adoption easy for engineers with zero design background.
Industry
Wellness · Outdoor Journaling
Timeline
2024 — Present
Platform
iOS · Android · Web
Components Built
40+ production-ready
Skills
Design Systems · Tokens · Figma Variables · Accessibility · Documentation
Users
100,000+
Nature Counter had been designed piecemeal by different contractors over 18 months. Each surface — the iOS app, the Android app, and the web dashboard — had diverged in color, spacing, typography, and interaction patterns.
Engineers were spending significant time debating implementation details that should have been pre-decided. Each new feature required redundant design work because there was no reusable foundation to build from.
"Every time we shipped a new screen, I'd catch three things that didn't match the rest of the app. It was death by a thousand cuts."
— Engineering lead, internal retro sessionDesign systems fail when they're built in isolation. I started with a cross-functional audit — involving both engineers and the product manager — to ensure the system would actually be used, not just admired.
The Nature Counter Design System launched with a token-first architecture. Every color, space, radius, and motion value is a named token that maps from primitive → semantic → component. This means theme changes (like dark mode) require updating one layer, not hundreds of individual values.
Three months after full rollout, measurable improvements across every tracked metric. The 45% handoff speed improvement translated directly to shipping velocity — the team went from 2-week feature cycles to under 10 days for medium-complexity features.
"Now when someone asks 'what does a modal look like in this app?' — there's one answer. That alone cut our review cycles in half."
— Product Manager, Nature CounterAll available files from the Nature Counter image folder are surfaced below for quick review and reference in one place.
Design System Overview
Component Library
Design Tokens
Interaction Patterns
Mobile Component
Iconography
Spacing & Rhythm
Conclusion
Nature Counter taught me that design systems are the most leveraged design work you can do — every hour invested in the system pays back across every future feature, every future engineer, every future sprint.
The 100K users on the platform never see the design system. They just experience a product that always feels coherent. That invisibility is the whole point.
Glad we could cross paths.
Out of anywhere you could be, you're here.