Design System Journey
Three scalable systems, one philosophy — balancing structure, flexibility, and accessibility across startup, public sector, and no‑code products.
👋 Let me introduce my Design System projects
0→1 Foundation
LOG
0→1 foundation for fintech & healthcare platform.
See more
Scale
CanD
100+ Massive variant libraries for block-based editor
Contact Me
Accessibility
New Jersey Web
Accessibility-first public sector system (WCAG 2.1 AA)
Contact Me
Context
Designing for scale, speed, and clarity
I’ve led three large-scale design systems, each addressing different scalability and accessibility challenges — from fintech to public sector to no-code platforms.
This page highlights the LOG Design System, where I built a scalable, cross-functional foundation that transformed fragmented UI patterns into a unified product identity and accelerated development workflows.
Curious about the A11y or no‑code systems? Reach out anytime.
I’d love to share more.
Deep dive in LOG Design System today!
LOG Design System
Building a scalable 0→1 foundation
Background
When I joined, the product had been built almost entirely by external agencies. There was no in-house design function, no system, and no coherent brand. As the app expanded into a multi-service “super app,” UI patterns diverged across teams, data visuals were inconsistent, and delivery slowed. I stepped in as Lead Product Designer to establish the brand from first principles and translate that into a scalable product foundation.
Role
Lead Product Designer
Team
Product Designer
Engineering Team
Responsibilities
Design System
Timeline
6 Months
Challenge
There was no in-house designer, no design standards, and a fragmented, agency-built product — where I rebuilt consistency, ownership, and trust from the ground up.
Opportunity
Transform a fragmented, agency-built product into a unified ecosystem by defining the brand mission and building a from-scratch design system that aligned business, UX, and engineering.
What I did?
I led the end-to-end creation of the LOG Design System by defining brand mission, visual identity, and scalable UX foundations that unified design, engineering, and business goals.
Design principal
Foundation
Color
Defined a structured color hierarchy using LOG’s Brand 50 as a core identity hue, ensuring clarity and accessibility in health data visualization.
LOG Color
Added normal, caution, and danger system colors to indicate the user's health status.
Illust Color
Added illust colors to be used in illustration graphics
Icon
Redesigned the icon system into filled, color-coded sets (16–50 px) to enhance warmth, legibility, and platform consistency.
Typography
Implemented Spoqa Han Sans Neo type scale to improve readability and hierarchy across health and finance content.
Components
Built 100+ reusable components from inputs to buttons, standardizing states, behaviors, and accessibility patterns.
Takeaway
Building the LOG Design System from zero taught me that a strong system starts with people, not patterns.
By redefining the brand’s mission and translating it into scalable design principles, I learned how to bridge the gap between business goals and design clarity.
Most importantly, I realized that a design system is not just a library. It’s a shared language that empowers teams to move faster, stay aligned, and build trust.
