LZ Lando ZeilstraSenior UX and product designer
← All cases
WCAG and design systemOnderlinge – Customer portal

A pension and insurance portal that everyone can use

Onderlinge 's-Gravenhage specialises in life insurance and pensions. I worked on the redesign of the customer portal, focusing on ease of use, accessibility and consistency, while setting up a design system as the foundation for future product development.

RoleSenior UX and product designer · product owner
Period2023 – 2025
SectorInsurance
Worked withBusiness, compliance, IT and marketing
The renewed Onderlinge portal on a laptop

My role

  • Lead designer for the customer portal redesign
  • Setting up the design system and design tokens
  • Achieving WCAG AA compliance

01

The problem

The customer portal helps customers manage their products and arrange things digitally, in a complex financial environment.

The existing environment had a complex information architecture, an inconsistent experience, limited accessibility and fragmented design decisions. That made it hard for customers, and hard to build on.

02

What I found

Fragmented design decisions caused most of the problems, not one bad screen.

Customer journey analysis and conversations with business, compliance and IT showed that usability and accessibility issues kept tracing back to the same cause: every part had been designed its own way. A structural fix needed shared building blocks.

03

Choices and trade-offs

Foundation first, then screens

We captured colour, typography and components in a design system with design tokens. That made every next page faster and more consistent.

A guide instead of a menu full of products

On the homepage, a few simple questions lead visitors to the right information on housing or income.

The calculator in steps

The premium calculator uses sliders and shows what most people choose. The application follows in five clear steps, with a summary to check.

WCAG AA in the components themselves

Contrast, focus and keyboard support are solved in the components, so every page gets them automatically.

04

The design

The renewed portal, from the homepage to completing an application.

The new homepage: 'Growing older happily, we do it together'.
The new homepage: 'Growing older happily, we do it together'.
A guide on the homepage: a few questions lead to the right information on housing or income.
A guide on the homepage: a few questions lead to the right information on housing or income.
The calculator: amount and term with sliders, with the most common choice as a guide.
The calculator: amount and term with sliders, with the most common choice as a guide.
Applying in five steps, with a summary to check everything.
Applying in five steps, with a summary to check everything.

05

Result

  • ✓The renewed portal meets WCAG AA.
  • ✓A design system with tokens that teams reuse, with less design fragmentation and stronger UX governance.
  • ✓A team that makes stronger UX decisions itself through coaching, and higher UX maturity in the organisation.

06

What I'd do differently

Accessibility and a design system reinforce each other. By solving accessibility in the components, nobody had to think about it page by page anymore.

Work together

Does this challenge sound familiar?

I'm happy to tell you more in a conversation, including what didn't fit in this case.

Get in touch View LinkedIn