Designed a bold, user-friendly app to help personal trainers manage clients, bookings, and payments — all in one place.
Design SystemInternal ToolkitCross-Platform
Covea – Design System Foundations
Client
Covea Insurance plc
Year
2020 - 2023
Services
Design Systems, UI Library Creation, Collaboration & Team Enablement, UX Documentation, Component Inventory & Governance
Tools
FigmaStorybookConfluenceJira
Project overview
To support Covea's growing portfolio of insurance products and platforms, there was a need for a centralised, flexible design system. The goal was to create a toolkit of adaptive components that could be reused across brands and projects, enabling faster delivery, reducing duplication, and improving collaboration between design and development teams.
The Challenge
The team needed a mobile-first, modular design system that could serve multiple customer-facing products and internal tools. Existing design efforts were fragmented, with duplicated work, inconsistent components, and slow feedback loops. Designers and developers were working in silos, lacking a shared language, process, or source of truth.
The Solution
We created a scalable design system with reusable, white label components that could be adapted for various customer products. The system included:
- A Figma toolkit for designers - A matching React Storybook for developers - Guidelines and documentation to ensure alignment across teams
To bridge communication, we introduced shared documentation in Confluence and set up regular workshops, catch-ups, and forums to support adoption. This created a more streamlined, collaborative environment across teams.
Design system decision flowchart and governance framework
Technical Approach
The design system was built on the foundations of the GoSure brand, establishing a clean, flexible UI style that could evolve with business needs.
Key activities included:
- Identifying core component patterns and creating a design-led toolkit in Figma
- Supporting developers in translating Figma components into interactive React elements
- Creating documentation to define component behaviour, usage rules, and version control
- Running fortnightly syncs to review progress and ensure cross-team alignment
- Hosting workshops to onboard designers and introduce best practices around the system
Voice input UI examples and interaction patterns for insurance applications
Address input component variations showing different states and implementations
Project Impact & Reflection
My focus was on laying the design foundations — building the internal UI library, aligning it with the GoSure brand, and collaborating closely with developers to ensure accurate implementation.
While I didn't build the Storybook toolkit myself, I worked alongside the development team to help mirror the design system from Figma into React. We defined component variants, explored interaction patterns, and created a shared process that supported better cross-team collaboration. It was rewarding to see how this system brought clarity and consistency to projects across the organisation.
More projects
Future-facing concepts for a more personal and connected TV companion app—designed in one week as part of an ideation sprint.
Expanded Sky's Orion design system for native platforms, bridging design and development with shared standards and tooling.
1 of 3
Transform your ideas into intuitive experiences
Have a project in mind? I'm available for new opportunities and love designing thoughtful, user-friendly digital products, whether it's UX/UI for web and mobile apps, SaaS platforms, or something new.
Get in touch