WCAG Accessibility
Inclusive by design, not afterthought.
Sonikk approached us with a clear mission: create a bold yet premium brand identity for their growing line of AirPods accessories—ranging from protective cases to charging docks and customizable add-ons. The product was technically solid, but the brand lacked clarity and visual impact.
Client
UI Design and UX Strategy
Year
2025
Industry
Edtech
Turnaround time
Shipped
The Problem
The platform had no meaningful WCAG compliance. For students relying on screen readers, keyboard navigation, or assistive technologies, large portions of the platform were effectively unusable. The compliance failures were widespread: missing focus states, poor keyboard navigation, absent alt text on data visualizations and imagery, broken form and input labelling, and no name, role, or value defined for interactive elements. Screen readers encountered the interface and found almost nothing meaningful to communicate. The gap between the platform's potential and its actual inclusivity was significant and closing it required more than a few fixes. It required a ground-up rethinking of how every element on the platform communicated with the people using it.
The Process
Each compliance failure was documented systematically, mapped to its corresponding WCAG criterion, and prioritized by its impact on users with disabilities. Annotations were produced in Figma using an established annotation library, covering every element across the platform. Each annotation specified the required accessible behavior focus order, ARIA labels, role definitions, keyboard interactions, contrast ratios giving developers a precise, unambiguous specification to work from. The Figma files became the single source of truth for the entire accessibility implementation, handed off directly to the development team. The platform moved from zero WCAG compliance to 100% WCAG 2.2 AA, verified through a thorough manual audit of the redesigned platform. Every element that previously excluded users with disabilities was annotated, redesigned, and implemented to standard. The platform speaks to assistive technology because every element was deliberately designed to do so.
The Outcome
The result also sets a foundation the platform didn't previously have, an accessibility pattern library and annotated specification that the development team can carry forward into every future feature, ensuring new additions are built to standard from the outset rather than retrofitted later.
Click here
