2024 — 2025 • HelloFresh
From Compliance to Culture: Driving Inclusive Design at Scale
Empowering teams through systematic audits, accessible components, practical training, and process improvements, fostered a culture shift — embedding accessibility into workflows to create more intuitive, inclusive and equitable experiences at scale.
Accessibility
Inclusive Design
Assistive Technology
Design System
Overview
HelloFresh
HelloFresh was committed to “do the right thing” certified corporate citizenship — but faced inconsistency in accessibility across products. I joined the design system team to champion accessibility, ensuring every component was WCAG 2.1 AA compliant and fostered an inclusive design atmosphere.
The challenge
HelloFresh faced inconsistent accessibility compliance across platforms, exposing legal risk and limiting inclusive user experiences. The design system lacked clear accessibility guidelines, and teams needed both practical tools and knowledge to embed accessibility effectively into their workflows.
No tracking system: There was no systematic way to monitor accessibility across platforms. Inconsistent implementation across web, iOS, and Android led to gaps in WCAG compliance and increased legal and user experience risks.
Lack of scalable processes: Accessibility wasn’t embedded in the design system workflow, making it difficult to scale improvements. We needed a repeatable, collaborative process for building accessible components — and for enabling designers to sustain it.
Low team awareness: Many teams lacked clarity on what accessibility meant in practice, how to apply standards, or how to test effectively. This knowledge gap created barriers to sustainable and consistent implementation.
Accessibility gaps in HelloFresh’s iOS app and web experience highlighted the need for systematic improvements.
My contribution
As a senior designer, I took ownership of accessibility from audit to advocacy — driving systemic improvements, embedding accessibility into both our design system and team culture, and empowering others through education and collaboration to ensure scalable, inclusive experiences across platforms.
Improve accessibility compliance
Create awareness across mobile platforms
Advocate inclusive design
Impact I brought
8% overall compliance improvement
11% increase in accessibility knowledge
23% increase in accessible component usage
Phase I
Audit, assess and establish baseline
To understand the current state of accessibility, I developed an audit system using Google Sheets to track over 25 components from our core library across Web, iOS, and Android. A simple traffic-light system (Passed / Update / Failed) was introduced to visualise the status. Together with the QA, manual testing was conducted using assistive technologies like keyboard navigation, screen readers and touch area to uncover usability gaps. Findings were documented in Figma and google sheet, and I created Jira tickets to ensure engineers could prioritise and resolve identified issues.
Accessibility audit: Tracking 25+ design system components across platforms with a traffic-light system to establish a baseline.
Build and standardise — Component Spotlight: Toast
Phase II
Meanwhile, there was a component request for a “Toast.” I developed it to fully adhere to WCAG 2.1 AA standards. The component was built with proper keyboard navigability and screen reader functions, as well as visual considerations such as colour contrast and auto-dismiss timing. It included multiple state variants, including success, error, and informational messages. I documented full accessibility specifications and provided a comprehensive handoff to support implementation across platforms.
Component spotlight: The Toast notification was designed with full WCAG 2.1 AA compliance, ensuring accessibility across screen readers, keyboard navigation, and visual presentation.
Phase III
Documentation and guidelines
To support consistent execution, I created WCAG 2.1 AA-compliant specifications for every component and introduced an annotation system for designers. Accessibility considerations were embedded directly into the handoff files, helping both design and development teams apply the standards with clarity and confidence.
Accessibility checklist: Clear, WCAG-based guidelines embedded into design documentation to ensure consistency across teams.
Phase IV
Embedding into workflow and scale
Accessibility became a standard part of our system workflows. I introduced accessibility checklists into design and component approval processes to encourage proactive thinking. Collaboration with engineering led to the exploration of automated testing tools, and we established repeatable, sustainable processes to ensure long-term compliance across teams.
Embedding accessibility considerations applied consistently across all stages of the design and delivery process.
Phase V
Educate and advocate
Over the course of the project, I trained and supported more than 30 designers and engineers through hands-on sessions, live demos, and interactive workshops focused on inclusive design. I led live component annotation training and delivered presentations grounded in real use cases. These educational efforts built confidence across teams and sparked a growing internal demand for continued accessibility learning.
Presentation created for the internal UX Summit at HelloFresh to drive education and advocacy on accessibility.
Results and impact
Quantifiable impact
8% compliance improvement across platforms
10% increase in accessible component adoption
11% boost in team accessibility knowledge
100% of new components meet WCAG 2.1 AA standards
Organisational impact
Reduced legal risk and improved user experience
Unified standards across Figma, Web, iOS, Android
Embedded accessibility into design system workflow
Created cultural shift from compliance to inclusive mindset
Learnings
Systematic approach enables accountability
Our audit framework tracked issues with clear metrics, making gaps and progress visible. Regular audits maintained standards, and shared use across design, engineering, and QA turned accessibility into a collective responsibility.
Early integration is key
Starting with accessibility proved far more effective than fixing later. Embedding WCAG standards in design reviews reduced rework and kept experiences consistent. Early alignment made accessibility a natural part of planning and delivery.
Education first: Culture change requires human connection
Documentation helped, but training and workshops built real understanding. Cross-discipline sessions explained both the how and why, creating advocates and shifting accessibility from checklist to culture.
Future recommendations
Automated testing: Implement automated accessibility testing tools for continuous monitoring
User testing: Include users with disabilities in usability testing processes
Advanced training: Develop specialized training for complex accessibility scenarios
Metrics expansion: Track user satisfaction and task completion rates for comprehensive impact assessment