LERN Design System
Maintaining a shared design system across products, designers, and teams
Professional Project
01 — Project Overview
LERN is a design system used across products within the Sekolah.mu ecosystem, including Sekolah.mu, Sekolah Murid Merdeka, Karier.mu, and other platforms.
In January 2023, I moved from another product design tribe to the Product Design Core Team. Rather than working on one product, our team maintained the shared design system and reviewed how it was being used across different products.
My work included design quality control, reviewing submitted pages and user journeys, giving corrections and suggestions, discussing cases with other product designers, and communicating with developers when implementation affected the design.
My Role
The work within the Core Team was divided across the team rather than assigning individual ownership of specific components to one designer.
As part of that team, I reviewed designs against the LERN guidelines and worked with other designers when something needed to be corrected, discussed, or reconsidered.
Project Information | |
|---|---|
Duration | January – July 2023 |
Company | PT Semesta Integrasi Digital |
Team | Product Design Core Team |
Role | Product Designer |
Products | Sekolah.mu · Sekolah Murid Merdeka · Karier.mu · Talentics |
Work | Design QA · Design System Maintenance · Documentation · Designer & Developer Collaboration |
02 — One System Across Different Products
LERN was shared by products that did not always have the same users, features, or interface requirements.
That meant consistency could not simply mean making every product look the same. The system needed to provide common foundations and reusable components while still working for different product situations.
This became especially visible during design reviews. Sometimes a submitted design clearly differed from an existing guideline. Other times, the reason for that difference was less straightforward: the product might have a use case that the existing system did not cover.
In those cases, asking the designer to follow the existing guideline did not necessarily solve the problem.
03 — Reviewing Designs Against the System
Product designers submitted pages or user journeys to the Core Team for quality control.
We checked the designs against the existing LERN guidelines and components. When I found inconsistencies, I added comments with corrections or suggestions for the designer.
Some reviews were straightforward. If an existing component or guideline already covered the situation, I could point the designer back to it.
Other cases needed discussion. Instead of treating every difference as an error, we had to understand why the designer had made that decision and whether the existing system actually supported what their product needed.
For me, quality control became less about checking whether everything matched and more about knowing when a guideline answered the problem and when it did not.
04 — When the Guidelines Were Not Enough
Not every issue we encountered could be resolved inside Figma.
There were situations where a design worked in Figma but could not be implemented by the development team as intended. There were also product needs that were not yet covered by the existing system.
These cases usually needed conversation rather than another correction.
We discussed what the product needed, what the existing component was intended to do, and what was technically possible. Depending on the situation, the design might need to change or the existing system might need to be reconsidered.
Working this way made the boundaries of the design system more visible to me. A guideline could give us a shared starting point, but it could not anticipate every situation that appeared across different products.
05 — Keeping LERN Usable
Maintaining LERN also meant keeping its foundations, components, and documentation understandable for the designers and developers using them.
The system covered elements such as colour, typography, spacing, grids, elevation, icons, illustrations, and reusable interface components. Documentation gave teams a shared reference when designing new pages or reviewing existing ones.
The LERN documentation and website were published in 2023. You can explore the public documentation on the LERN Design System website.
This shared reference also needed to stay clear as the system developed. Designers used it when working with components and guidelines, so unclear documentation could easily become part of the questions we encountered during design reviews.
06 — Looking Back
Before joining the Core Team, I mostly encountered design systems from the position of a product designer using them.
Maintaining LERN showed me another side of that work.
A design system was not only the components sitting in a Figma library. There were also designers trying to use those components in different products, developers translating them into working interfaces, and situations the existing guidelines had not anticipated.
I also became less quick to see inconsistency as something that simply needed to be corrected. Sometimes it was an error. Sometimes it showed that a designer had misunderstood the system. But sometimes it exposed a case that the system itself did not handle well.
That distinction was one of the most useful things I learned from working in the Core Team.
