Bildbeschreibung: Eine Designerin an einem Stehpult, von hinten gesehen, zwei Monitore zeigen eine Design-System-Komponentenbibliothek mit Fokuszuständen — das visuelle Kennzeichen für das Profil einer Barrierefreiheits-Designerin im großen Maßstab.

Lesezeit: 10 Minuten

Redaktionelle Anmerkung. Die hier porträtierte Designerin ist eine zusammengesetzte Figur. „Maya Okafor“ ist keine reale Einzelperson; die Biografie ist aus Interviews mit fünf erfahrenen Barrierefreiheits-Design-Führungskräften zusammengestellt, die zwischen 2019 und 2025 mehrquartalsweise Barrierefreiheitsprogramme bei Verbraucherinternet-Unternehmen mit Nutzerbasen im Bereich von ca. 80 bis 300 Millionen leiteten. Jede Zahl, jedes Artefakt, jede Niederlage in der folgenden Zeitlinie ist real und stammt aus einem der fünf Praktiker; die Synthese — der Bogen einer Karriere durch ein Programm — ist die redaktionelle Freiheit.

Auch das Produkt ist verändert. Was wir präzise benennen, ist sein Maßstab (ca. 200 Millionen monatlich aktive Nutzende zu Beginn, ca. 240 Millionen am Ende), sein Stack (ein React-und-TypeScript-Frontend mit nativen iOS- und Android-Apps, die dieselbe Design-Sprache teilen) sowie die Design-System-Oberfläche, die Maya erbte (ca. 410 Komponenten, davon ca. 90 „primäre“). Das sind die Variablen, die die Schwierigkeit der Arbeit bestimmen.

Der Montag, an dem sie anfing

Maya Okafor trat an einem regnerischen Montag Ende Januar 2022 als Staff Product Designerin im Design-Systems-Team in das Unternehmen ein. Sie war 34 Jahre alt. Sie hatte die vorangegangenen sechs Jahre im digitalen Bereich eines großen Verlags verbracht, wo sie — fast aus Versehen — zur Person geworden war, die wusste, wie ein Fokusring aussehen sollte und warum das markenvorgeschriebene Kontrastverhältnis von 2,6:1 bei tertiären Schaltflächen nicht, wie behauptet, in Ordnung war. Sie hatte keine formellen Barrierefreiheitszertifikate. Sie sagte stets, alles auf die harte Tour gelernt zu haben: indem sie die Designerin in der Leitung war, als eine Person mit Screenreader ein Support-Ticket einreichte und niemand sonst wusste, wie man das Problem reproduziert.

Im neuen Unternehmen gab es kein Barrierefreiheitsmandat. Es gab kein Barrierefreiheitsteam. Es gab eine Accessibility Working Group, die jeden zweiten Mittwoch um 16 Uhr Pazifischer Zeit tagte und an Mayas erstem Mittwoch sechs Teilnehmende hatte. Sie hatte eine zuletzt 2020 aktualisierte Confluence-Seite, einen Slack-Kanal mit ca. 140 Mitgliedern und drei Nachrichten pro Woche, sowie — wie Maya später erkannte — genau einen Hebel: ein Backlog mit 41 offenen Barrierefreiheits-bezogenen Support-Tickets, davon sieben von einer einzigen Behindertenrechtsorganisation, die das Unternehmen seit 2019 vierteljährlich per E-Mail kontaktiert hatte.

„Das Erste, was ich tat, war, alle 41 Tickets zu lesen. Das Zweite war, sie auszudrucken und in einem Ordner abzuheften. Nicht weil jemand einen Ordner brauchte — sondern weil ich ein physisches Objekt brauchte, das ich in drei Monaten auf den Schreibtisch einer VP-Führungskraft legen konnte, wenn das Gespräch schwierig wurde.“

Maya Okafor, Composite, über ihren ersten Monat

Den Fall aufbauen: Beschwerdeaufkommen, rechtliches Risiko, Marktanteil

Die ersten drei Monate waren keine Design-Arbeit. Es war forensische Arbeit. Maya tat drei Dinge parallel.

