Willis Towers Watson (WTW) is a global advisory, broking, and analytics company that helps insurers and financial institutions manage complex risks.
The Risk & Analytics division builds powerful data-driven tools used worldwide by underwriters, actuaries, and analysts for exposure modelling, catastrophe forecasting, and risk assessment.
By 2020, these enterprise products were functional but fragmented — each built by different teams with inconsistent interfaces, outdated tooling, and poor accessibility.
There was no shared design language, documentation, or scalable development process.
This project set out to re-think the entire Risk & Analytics product experience — unifying design, engineering, and brand into a modern, user-focused ecosystem.
At the centre of this transformation was a brand-new design system that became the foundation for rebuilding applications that were consistent, accessible, and scalable.
The Challenge
Risk & Analytics products were being delivered by independent squads, each with their own design habits and codebases. There was no shared source of truth, which lead to:
- Duplicated and inconsistent components
- Outdated Sketch files blocking modern workflows
- No documentation or developer alignment
- Weak accessibility compliance
- Brand fragmentation across key platforms
Without change, WTW faced slow release cycles, rework between design and development, and growing inconsistency across client-facing products.
The goal was to create a new generation of applications that were user-centred, on-brand, and built on a unified design and development framework.
Business Objectives
- Support WTW’s upcoming global brand refresh
- Reduce duplicated design and dev effort
- Accelerate delivery across squads
- Improve stakeholder confidence and UI quality
- Lower support tickets related to usability issues
UX Outcomes
- Consistent, accessible interfaces across all Risk & Analytics products
- Faster prototyping and design iteration
- Clearer UX documentation and onboarding for new staff
- A scalable system enabling growth and evolution
My Role
I led the initiative end-to-end — from auditing the existing design debt to building the new system architecture and embedding it into live projects.
Key responsibilities:
- Owned design direction and design system strategy
- Audited and rebuilt UI foundations (spacing, typography, tokens, colours)
- Migrated design teams from Sketch to Figma for live collaboration
- Built accessible, responsive components aligned with WTW’s brand
- Created documentation in Zeroheight with usage notes and dev specs
- Partnered with engineers to align tokens, components, and naming
- Delivered internal talks, onboarding sessions, and feedback workshops
- Integrated WCAG 2.1 AA accessibility from day one
All this was achieved without a formal design systems team — just persistence, structure, and collaboration.
Key Challenges
During discovery, several critical issues surfaced that were holding the product and team back:
- No system ownership – Designers and developers were working in silos with no shared governance or central source of truth.
- Visual inconsistency – The interface used dozens of different colours, font sizes, and spacing rules, making the product feel fragmented and hard to maintain.
- Outdated tools – Legacy Sketch files prevented collaboration in modern design environments and slowed iteration.
- No developer alignment – Components weren’t reusable or tokenised, leading to repeated front-end effort and inconsistencies in implementation.
- Accessibility gaps – Contrast ratios, keyboard navigation, and semantic structures were inconsistent, creating barriers for inclusive use.
Process
1. Audit & Discovery
- Ran a CSS Stats inventory across public and internal WTW sites
- Collected inconsistencies in typography, spacing, and colour
- Reviewed legacy Sketch files and UI handoffs from multiple teams
- Interviewed designers, developers, and PMs to identify workflow pain points
2. Foundation Setup in Figma
- Created a tokenised colour system with accessible, brand-approved shades
- Built a typographic scale and spacing system based on rem units
- Developed atomic components: buttons, inputs, grids, layout blocks
- Used Figma Variants and Auto Layout for responsive behaviour
- Clear button hierarchy with states and icon support
- Consistent type and spacing across all breakpoints
- Mobile-first component construction
3. Accessibility-First Design
Every component was built to comply with WCAG 2.1 AA, tested with Stark and manual audits:
- Colour contrast and focus indicators
- Keyboard navigation flow
- Screen reader labels and semantics
- Error handling and validation patterns
4. Collaboration & Handoff
To keep design and engineering aligned:
- Set up a shared Jira board for feedback and releases
- Documented every component in Zeroheight — including usage, behaviour, and accessibility notes
- Created async feedback channels in Teams and a roadmap in Confluence
- Ran bi-weekly reviews with engineering leads
5. Adoption & Rollout
The design system launched alongside a major homepage rebuild, giving it visibility and practical application.
Adoption actions:
- Published shared Figma libraries for all squads
- Ran onboarding walkthroughs and Q&A sessions
- Provided story-driven example flows for testing
- Supported gradual refactoring of legacy UI
Impact & Results
The design system overhaul delivered tangible improvements across workflow, quality, and confidence:
- Component library growth – Over 70 modular, responsive components were created, giving teams a flexible, scalable foundation for future products.
- Faster delivery – Design-to-development time dropped by approximately 30% in pilot projects thanks to reusable components and improved documentation.
- Accessibility compliance – Core components achieved WCAG 2.1 AA standards, ensuring inclusive experiences for all users.
- Brand alignment – The refreshed visual language established a consistent look and feel across multiple teams and products.
- Developer feedback – Engineers reported clearer specifications and significantly faster handoff between design and build.
- Stakeholder confidence – Leadership expressed greater trust in both the UX process and delivery quality, positioning the design system as a key enabler for future scalability.
Broader Impact
- Improved usability scores in internal heuristic evaluations (8.1 → 9.3)
- 40% reduction in rework from standardised patterns
- Established a blueprint now used across multiple WTW platforms
Reflection
This project was a turning point — it wasn’t about a single product, but about changing how an organisation delivered design.
Key takeaways:
- You don’t need a dedicated team to build something scalable — you need structure, clarity, and trust.
- Documentation is design — if people can’t find it, they won’t use it.
- Accessibility must be baked in from day one, not retrofitted.
- The easier you make adoption, the faster teams align.
If extended, I would:
- Integrate design tokens directly with Storybook/CSS-in-JS
- Track adoption analytics within Figma and Zeroheight
- Formalise governance with versioning and contribution models
“This wasn’t just about making things look better — it was about transforming how WTW built, delivered, and evolved its digital products.”