heyAppa
Spielerische Sprachlern-App – zuerst für Koreanisch.
Problem
Eine Sprache mit eigener Schrift zu lernen braucht Ausdauer – und Übung, die Spaß macht. Ich lerne selbst Koreanisch. Eine Lern-App sollte dabei niemanden ausschließen: auch nicht, wer mit Tastatur oder Screenreader lernt.
Lösung
heyAppa ist eine spielerische Sprachlern-App, zunächst für Koreanisch. Als Maskottchen begleitet Appa, ein lila Drache, durch die App – mit einer eigenen Charakter-Bibel als verbindlicher Quelle für seine Gestalt.
- Übersetzungen und Geschichten mit einem LLM über das Anthropic SDK.
- Wiederholung mit Karten zum Umdrehen; eigene Reihenfolgen per Drag-and-drop – mit Maus, Touch oder Tastatur.
- Oberfläche auf Deutsch, Englisch und Koreanisch.
Barrierefreiheit
Bevor die Oberfläche neu gestaltet wird, kam die Barrierefreiheit in drei Runden. Sie gilt seitdem als Grundlage, die nicht zurückfallen darf.
- Kontrast-Tokens, Fokusfalle in Dialogen und Tastaturbedienung für die Wiederholung; globale Kurzbefehle lösen in Eingabefeldern nicht mehr aus.
- Sichtbarer Fokus und Fokusführung in Kontextmenüs; keine verschachtelten interaktiven Elemente, nach dem Umdrehen einer Karte kehrt der Fokus zurück.
- Sortieren per Tastatur mit Screenreader-Ansagen; Hinweise und Ansagen auf Deutsch, Englisch und Koreanisch, abgesichert mit Tests.
Architektur und Entscheidungen
- Next.js 16 (App Router) mit React 19, TypeScript und Tailwind 4; Prisma 6 mit PostgreSQL und pgvector; Zod an den Grenzen, Tests mit Vitest.
- Betrieb auf AWS, Infrastruktur mit Terraform; beim Deployment laufen Migrationsprüfung, Build und Neustart des Dienstes nacheinander.
- Agenten mit klaren Rollen: Claude Code setzt je Pull Request genau eine Aufgabe um, Codex prüft die Änderung nur lesend, Befunde gehen in denselben PR zurück. Sichtbare Änderungen gehen erst nach meiner Sichtprüfung weiter, gemergt wird nur von Hand.
- Der Agent arbeitet als reiner Editor in einem frischen Arbeitsverzeichnis; Branch, Commit und PR übernimmt ein Orchestrator, der nur freigegebene Pfade zulässt.
- Neugestaltung mit eingefrorener Grundlage: Designbrief, Design-System als Umsetzungsvertrag und Briefings je Ansicht – die Logik bleibt dabei unangetastet.
Stand
heyAppa ist in Entwicklung. Die Runden zur Barrierefreiheit sind abgeschlossen, die Neugestaltung ist geplant und dokumentiert.