Tokopedia’s first design system, Unify Merah Putih: One for All, launched in 2016 with a philosophy: a single design language used across 3 platforms and 2 experience (Customer and Business experience). By 2020 it rebranded into Nest, introducing new typography, icons, colors, and motion.

However, rebranding didn’t fix the core governance issues:

1. Primitive, non-scalable tokens.
2. Uncontrolled component adoption.
3. Poor quality UI kits without standards, leading to broken experiences.
4. Lack of governance and processes, resulting in inconsistent usage.
5. Slow bug resolution, frustrating both designers and engineers.

With 100+ designers and 200+ engineers building products across diverse business lines. Without a well-governed design system, scaling becomes chaotic:

• Designers waste time fixing or using components.
• Engineers face mismatches between design and code.
• Inconsistency weakens brand trust across platforms.

A strong governance model was essential to enable speed, consistency, and scale.

To measure impact, I focused on 4 key areas:

• Adoption: higher usage of standardized libraries across tribes.
• Consistency: reduction in detached/duplicated components.
• Efficiency: less design-engineering misalignment.
• Satisfaction: positive feedback from designers using the system.

Based on voting and discussion, I focused on solving fundamental, high-impact problems:

• Standardizing libraries.
• Establishing governance and ownership.
• Create the component documentation.

Once the fundamental things are finished, I can continue to handoff the component specs to the front-end engineers. This will be our foundation for long-term governance.

This is fixing the main issues such as component structure, layer naming, browsing experience, etc. I started by fixing the foundation library and core components, this was the most critical step to ensure all processes could run in parallel. Since Tokopedia is a mobile-first platform, I prioritized the mobile components first, followed by desktop and other libraries.

I documented the entire process as a case study, so it could be replicated with same standard. Given that Tokopedia had two types of libraries, Core and Tribe, I took full ownership of the Core library, while delegating Tribe libraries to their respective design teams as maintainers and with myself as the reviewer before they publish the library. This structure was supported by the workflow and governance I had prepared.

There were two documentation challenges to solve: design system documentation and Figma project documentation. We’ve 40+ component mobile library same as desktop, tight timeline with only 2 people in the design system we could die haha 🤣

Therefore, to speed up the process, I collaborated with the Principal Designer to support component documentation for both mobile and desktop. This effort resulted in clear, reusable documentation and templates that streamlined future contributions.

This was divided into two projects: Internal design system workflow and Cross-functional workflow (Working Group) for adding, improving, or deleting Core/Tribe components.

I partnered with the Principal Designer to design the Working Group workflow, ensuring clarity and accountability across teams. The outputs became essential assets for maintaining long-term governance.

This project was more than fixing a library. It was about rebuilding governance, trust, and scalability. By turning Nest into a governed ecosystem, we empowered teams to ship faster and more consistently, impacting millions of users.

It became even more valuable when Tokopedia was acquired by GoTo and TikTok Shop. The new governance make the collaboration process smooth, level up the designer deliverables, and standardize the design process. Leading this project taught me so much across different aspects through multi-team collaboration, and it became a strong foundation for my growth and for facing future challenges.