Designing LGI's first Design System
01 Apr 2025 • 5 mins read
Lippo General Insurance (LGI) is revamping its digital products to align with its new vision following its acquisition by Hanwa Group. This digital transformation aims to drive innovation and modernize LGI’s consumer-facing platforms, reinforcing its position as a leading insurance provider.
The Impact
The launch of the Design System has streamlined workflows and improved collaboration across teams. Designers now complete tasks 50% faster, make more informed decisions when selecting components, and ensure greater consistency across digital products. Additionally, cross-functional collaboration between design, development, marketing, and graphic teams has significantly improved, reducing design-to-development discrepancies and enhancing overall efficiency.
The Process
Setting a NORTH Star
In this process, stakeholders and three designers, including myself, were brought together to define our NORTH Star in regard to creating the design system. We defined key metrics such as who our target customer audience are, company vision, design objectives and many more to help start with the creation of the design system.
User Research & Synthesis
We identified which direction we wanted to take and defined LGI's primary key users and how they interact with the digital products. Aligning with our NORTH star, we filtered out our customers' expectations when interacting with our digital products and found major problems within our existing digital products.
Competitor Analysis
I facilitated in conducting a competitor analysis to guide other designers in identifying of what works and how we can learn from existing competitors. We took in 4 major key players as our competitors to represent for a Mobile App design and Website-Mobile responsive design. This helps filter out which components we can build upon.
Team Synchronization
We gathered key components we can build upon, synchronizing our design system vision and actionable tasks. Synthesizing each team member's ideas was crucial since we initially had different opinions and this helped us align our ideas and actionable tasks.
Design Process
I developed our actionable tasks in creating atomic design systems with customizable interactions, creating item-level components that eventually into a full parent component, and quickly test it with potential customers and iterate it before then applying appropriate visual direction to the product.
Design Handover
In our final products, I finalized our design system documents with full trackable document summarizing our missions, team members contact number, tone of voice, product roadmap, and components documentations for our design handover.
The Results
In my current time writing this (01/04/2025), the design system has proven to be a successful initiative and provided consistency in all of our future product design quality such as MyGo+ and MyPro+. Creating a strong identity towards LGI's customers that represent LGI's step towards an innovative future as a leading insurance company and improved communication in cross-functional team environments. On the other hand, in an individual setting, it has increased designer's work rate by 50%, improve designers' decision making and accelerated engineers' development by 50% with familiar components.