Highly Adaptable Cross-Platform Design System​

We collaborated with a leading UK motor insurance company to create a consistent design system for the flawless user experience. The design system was created simultaneously to web & mobile app development. The result was an omnichannel product revolving around three main components.​

 Multiple touchpoints

Web​

Focused on onboarding clients and conversion optimisation​.

Mobile app

Providing self-service post-purchase support of the motor policy.​

Chatbot

Present in both the mobile and web experience, the chatbot was the first line of support for customers.​

Designing for multiple brands​

Creating a multi-brand structure in Figma was one of our most complex undertakings. We built the entire Design System from scratch, tokenized colors, typography and components. ​Tokens in design systems are a set of standardized, reusable values that help maintain consistency and scalability in a design.​

Naming​

For the web platform, we adopted a two-layered approach to tokenization due to its complexity and multiple colors in use.​ The first layer consisted of alias colors, while the second layer comprised system tokens, serving as the final tokens employed in the design and all components.​