preview
← Back to work
Case study/Legion Design System/Telkom Indonesia · Jan–Oct 2025

One system for 24 brands and hundreds of people building.

Telkom Indonesia ships a lot of products, across a lot of brands. Every team kept rebuilding the same buttons — just never the same way. I led Legion, a multi-brand design system, steering a team of 20 designers and 20 engineers to make one set of parts that works everywhere.

24brands served
600+designers & engineers
3platforms supported
Visit website
Legion Design System homepage
RoleDesign System Lead
Team20 designers · 20 engineers
TimelineJan–Oct 2025
Scope24 brands · 3 platforms

Everyone built the same button. Differently.

Twenty-four brands, hundreds of people, and no shared kit. So every team kept reinventing the basics.

Buttons here, buttons there, all subtly different. Designers and engineers kept redoing each other’s work, and since every feature started from a blank page, shipping was slow. The bigger the product got, the worse it spread: harder onboarding, accessibility quietly skipped, and a pile of brands, teams, platforms, and frameworks each pulling their own way. What got designed and what got built rarely matched.

Inconsistent UI across brandsDesigners & devs duplicating workEvery feature from scratch

Where the time was going

I talked to teams across the company and traced where work kept piling up. Three things came back again and again.

Same work, many times overDesigners and engineers kept rebuilding parts that already existed somewhere else.
Design said one thing, code anotherWhat shipped drifted from what was designed, so quality was a coin toss.
Scale made it worseMore brands, teams, and frameworks meant the cracks multiplied as we grew.

What “good” had to mean

Before designing anything, we wrote down the targets. If Legion couldn't move these, it wasn't working.

Faster delivery and higher team productivity.
60%Accuracy between design and development output.
Asset reuse across the multi-brand platforms.

Four bets

1One source of truthA single library of parts that every product pulls from.
2Design and code in syncAssets and components matched in real time, so handoff stops being a translation job.
3Built for many brandsThemeable foundations — one component, any brand, any platform.
4An open communityAn internal open-source channel so every team can contribute and adopt.

What we shipped

Legion shipped as a real toolkit, not a slide deck.

One component, themed for any brand — same code underneath
Brand AContinue
Brand BContinue
Brand CContinue

A cross-platform UI kit and library, kept in sync in real time so design and code stop drifting apart. Standardized templates for the patterns that keep coming back. Plugins, instant handover, even AI/MCP integration to make adoption painless. And a documentation site plus app covering the whole asset library, guidelines, and standards. We launched it in the open at DTP Expo #2.

UI Kit + LibraryCross-platform, integrated in real time.
Templates & patternsTested, standardized, ready to reuse.
Plugins & handoverInstant handover, plus AI/MCP integration.
Docs site + appAssets, guidelines, and standards in one place.

Built with engineering, not just for it

A design system lives or dies on whether engineers actually adopt it. So I built it with them, not at them.

We agreed on a component architecture that held up across frameworks and platforms, and kept design and code in sync in real time so handoff stopped being a rebuild. A part only shipped once it was proven on both sides — design and engineering. The calls were driven as much by what was feasible to build and maintain as by how it looked.

What I owned

I set the roadmap. Forty people across design and engineering needed one direction. I shaped where Legion was heading and the order things shipped, so the work added up instead of scattering.

I brought AI into the workflow. I pushed to fold AI into Legion so designers spend less time on repetitive setup and more on the actual design — speeding the whole team up without dropping quality.

What changed
Faster deliveryAnd a clear lift in team productivity.
80%Design-to-dev accuracyWhat shipped finally matched what was designed.
10×Asset reuseConsistency across every brand and platform.

Beyond the numbers, Legion trimmed development cost by around Rp100M and shifted how teams think about reuse. It also took home Best Documentation at the Design System Award 2023.

What I’d carry forward

A design system is a product, and its customers are the teams using it. Treating it that way changed everything.

What I’d carry forward

Numbers earned the buy-in. Agreeing on success metrics up front is what got stakeholders on board.

What I’d carry forward
Read another projectView all →