Salt was moving its website from Drupal to Magnolia CMS. The existing experience lacked consistency and structure: content was hard to manage and offers were hard to understand.
Simplify how offers are structured, make the customer journey clearer, and build a design system that scales with the new CMS.
Lead UX/UI Designer and E-commerce Manager, end to end: audit, UX, UI, design system and handoff. I mentored a designer, guided graphic designers through component reviews, and aligned business, product and IT.
Audit of the existing journeys
I reviewed the homepage, device pages and plan pages side by side. Layouts were inconsistent, hierarchy was unclear and journeys were fragmented, which made plans and offers hard to compare.
Drag the handles below to compare the three templates redesigned first.
A modular page zoning system
Before any visual design, I defined how pages are built: a zoning system aligned with Magnolia's component architecture, mobile first.
High-fidelity wireframes then became the shared reference for product, marketing and engineering.
Components built for conversion and for the CMS
Each component was designed once and reused across mobile, fibre and e-commerce pages.
- 01Pricing cards for B2C, B2B and Fiber
- 02A clear button hierarchy
- 03A device configurator designed for Magnolia integration
One base, themed per brand
The key decision: one shared component base, with brand differences handled by themes instead of duplicated libraries. The brands had to stay distinct, but rebuilding components for every campaign was what created the inconsistency.
The Salt UI kit became the base for Lidl Connect. Switch the brand below: the component stays the same, only the tokens change.
- Primary
- #0A0A0A
- Accent
- #2DB34A
- Card radius
- 16px
- Button radius
- pill
- Headline weight
- 700
Four key journeys, redesigned
- 01Discover and compare devices
- 02Configure and purchase
- 03Choose a mobile plan
- 04Explore internet and TV offers
Quality as a release condition
Specifications, component documentation, design tokens and CMS requirements were written with the developers, so the system could be implemented and maintained in Magnolia.
I then formalised quality and compliance standards (WCAG, publication criteria) and built them into the release process. Accessibility stopped being a late fix and became a condition for going live.
Figma became the shared source of truth across the company. I drove its adoption team by team, showing each one what it gained.
- 2x mobile product conversion in 8 months, after redesigning product tables, product pages and checkout
- 50+ reusable components shared across brands
- Accessibility and publication checks built into every release
- Faster page creation across teams























