Designnachweis · WTS / BTS
Screens, Zustände und offene Punkte
Komponentenzuordnung und Prüfpfade für diesen Designprototyp.
Geltungsbereich
Der ursprüngliche OpenDesign-Export entstand mit einem bis A6 gekürzten Brief. Für die anschließende App-Umsetzung lagen das vollständige Gesamtkonzept und der Design-KI-Brief vor. Die ergänzenden Admin-Screens für Interviewdetails, Rundenverwaltung und UI-Report sind inzwischen in der App umgesetzt und lokal geprüft. Die hier verlinkten HTML-Seiten dokumentieren weiterhin den ursprünglichen Designprototyp; die aktuellen Funktionen und Prüfgrenzen stehen im Implementierungsstand.
Gestalterische Quellen
WTS DESIGN.md und tokens.css sind die verbindlichen Quellen. Das vorhandene generierte kit.html wurde für Buttons, Felder, Tabellen, Radien und Zustände geprüft. Seine abgeleiteten Farb- und Hovervarianten stehen teilweise im Konflikt mit dem begrenzten WTS-Farbrahmen; in diesen Fällen gelten die gebundenen Basistokens und kontrasterhaltenden Zustandsregeln. Die generierten --brand-* Farbpaletten enthalten zusätzliche Statusfarben und Dark-Mode-Werte; sie werden aufgrund des ausdrücklich begrenzten Markenfarbrahmens nicht verwendet.
Helvetica Neue mit Helvetica, Arial und sans-serif gilt für Überschriften und Body. Cambria/Charter und Calibri/Source Sans sind im aktuellen Brief genannt, aber nicht mit einer passenden verbindlichen Referenz belegt. Dieser Widerspruch wird nicht durch eine erfundene Typografiespezifikation aufgelöst.
Das originale WTS-Logo wird unverändert als Screenshot-Ausschnitt eingebettet. „BTS“ bleibt die Produktzuordnung aus dem Auftrag; ein BTS-Logo wurde nicht erfunden.
Zustände öffnen
T2 · Textinterview
T3 · Sprachinterview
T4–T6 · Abschluss
T7 · Fortsetzung
T8 · Gemeinsamer Einstieg
A1–A2 · Zugang & Übersicht
A3–A6 · Teamarbeit
Komponenten je Screen
Die Seed-Bausteine werden mit WTS-Tokens gebunden. Produktbausteine und alle nicht belegten Zustandsvarianten sind Erweiterungsvorschläge; sie sind kein Nachweis bereits vorhandener WTS-App-Komponenten.
| ID | Screen | Seed / WTS-Bindung | Produktbaustein · Vorschlag |
|---|---|---|---|
| T1 | Check-in | field, input, textarea, btn, grid-2 | Einwilligungsgruppe, Namenszuordnung; native lange Auswahlliste |
| T2 | Textgespräch | row-between, textarea, btn, stack | Gesprächsbeitrag und Verbindungsstatus |
| T3 | Sprachgespräch | card, btn, details | Sprachstatus und Mikrofonsteuerung |
| T4 | Verlängerung | hero-center, hero-cta, btn | Zielzeit-Gesprächsmoment |
| T5 | Zusammenfassung | card-rule, textarea, btn | Erkenntniszusammenfassung und Korrektur |
| T6 | Interviewstatus | hero-center, tag, btn | Unvollständig / beendet / pausiert |
| T7 | Persönliche Fortsetzung | hero-center, card, btn | Erhaltener Kontext und Linkfehler |
| T8 | Runde geschlossen | hero-center, notice, btn | Gemeinsamer Einstieg vs. persönliche Fortsetzung |
| A1 | Admin-Login | field, input, btn | Anmeldefehler und Verzögerung |
| A2 | Studienübersicht | log-list / ds-table, field, tag | Rundenbezug und Verarbeitung |
| A3 | Vorbereitung | grid-2-1, field, textarea, btn | Hypothesenkarte und Gesprächsrahmen |
| A4 | Zentrale Listen | grid-2, card, input, btn | Listenbearbeitung und Prüffreitext |
| A5 | Testinterview | T2-Gesprächsbausteine | Testkennzeichnung; isolierter Testkontext |
| A6 | Fortschritt | grid-3, ds-table, num, btn | Antwortbasis, gefülltes Verteilungsdiagramm und Ausschlusszustände |
| Ergänzung | Belegprüfung | grid-2-1, select, textarea, dialog | Belegansicht, Gesamtbewertung, begründeter Ausschluss |
| Report | A4-Basisdesign | ds-table, num, rule, display | Druckseiten, Berichtsmetadaten, Quellen- und Methodengrenzen |
Aktueller Fach- und Umsetzungsstand
- Grundlage: vollständiger Design-KI-Brief und Gesamtkonzept im Projekt. Die frühere Quellenlücke betrifft den ursprünglichen OpenDesign-Export.
- Adminfunktionen umgesetzt: Hypothesen und Versionen, Gewichtung und Zielzeit, Sollwerte, zentrale Abteilungen und Rollen, Interviewdetails, Belegprüfung und Korrekturen, Ausschluss und Wiederherstellung.
- Rundenverwaltung umgesetzt: manueller Abschluss, Wiederöffnung und Folgerunden; begonnene Interviews bleiben ihrer Startversion zugeordnet.
- UI-Report umgesetzt: Antwortbasis, Bestätigungen und Gegenbelege, Team-Gesamturteile, offene Problemgruppen und Prüfstatus. Native PDF-Erzeugung bleibt integriert zu prüfen.
- Lokale Prüfung: 104 Backendtests, Typecheck und Build sowie Chromium-Checks für Desktop und Mobile. Die App ist noch nicht für den Produktivbetrieb freigegeben.
- Offen bleiben konkrete Studieninhalte, Pilotgruppe, Betriebsinfrastruktur, verbindliche Aufbewahrungs- und Linkfristen sowie die Qualität echter KI-, Sprach- und Mailanbindungen.
- Sprache derzeit mit Aufnahme/Stop je Beitrag; kontinuierlicher Telefonmodus ist noch nicht umgesetzt. Automatische Übersetzung sämtlicher Reportbelege ist noch offen.
- Gelieferte WTS-Webtokens und Logo sind in der App übernommen. Die ursprünglichen HTML-Demos sind weiterhin eigenständige Designreferenzen.
Interaktions- und Datenschutzgrenzen des Prototyps
Kein Backend, keine echte KI, Authentifizierung, E-Mail-Zustellung oder Auswertung. Freie Gesprächsantworten sind als lokale Demo-Antworten gekennzeichnet. Die Sitzung verwendet sessionStorage zur Fortsetzung zwischen Screens. Schließen Sie die Sitzung oder löschen Sie die Demodaten nach der Prüfung. Keine realen personenbezogenen Daten verwenden.
Prüfumfang
44px-Ziele, sichtbarer Tastaturfokus, beschriftete Felder, textliche Statusanzeigen und Diagrammbeschriftungen. Mobile Tabellen werden als Zeilenblöcke neu angeordnet. Flexible Container und einspaltige Umbrüche sind für 360 bis 1920px statisch geprüft. Im ursprünglichen OpenDesign-Export war kein visueller Export verfügbar. Desktop- und Mobile-PNGs wurden anschließend lokal erstellt; die Dokumentationsansicht wurde auf den aktuellen Stand gebracht. JavaScript-Syntax, alle Screenlinks und die zentralen Abläufe wurden mit DOM-Prüfungen getestet; keine gerenderte Browser- oder Assistenztechnikprüfung.