UX- & Prozess-Review der App (Stand v0.161.0, 2026-10-14)
Zielgruppen: Business/Management (Kernaussage + Maßnahmen) · IT-Dev/Architektur (Befunde mit Datei:Zeile). True North: Prüft, ob die App die drei Leitfragen verständlich, konsistent und intuitiv beantwortet. Diese Runde ist ein Delta-Audit über 17 Minor-Versionen (v0.144.1 → v0.161.0) mit Schwerpunkt auf der größten neuen Fläche seit dem letzten Audit: dem Spezial-Tool Dexman (7 neue Client-Dateien, zwei umschaltbare Oberflächen Kompass und Klassisch, MED-D-381/383) samt Monatsmeldung im Kundenportal (MED-D-700). Methode: (1) App real bedient — Full-Stack-Worker mit echter D1, Testpraxis mit Planungsbausteinen, Screenshots Desktop 1366 px und Mobil 390 px, Overflow/Erreichbarkeit im Browser gemessen (nicht geschätzt); (2) Code-Sweep über die neuen Flächen (stille Fehler ·
role="alert"/status· ARIA der Umschalter · Token-Disziplin · Typografie · Touch-Ziele · Kernbegriffe nach MED-D-330); (3) Nachprüfung des Altbacklogs aus dem v0.144.1-Audit. Jeder Befund mit Verdikt und Datei:Zeile. Bezugspunkt & Gültigkeit (MED-D-97): v0.161.0 · auditierter Standd8a4082(main) · 2026-10-14. Löst das v0.144.1-Audit (MED-D-326/329) ab; dessen offene Befunde werden unverändert weitergetragen. Auslöser: Issue #713 (Stale-Regelagents.md§6.7). Nächster App-Audit gemäß Stale-Regel (≥10 Minor-Versionen oder >90 Tage).
1. Kernaussage
Dexman ist die bislang beste Fläche der App — und der erste Ort, an dem die Antwort vor den Daten steht. Der Kompass beginnt mit einem vollständigen deutschen Satz („Ihre Praxis arbeitet kostendeckend. Der erforderliche Mindestumsatz beträgt 2.150 € je Arbeitstag (Okt 26 – Sep 27)."), nicht mit einer Kachelwand; Status steht als Text neben der Farbe („Kostendeckend", „Im Richtwert", „Liquidität gesichert"), nicht als Farbe allein; es gibt einen primären Knopf. Das ist genau das, was die Einfachheits-Linse des letzten Audits (E-Runde, M-04) für die Akte gefordert hat — hier ist es gebaut.
Technisch tragen die neuen Flächen den Anspruch ohne Regress: keine einzige still geschluckte
Fehlerbehandlung, kein eingeschleustes Hex (Token-Disziplin makellos über alle 7 Dateien), Kernbegriffe nach
MED-D-330 eingehalten. Die Dexman-Umschalter sind sogar ARIA-vollständiger als die etablierten
Akten-Reiter: role="tablist" + role="tabpanel" + aria-labelledby sind gesetzt (Kompass und Klassisch)
— genau das, was Altbefund B38 der Akte seit Runden fehlt.
Was von der glatten Note trennt, ist das Telefon. Bei 390 px misst der Dexman-Overlay-Inhalt 519 px in einer 340-px-Box: die Kopfzeile „DEXMAN · PRAXIS AM MARKT" ist verschwunden, die Reiterzeile endet in „Empfe…", die Beschriftung des Mindestumsatz-Bandes ist links angeschnitten — und der „Schließen ✕"-Knopf steht halb außerhalb (B47). Die Seite selbst scrollt sauber (390/390), der Fehler sitzt allein im Overlay. Dazu drei Kleinbefunde (B48–B50). Der A11y-/Ehrlichkeits-Altbacklog bleibt unverändert offen — er ist heute der größere Hebel als alles Neue.
Bewertung je Dimension (10 = Meisterwerk; ↑/↓ ggü. v0.144.1):
| Dimension | v0.144.1 | v0.161.0 | Begründung (Kurzform) |
|---|---|---|---|
| Informationsarchitektur & Prozessführung (intern) | 9 | 9 | Dexman trennt „Lage / Vorschau / Empfehlungen / Erfassung" sauber; die Akte bleibt unverändert dicht (M-04 offen) |
| Antwort-vor-Daten (Pyramidalität in der UI) | — | 9,5 ↑ | neu bewertet: Kompass-Antwortsatz + eingeordnete Kennzahlen („Im Richtwert (Richtwert höchstens 35 %)") statt nackter Zahlen |
| Verlässlichkeit des Feedbacks | 8 | 8 | neue Flächen ohne stille Fehler, eigene role="alert"-Kanäle; aber Altbestand B40/B45 (Cockpit, Bankkonto-Undo) unverändert |
| Selbsterklärbarkeit / eine Sprache (G-3/G-8) | 9,5 | 9,5 | MED-D-330-Begriffe in den neuen Texten eingehalten; formelle Fachsprache für Praxisinhaber (MED-D-383) konsequent |
| Konsistenz Design/Interaktion | 8 | 8,5 ↑ | Token-Disziplin makellos, kein rohes Hex in 7 neuen Dateien; Abzug für den 38-px-Ausreißer (B49) neben einem 44-px-Nachbarn |
| Mobile & Erreichbarkeit | 8 | 7 ↓ | gemessen: Overlay 519 px in 340 px, „Schließen" angeschnitten (B47) — die bisher einzige Fläche mit echtem Erreichbarkeits-Risiko auf dem Telefon |
| Barrierefreiheit | 8 | 8 | Dexman setzt tablist/tabpanel/aria-labelledby und macht Meilenstein-Marker tastaturerreichbar; aber kein Pfeiltasten-Roving (B48), Altbestand B36/B37/B38/B42/B43 offen |
2. Was gehalten wurde (bewahren)
Belegt aus Bedienung + Code-Sweep (Datei:Zeile):
- Antwort zuerst, Daten danach (Kompass).
dexman-kompass.component.tseröffnet mit dem Satz, nicht mit der Kachel; die vier Räume tragen Unterzeilen („Aktuelle Situation", „Nächste 24 Monate", „Handlungsoptionen", „Monatserfassung"), die sagen, was einen erwartet. - Status als Text + Farbe. Die Chips nennen den Zustand ausgeschrieben („Kostendeckend", „Im Richtwert", „Liquidität gesichert bis Dezember 2028") — kein Farbe-allein-Signal, damit auch bei Farbsinnstörung lesbar.
- Kennzahlen mit Einordnung statt nackter Zahl.
dexman-klassisch.component.tsstellt unter jede Kachel die Deutung („Im Richtwert (Richtwert höchstens 35 %)", „Umsatzrendite 39 %", „Liquidität gesichert · 10/2026") — die Zahl erklärt sich selbst (G-3). - ARIA der Umschalter vollständig — besser als der Altbestand:
role="tablist"+aria-label(dexman-kompass.component.ts:34,dexman-klassisch.component.ts:41),role="tabpanel"+aria-labelledbyje Panel (dexman-kompass.component.ts:45/:72/:123/:139,dexman-klassisch.component.ts:48). - Grafik ist bedienbar, nicht nur hübsch. Die Meilenstein-Marker im Kontoverlauf sind
tastaturerreichbar und beschriftet (
dexman-teile.ts:75—tabindex="0",role="img",aria-label,focus/blurspiegelnmouseenter/mouseleave), das SVG liegt in einem Scroll-Container (dexman-teile.ts:97overflow-x: auto), und das<svg>selbst trägt ein sprechendesaria-label(:64, „Kontoverlaufbis "). - Keine stillen Fehler in den neuen Flächen. Kein
error: () => {}in den 7 Dexman-Dateien; die Portal-Monatsmeldung führt beide Kanäle (portal-dexman-meldung.component.ts:role="alert"undrole="status"). - Token-Disziplin makellos. Kein einziges rohes Hex in den neuen Dateien (einzige Treffer sind
rgba(0,0,0,.12)-Schatten) — alle Farben über World-2-Tokens. - Kernbegriffe (MED-D-330) eingehalten. Kein „Mandant"/„Beratungsauftrag" in den neuen sichtbaren Texten.
- Touch-Ziele überwiegend ≥44 px (
dexman-baustein-form.component.ts:179/:181,dexman-ist.component.ts:77,dexman-klassisch.component.ts:220/:226,dexman-kompass.component.ts:149/:163,portal-dexman-meldung.component.ts:56) — ein Ausreißer, s. B49. - Seitenbreite mobil sauber: die Kundenakte selbst erzeugt bei 390 px kein horizontales Scrollen
(gemessen:
scrollWidth/clientWidth= 390/390).
3. Neue Befunde
| ID | Schwere | Befund | Beleg |
|---|---|---|---|
| B47 | 🟠 mittel | Dexman-Overlay bei 390 px zu breit: Inhalt 519 px in 340 px → horizontales Scrollen innerhalb des Dialogs. Folgen: Kopfzeile „DEXMAN · | gemessen im Browser bei 390×844 ([role=dialog] scrollWidth/clientWidth = 519/340); dexman.component.ts Kopfzeile .dx-kopf ohne Umbruch-Reserve |
| B48 | 🟡 niedrig | role="tab" ohne Tastatur-Roving: beide Dexman-Umschalter kündigen per role="tablist" Pfeiltasten-Navigation an, implementieren sie aber nicht — kein (keydown), kein tabindex="-1" für inaktive Reiter. Jeder der 9 Klassisch-Reiter ist damit ein eigener Tab-Stopp. Die Akten-Reiter machen es vor. | dexman-kompass.component.ts:36, dexman-klassisch.component.ts:43 vs. mandant-detail.component.ts:282 ([attr.tabindex] + (keydown)="registerTaste(...)") |
| B49 | 🟡 niedrig | 38-px-Touch-Ziel im Segment-Umschalter Kompass/Klassisch — unter dem 44-px-Ziel (M-06/B43-Klasse), direkt neben einem Element, das 44 px selbst einhält. | dexman.component.ts:60 (min-height: 38px) vs. :62 (min-height: 44px) |
| B50 | 🟡 niedrig | Achsentext fix auf 12 px in px: skaliert nicht mit der Nutzer-Schriftgröße und liegt unter der M-06-Grenze (≥14 px). Betrifft die Achsenbeschriftung des Kontoverlaufs. | dexman-teile.ts:109 (text { font-size: 12px }) |
4. Altbacklog — nachgeprüft, unverändert offen
| ID | Stand | Beleg |
|---|---|---|
B36 Badge-Kontrast · B37 Touch-Ziel „übernehmen" · B38 Reiter ohne aria-controls/role=tabpanel · B42 Rücklauf-Falsch-Leere · B43 <24-px-Ziel | offen (#435, MED-OP-UX-11) | B38 nachgeprüft: mandant-detail.component.ts:280/:282 hat tablist/tab/Roving, aber kein role="tabpanel" und kein aria-controls — während die neue Dexman-Fläche beides setzt |
| B40 Cockpit-Ladefehler still | offen | cockpit.component.ts:1072/:1073 (aktenreifeUebersicht, meineWiedervorlagen je error: () => {}) — scheitert der Abruf, bleibt die Liste kommentarlos leer |
| B45 Bankkonto-Undo still | offen | mandant-detail.component.ts:2106 — schlägt „Rückgängig" fehl, ist der Toast weg und das Konto bleibt archiviert, ohne Hinweis |
| B46 Portal-Config still | als Entscheidung geführt (kein Befund mehr) | portal-public.component.ts:325 trägt jetzt die Begründung im Code („Kein Sitekey → Login ohne Widget; Rate-Limit schützt weiter") — bewusst, nachvollziehbar, dokumentiert |
| M-02 ein Kunden-Einstieg · M-04 Akte verschlanken · M-06 Senioren-Typografie · M-08 Nutzertest | offen (MED-OP-UX-15/16) | unverändert aus der E-Runde v0.144.1 |
5. Maßnahmen (nach Wirkung)
| ID | Maßnahme | Aufwand | Status |
|---|---|---|---|
| N-01 | B47 beheben: Dexman-Overlay bei ≤420 px umbrechen lassen (Kopfzeile stapeln, Reiter scrollbar mit sichtbarem Rand, „Schließen" immer im Sichtfeld) | klein–mittel | #721 |
| N-02 | B48 Pfeiltasten-Roving für beide Dexman-Umschalter (Muster aus mandant-detail.component.ts:282 übernehmen) | klein | #722 |
| N-03 | B49/B50 38 px → 44 px, SVG-Text 12px → 0.875rem | klein | #722 |
| N-04 | B38 nachziehen: die Akten-Reiter auf das Niveau der Dexman-Reiter heben (role="tabpanel" + aria-controls) — das neue Muster ist der Referenzpunkt | klein | #435 (MED-OP-UX-11) |
| N-05 | B40/B45: die zwei verbliebenen stillen Fehlerpfade ehrlich machen | klein | #435 |
| N-06 | M-04/M-06/M-08 aus der E-Runde bleiben der größte Hebel — die Akte ist unverändert dicht, während Dexman zeigt, wie es geht | groß | MED-OP-UX-15/16 |
Belege dieser Runde: Screenshots Desktop 1366 px (Kompass, Klassisch) und Mobil 390 px (Akte, Praxen, Dexman) wurden während des Audits erzeugt und ausgewertet; sie sind bewusst nicht im Repo abgelegt (Everything-as-Code: kein Binär-Master, G-2) — die Messwerte stehen oben im Text und sind mit dem Full-Stack-Harness reproduzierbar.