Lead Design Systems Engineer in Belfast

About Whitespace

Whitespace is at the forefront of engineering intelligent, secure AI solutions for the enterprise. While AI offers transformative potential, many organisations find it challenging to unlock its true value. We address this challenge through Collective—the AI Operating System designed for high‑assurance environments. It is engineered for scalability, trust, and decisive action, even within highly secure, complex, or air‑gapped infrastructures. Our mission extends beyond building systems; we are establishing the framework for a future defined by seamless human‑machine collaboration.

Department: Engineering

Location: Belfast (Hybrid)

Hours: Full time

Closing date: Open until filled

Role Summary

As a Lead Design Systems Engineer, you will be the critical bridge between design and engineering — ensuring that every component we build is a pixel‑perfect implementation of the storybook created by our designers. You will own the front end execution of our component library, working closely with the design team to translate their storybook into production‑ready react components. This is a high‑impact role for someone with a sharp eye for detail, a deep respect for design intent, and the front‑end expertise to bring it to life without compromise. Critically, you will ensure that the components you build are adopted consistently across all of Whitespace's applications — so that every product we ship looks and feels the same.

Duties & Responsibilities

• Component Library
  • Build and maintain accessible, production‑ready components that precisely match the Storybook specifications created by our design team.
  • Review Storybook stories written by designers and translate them into clean, well‑structured React component APIs that are flexible yet consistent.
  • Own the versioning and release process for the component library, ensuring changes are backward‑compatible and well‑communicated to consuming teams.
  • Write visual regression tests to catch any deviation from the designer‑approved Storybook across every release.
  • Champion visual consistency across all Whitespace applications by owning the design system end‑to‑end — from individual Storybook‑aligned components to common UI patterns and templates such as the shell UI, notification drawers, and navigation structures — ensuring every product team builds on the same foundation for a unified look and feel across the company's suite of products.
• Design Tokens & Figma
  • Consume the design token pipeline — typography, colour, spacing, and motion — and apply tokens precisely so that production components match the Storybook at a pixel level.
  • Work in close partnership with designers to review Storybook specifications before implementation and raise any ambiguities or feasibility concerns early.
  • Evaluate and maintain tooling that bridges Storybook and production code, such as style‑dictionary or similar token pipelines, to keep design and engineering in sync.
• Accessibility
  • Ensure every component implemented from Storybook meets WCAG accessibility standards, treating accessibility as a non‑negotiable part of design fidelity.
  • Conduct regular accessibility audits of implemented components and flag any deviations from Storybook specs.
  • Act as an internal advocate for accessibility, helping product engineers understand and apply the accessible patterns defined in the Storybook.
• Documentation & Adoption
  • Maintain implementation‑focused documentation and code examples alongside storybook stories, so engineers can confidently adopt components without hand‑holding.
  • Design system evangelism — owning adoption across both core and solutions engineering teams, proactively promoting best practices while being responsive to team needs and feedback.
  • Feed into the component roadmap by identifying gaps between the existing storybook and what has been implemented, prioritising work to close those gaps.
  • Gather feedback from engineers about implementation pain points and feed those insights back to the design team to improve future Storybook specs.
• Agile Ways of Working
  • Actively participate in sprint planning, stand‑ups, and retrospectives, bringing the design‑to‑engineering fidelity perspective to every sprint.
  • Collaborate with product managers and engineers to ensure Storybook‑aligned component delivery is built into product team workflows.
  • Share clear progress updates, flag design‑engineering mismatches early, and surface blockers to keep component delivery moving at pace.
  • Mentor junior engineers on best practices for implementing storybook‑aligned components, raising the quality bar across the team.

Requirements

• Experience
  • 5+ years of hands‑on experience in front end engineering, with a track record of building UI components from design specifications.
  • Demonstrated experience implementing and scaling a component library in a production environment, with a strong focus on design fidelity.
  • Experience working in an agile team alongside designers, engineers, and product managers, with a strong emphasis on design‑engineering collaboration.
  • Prior experience implementing a component library across multiple products or platforms is a strong advantage.
  • Experience maintaining or contributing to an open source UI library, or using Storybook in a design‑led workflow, is beneficial.
• Skills & Abilities
  • Deep fluency in React and TypeScript, including building composable, well‑typed component APIs and publishing versioned npm packages.
  • Able to read and interrogate Figma files confidently — comfortable with Variables, Auto Layout, and design tokens — to understand exactly what the designer intended in Storybook.
  • Strong understanding of accessibility guidelines.
  • Expert‑level experience with storybook as both a development environment and source of truth, with strong working knowledge of Chromatic or equivalent visual regression tooling.
  • Familiarity with token pipeline tooling such as style‑dictionary or equivalent.
  • Strong design sensibility — you notice when spacing, motion, or typography is even slightly off and care enough to fix it, not ship it.
  • Excellent communication skills, able to work closely with designers to ask the right questions, understand intent, and raise implementation concerns constructively.
  • A collaborative, detail‑obsessed mindset — you take pride in implementation quality, measure success by how faithfully what ships reflects what was designed, and care deeply about creating a consistent experience for users across every Whitespace product.

What We Offer

• Work on impactful, cutting‑edge products powered by artificial intelligence and machine learning.
• Be part of an agile, close‑knit team that values creativity, quality, and continuous learning.
• A flexible working environment, with typically 2 days of hybrid working in our Belfast office, and one of the best work‑life balances you'll find.
• A (Mon to Thurs) 4‑day work week during the holidays — July, August, and December.
• The last Friday of every month off.
• Early finish every working Friday at 3pm.
• 25 days of annual leave, plus all NI bank holidays.
• EMI Share options in a rapidly growing scale‑up.