Jaewan Byun
Background
Examples of UI fragmentation in previous designs
Why did I decide to build a design system?
When I joined Lycle Company, the team was growing fast and new designers were starting to join. But the way we worked was still very much up to each individual. Every designer had a different style in their files, and even the same UI had to be rebuilt from scratch each time.
Some buttons were rounded, some had no shadow, and some weren’t even Figma components. These small inconsistencies added up. They led to repeated feedback loops, constant revisions, and burnout on the design side. Handoff with engineers became more and more draining.
Most importantly, the user experience started to feel different on every page.
Experience gaps in our previous workflow
Goal
For me, a design system isn’t just a tool for organizing components.
It’s the foundation that helps the whole team work with the same standards, move faster with experiments, and cut down on unnecessary communication.
Process
1. Research and Understanding
The first thing I did was to understand what we were building.
I reviewed the entire existing UI and organized duplicated elements and frequently used patterns one by one.
I also looked into design systems from similar B2C SaaS products to check which standards we were missing.
2. Establish Design Principles
Before jumping into components, we defined the principles we wanted to follow.
For LYTEM, we set these three as our core principles.
Design Principles of LYTEM
3. Define Basic Necessities
I started by organizing the core style elements that are shared across all screens. This included typography, color tokens, icons, and the layout system. I saw this foundation as the backbone of the design system and the most critical piece for driving visual consistency.
Defined LYTEM’s foundational styles
4. Organize Components with Prioritization
We started with the most commonly used components like buttons, input fields, and modals.
Our approach was to build what we needed first, then expand gradually. What mattered most was making sure every component behaved predictably across different situations.
Organizing components
5. Component review and quality check
The goal of a design system isn’t to make things look tidy. It needs to actually work.
So I carefully checked that each component functioned properly with Auto Layout and Variants, that master and instance relationships stayed intact, and that any updates to style tokens applied consistently across the system.
Page-level components
6. Handoff and Continuous Iteration
Collaborated with the engineering team to ensure proper implementation in Storybook.
Improved components based on feedback from real product usage.
Documented the design system and shared it through Notion and the Figma library so the entire team could use it easily.
Documentation in Figma and Notion
LYTEM: Lycle’s Design System
Foundation
Input components
Display components
Feedback components
Navigation components
Lessons from building LYTEM
Building a design system at a startup isn’t about tidying things up.
It’s about reducing chaos, speeding up collaboration, and most importantly, creating a shared language that helps deliver better experiences to users.
Since launching LYTEM, the team has been able to move faster. Design and engineering now stay in sync more easily whenever we ship new features. Most noticeably, the overall brand experience has become far more consistent across the product.
In fast-moving startups, a design system isn’t a luxury. It’s a tool for survival.
