Horizon Design System

All Case Studies

Comany name

E.ON Next

Industry

Energy / Utilities

Company size

1K-5K employees

Timeline

Jun 23 - Jun 25

# Summary

What was delivered and how:

Services

  • Design system architecture
  • UI design and component creation
  • Token strategy and theming
  • Content auditing
  • Accessibility and inclusive design
  • Cross-functional collaboration and onboarding
  • Design-to-development workflow improvements
  • Figma variables

Deliverables

  • Fully tokenised design system
  • Component library built in Figma
  • Design tokens mapped for dev implementation
  • Specs documentation
  • Supporting onboarding

Outcomes

E.ON Next was scaling fast—but their design tools weren’t. Multiple teams were working in silos, redoing the same UI work, and struggling with inconsistent user experiences.

I helped create Horizon: a fully tokenised, flexible design system that gave product teams the power to move faster, stay aligned, and deliver more polished, accessible interfaces—every time.

# Understanding the problem

Different teams. Different tools. Same frustrations.

Running before walking

Product teams were moving quickly—but not together. Each team was designing and building in isolation, creating inconsistencies across journeys, duplicating work, and slowing down releases.

There were only some basic shared components. Accessibility wasn’t guaranteed. Developers struggled to translate UI decisions into code. The lack of a single source of truth was costing time, clarity, and quality.

E.ON Next didn’t just need a design system. They needed the infrastructure and guidance to build one properly—and make it stick.

# The solution

One system. Shared rules. Better outcomes.

Built for the team

We started from pretty much scratch and built Horizon: a design system focused on real-world use, speed, and collaboration.

Horizon was a shared language, helping designers and developers ship better work, faster.

Key moves

  • Introduced a token-first architecture for colour, spacing, typography, and theming
  • Built a modular Figma component library, ready for real products
  • Baked accessibility into components from the start
  • Created simple, useful documentation to support development and usage
  • Ran interactive sessions with the design team to educate and communicate the design system
  • Create a simple way to reference all components in one place

# Outcomes

What changed when Horizon is utilised

Outcomes

Early adoption showed just how much Horizon was improving consistency and speed—while laying the groundwork for long-term design maturity.

Positive changes

  • Horizon became the go-to source for design decisions
  • Designers worked faster with pre-built, flexible components
  • Developers implemented consistent UIs with fewer handoff issues
  • Accessibility and design quality improved across products
  • Horizon continues to evolve as a foundation for future growth
  • Helped to strengthen the collaboration with wider teams