Sie quantifizierte die Beschwerde-Pipeline. In Zusammenarbeit mit dem Support zog sie alle Tickets der letzten 24 Monate heraus, die eines von einem Dutzend Markierungsbegriffe enthielten — „screen reader“, „VoiceOver“, „TalkBack“, „JAWS“, „NVDA“, „contrast“, „keyboard only“, „WCAG“, „ADA“, „EAA“, „I can’t read“. Sie fand ca. 1.470 eigenständige Beschwerden, davon ca. 280 ungelöst seit mehr als 90 Tagen. Sie ordnete diese Produktoberflächen zu: ca. 38 % beim Checkout, ca. 22 % beim Messaging, ca. 14 % bei der Profilerstellung, ca. 9 % beim Videoplayer. Diese Verteilung sollte sechs Monate später entscheiden, welche Komponenten zuerst umgeschrieben wurden.

Sie quantifizierte das rechtliche Risiko. Das Unternehmen war in den vorangegangenen 18 Monaten in zwei ADA-Title-III-Klagen namentlich genannt worden, beide beigelegt. Maya konnte die Vergleichssummen nicht einsehen — die Rechtsabteilung gab sie ihr nicht —, aber sie konnte die Klagekurve im öffentlichen Docket ihres Sektors sehen. Sie erstellte eine Tabelle, die die Risikofläche des Unternehmens erfasste und eine Schätzspanne der erwarteten jährlichen Vergleichs- und Sanierungskosten auf einem „Nichts-tun“-Pfad produzierte. Der Mittelpunkt dieser Spanne lag im mehrstelligen Millionenbereich pro Jahr.

Sie quantifizierte die Marktchance. Das war die Aussage, die den Raum bewegte. Maya ergänzte die Nutzerstudiedaten des Unternehmens mit der WebAIM-Screenreader-Nutzerbefragung, den CDC-Behinderungsstatistiken und Eurostat-Behinderungsprävalenzwerten für die EU-Märkte, die das Produkt bediente. Sie erstellte eine einzige Folie: Von den ca. 200 Millionen monatlich aktiven Nutzenden des Unternehmens nutzten schätzungsweise zwischen 14 und 22 Millionen das Produkt mit einer Form von Hilfstechnologie oder geänderten Standardeinstellungen. Die Analytik zeigte, dass dieses Segment ca. 1,8-mal so schnell churnete wie die Gesamtbasis. Wenn die Bindungsrate dieses Segments auf Parität gebracht werden könnte, war die netto jährliche Umsatzwirkung eine Zahl, die die Finanzabteilung erkannte.

„Ich habe der Rechtsabteilung die Zahl des Marketings nie gezeigt, und dem Marketing die Zahl der Rechtsabteilung nie. Jedem zeigte ich die Zahl, die für sie zählte. Der CFO sah beide auf einer einzigen Folie nebeneinander. Das war das Treffen, bei dem das Programm finanziert wurde.“

Maya Okafor, Composite, über die Finanzierungsargumentation

Das Programm wurde Ende Q2 2022 genehmigt. Headcount: sieben, mit Aufstockung auf elf über zwölf Monate — drei Designerinnen und Designer, vier Entwicklerinnen und Entwickler, zwei QA-Spezialistinnen und -Spezialisten, eine Programmmanagerin bzw. ein Programmmanager, eine Forscherin bzw. ein Forscher mit Erfahrung im Recruiting aus der Behindertengemeinschaft. Budget für externe Testpartnerschaften: eine sechsstellige Jahreslinie. Befugnis: Unterzeichnung jeder neuen Design-System-Komponente, mit Vetorecht bei Komponenten, die eine Barrierefreiheits-Checkliste nicht bestand. Diese letzte Klausel — das Veto — war die, für die Maya am härtesten verhandelte. Sie war der Unterschied zwischen einem Programm und einer Erlaubnisanfrage-Übung.

Die Design-System-Überarbeitung: Tokens, Fokus, Bewegung

Die technische Arbeit begann in Q3 2022 und lief die nächsten 14 Monate. Maya gliederte sie in drei Tranchen, die sie — in Folien und in Stand-ups — Foundations, Components, Patterns nannte. Die Disziplin dieser Reihenfolge, sagte sie oft, war die wichtigste architektonische Entscheidung des Programms.

Tranche 1 — Foundations

In den ersten sechs Monaten wurden die Design-Tokens neu aufgebaut. Das alte System hatte ca. 84 Farb-Tokens ohne semantische Benennung — „Blue/600“, „Grey/400“, „Brand/Primary“ — und ohne Kontrastmetadaten. Mayas Team ersetzte sie durch eine semantische Palette von ca. 40 Tokens, geordnet nach Funktion: content-primary, content-secondary, surface-base, border-default, plus eine interaktive Leiter (action-primary, action-primary-hover, action-primary-pressed) und eine Statusleiter. Jeder Token enthielt in seinen Metadaten das Kontrastverhältnis gegenüber der Fläche, auf der er eingesetzt werden darf, sowie ein Flag für die erfüllte WCAG-Konformitätsstufe. Die Werkzeuge setzten dies durch: Eine Designerin bzw. ein Designer konnte in Figma content-tertiary nicht auf surface-base platzieren, ohne dass der Linter es markierte.

Dieselbe Tranche standardisierte den Fokusring. Die alten Komponenten hatten — Maya zählte sie — ca. 17 verschiedene Fokusring-Behandlungen, von einem 1-Pixel-gepunkteten Umriss, der auf hellen Hintergründen verschwand, bis zu einem 2-Pixel-soliden blauen Ring, der das Layout auf eng gepackten Listen brach. Der neue Ring war ein einziger Token: ein 2-Pixel-Umriss mit 2-Pixel-Abstand vom Komponentenrand, sodass der Ring auf jeder Fläche lesbar war. Jede interaktive Komponente übernahm ihn standardmäßig; es gab kein Opt-out.

Bewegungspräferenzen waren die dritte Foundation. Das alte System beachtete prefers-reduced-motion an ca. einer Stelle — einer einzelnen Onboarding-Animation — und die nativen Apps beachteten es nirgends. Die neue Foundation machte Bewegung zu einem Token mit drei Werten (keine, reduziert, voll), der durch jedes Animationselement geleitet wurde. Eine Designerin bzw. ein Designer, die die Präferenz überschreiben wollten, mussten eine schriftliche Begründung beifügen, die die Programmleiterin prüfte.

Tranche 2 — Components

Mit stabilen Foundations wandte sich das Team den ca. 90 primären Komponenten zu. Die Liste wurde nach den Beschwerde-Pipeline-Daten geordnet, die Maya im ersten Monat gezogen hatte: Checkout zuerst, dann Messaging, dann Profil, dann Video. Jede Komponente durchlief einen standardisierten Rebuild: Tastaturnavigationskarte, Screenreader-Semantik, Fokusreihenfolge, Kontrastverifizierung bei jedem Zustand, Variante für reduzierte Bewegung, RTL-Variante und — auf Mayas Insistieren — ein dokumentiertes Test-Fixture, das das QA-Team bei jedem Release ausführen konnte.

Das Kreditkarteneingabefeld hatte in seiner alten Form aus einem einzigen <input> mit Auto-Formatierungs-JavaScript bestanden, das die Screenreader-Ankündigung eingetippter Zeichen unterbrach; der Rebuild verwendete vier separate Eingaben mit expliziten Labels, Fehlern, die über aria-describedby verknüpft waren, und Inline-Validierung, die durch eine höfliche Live-Region angekündigt wurde. Es dauerte sechs Wochen für eine Designerin und einen Entwickler. Die Checkout-bezogenen Barrierefreiheits-Tickets fielen im folgenden Quartal um ca. 70 % — weil die meisten der neuen Tickets einfach aufhörten, eingereicht zu werden.

Tranche 3 — Patterns

Die letzte Tranche war die, die Maya als in der Ausführung einfachste und in der Koordination schwierigste beschrieb. Das Team dokumentierte Kompositionsmuster — wie man einen barrierefreien Modalfluss auf den neu aufgebauten Komponenten aufbaut, wie man eine Liste von Elementen mit gemischten Medien zusammenstellt, wie man eine Einstellungsseite strukturiert, damit die Navigation unter Sprachsteuerung funktioniert. Die Muster wurden in der Design-System-Dokumentationsseite als ausführbare Codebeispiele veröffentlicht. Das Schwierige war nicht das Schreiben. Das Schwierige war, jedes Produktteam dazu zu bringen, sie zu verwenden, statt eigene zu erfinden.

Das Engineering-Rollout

Ein neu gestaltetes Design-System ist eine Bibliothek; es ist kein Rollout an sich. Die schwierigste Projektmanagementarbeit des Programms — Maya war da unmissverständlich — war die Migration. Das Produkt hatte ca. 40 Squads, jede mit zwei bis fünf Oberflächen, jede in der Praxis frei, das Design-System im Takt des eigenen Roadmaps zu übernehmen. Ein naiver Plan hätte jedes Squad gebeten, binnen eines Quartals zu migrieren. Dieser Plan wäre gescheitert.

Mayas Lösung war ein abgestuftes Mandat. Die neuen Komponenten wurden als Standard ausgeliefert; die alten blieben hinter einem Feature-Flag erhalten, aber jedes Release einer Oberfläche, das noch eine alte Komponente verwendete, öffnete automatisch ein P2-Ticket im Backlog des jeweiligen Squads. Das Ticket eskalierte nach 90 Tagen automatisch auf P1 und nach 180 Tagen auf P0. Innerhalb von vier Quartalen hatte ca. 78 % der alten primären Komponentennutzung migriert. Innerhalb von sechs Quartalen lag dieser Wert bei ca. 94 %.

„Das Schwierige war nicht das Design-System. Das Schwierige war ein Organigramm mit 40 Squads und einem Budgetzyklus, der nicht dafür ausgelegt war. Die Komponenten waren drei Monate Arbeit. Das Rollout war drei Jahre.“

Maya Okafor, Composite, über die Migration

Was das Programm kostete — und was es einbrachte

Maya führte akribisch Buch. Als das Programm seine formelle Phase in Q4 2024 abschloss, belief sich die Gesamtausgabe — über zwei einhalb Jahre, elf dedizierte Köpfe und externe Tests — auf einen Betrag im hohen einstelligen Millionenbereich. Das barrierefreiheitsbezogene Ticket-Aufkommen war gegenüber dem Basiswert 2022 um ca. 73 % gesunken, trotz einer Nutzerbasis, die um ca. 20 % gewachsen war. Die beiden ADA-bezogenen Rechtsverfahren, die während des Programmzeitraums eingeleitet wurden, wurden beide abgeschlossen, ohne vor Gericht zu gehen, zu Bedingungen, die das Unternehmen in seinen Jahresberichten als unwesentlich bezeichnete. Die Produktbindung im Segment der Nutzenden mit Hilfstechnologie — das Segment, das Maya in der Finanzierungsargumentation identifiziert hatte — hatte sich von einem 1,8-fachen Churn-Verhältnis gegenüber der Gesamtbasis auf ca. 1,15-fach verengt. Die Finanzabteilung verbuchte die Differenz. Maya nannte die Zahl nicht.

Sie verbuchte auch Dinge, die nicht in der Tabelle erscheinen. Die VoiceOver-Rotor-Unterstützung der nativen iOS-App, die jahrelang als bekanntermaßen defekt galt, wurde — in einem unabhängigen Audit Anfang 2025 — zu einer der leistungsstärksten in ihrem Sektor. Das Hochkontrasttema, das Maya gegen den Widerstand des Markenteams durchgesetzt hatte, wurde zur Standardeinstellung in Regionen, in denen lokale Behörden begannen, den EAA durchzusetzen. Die Design-System-Dokumentationsseite, die Anfang 2022 ca. 4.000 Aufrufe pro Monat verzeichnete, erzielte Mitte 2025 durchschnittlich ca. 38.000 monatliche Seitenaufrufe. Eine Praxis war entstanden; sie würde ihre Amtszeit überdauern.

Was sie Designerinnen und Designern in kleineren Organisationen sagt

Ab 2025 absolvierte Maya weniger ICU-Schichten bei ihrem eigenen Produkt und leistete mehr Beratungsarbeit für Designerinnen und Designer in Unternehmen, die eine Größenordnung kleiner waren — 20-köpfige Produktteams, 50-köpfige Produktteams, die Größe einer Organisation, in der eine einzelne Designerin oder ein Designer standardmäßig die Barrierefreiheits-Leitung übernehmen muss. Sie hatte eine kleine Menge von Dingen, die sie bei jedem Kaffeegespräch sagte. Sie sind es wert, aufgelistet zu werden.

Erstens. Die Beschwerde-Pipeline ist der Hebel. Man braucht keine Million Nutzenden, um eine Beschwerde-Pipeline zu haben; man braucht einen Support-Posteingang und die Bereitschaft, ihn zu lesen. Druckt die Tickets aus. Heftet sie in einen Ordner. Bringt den Ordner zum Treffen. Der Ordner funktioniert.

Zweitens. Die Finanzierungsargumentation hat drei Spalten. Rechtliches Risiko, Marktchance und Beschwerdeaufkommen. Man braucht bei keiner der drei genaue Zahlen. Man braucht die gleiche Person, die alle drei auf einmal sieht, weil keine einzige Spalte den Raum überzeugt.

Drittens. Foundations vor Components, Components vor Patterns. Ein Team, das damit beginnt, Komponenten zuerst umzuschreiben, wird ein Jahr damit verbringen und mit einer schönen Komponentenbibliothek auf einer unsemantischen Farbpalette ankommen, und die nächste Designerin oder der nächste Designer wird alles wieder umschreiben.

Viertens. Verhandelt das Veto. Der größte Hebelpunkt in einem Multi-Team-Produktunternehmen ist die Fähigkeit zu sagen: „Diese neue Komponente wird nicht ausgeliefert, bis sie die Checkliste besteht.“ Das Veto, zweimal in zwei Jahren eingesetzt, ist ausreichend. Es ist die Glaubwürdigkeit des Vetos, nicht seine Häufigkeit, die die Arbeit leistet.

Fünftens. Stellt die Forscherin bzw. den Forscher mit Erfahrung im Recruiting aus der Behindertengemeinschaft ein. Die einzige Zeile in Mayas Programmbudget, für die sie am härtesten eingetreten wäre, war der Forschungssitz. Ohne Menschen mit Behinderungen im Prozess ist die Arbeit Theater.

Sechstens. Die Uhr für alte Komponenten ist nicht verhandelbar. Migrationen ohne Uhren finden nicht statt. Migrationen mit Uhren finden im Tempo der Uhr statt.

Siebtens. Nimmt den Sieg und geht. Maya verließ das Programm in Q1 2025 und wechselte in eine Beratungsrolle. Die Gründerin eines Barrierefreiheitsprogramms ist die falsche Person, um es im Regelbetrieb zu führen. Die Aufgabe der Gründerin ist es, das Programm zum Existieren zu bringen. Die Aufgabe im Regelbetrieb ist es, langweilig zu sein. Andere Persönlichkeit; andere Person.

Eine Anmerkung zum Ordner

Maya hat den Ordner noch immer. Sie bringt ihn manchmal auf Konferenzen mit, wenn eine erfahrene Designerin oder ein erfahrener Designer sie fragt — meist mit Verlegenheit, oft nach einer Podiumsdiskussion — was sie mit ihren eigenen 41 offenen Tickets tun sollen. Der Ordner ist knapp zwei Zentimeter dick. Der Aufkleber auf dem Deckel trägt in einer serifenlosen Handschrift, die Maya 2022 in einem Handwerksladen gekauft hat, die Aufschrift „Day One“. Die 41 Tickets darin sind alle geschlossen. Die Namen der Personen, die sie eingereicht haben, sind mit schwarzem Filzstift unkenntlich gemacht. Sie zeigt nicht die Namen. Sie zeigt die Seiten und sagt: So sieht die Arbeit aus, und hier beginnt sie.