390 lines
11 KiB
Markdown
390 lines
11 KiB
Markdown
# UX Audit U1
|
|
|
|
## Ziel
|
|
|
|
Dieser Audit bildet Phase U1 des Bedienbarkeitskonzepts ab. Er dient als priorisierte Arbeitsgrundlage fuer die eigentliche UX-Ueberarbeitung.
|
|
|
|
Untersucht wurden:
|
|
|
|
- Shell und Navigation
|
|
- Einstieg ohne Login
|
|
- Registrierung/Login
|
|
- Forum
|
|
- Vokabeltrainer
|
|
- Falukant
|
|
- Admin
|
|
- Match3/Minigames
|
|
|
|
## Bewertungslogik
|
|
|
|
- `P1`: blockiert Kernnutzung oder fuehrt sehr leicht zu Fehlbedienung
|
|
- `P2`: verlangsamt oder verkompliziert Kernnutzung merklich
|
|
- `P3`: Konsistenz-, Lesbarkeits- oder Komfortproblem
|
|
- `P4`: Feinschliff
|
|
|
|
## Gepruefte Hauptaufgaben
|
|
|
|
1. Einloggen und Einstieg verstehen
|
|
2. Registrieren
|
|
3. Forum finden, Thema erstellen und lesen
|
|
4. Vokabelsprache finden, anlegen, abonnieren und lernen
|
|
5. Falukant-Status erfassen und Folgeaktion auswaehlen
|
|
6. Admin-Nutzer oder Match3-Daten bearbeiten
|
|
7. Match3 starten, pausieren und Kampagnenstatus verstehen
|
|
|
|
## Ergebnisuebersicht
|
|
|
|
- P1: 4 Punkte
|
|
- P2: 11 Punkte
|
|
- P3: 13 Punkte
|
|
- P4: 6 Punkte
|
|
|
|
## P1-Probleme
|
|
|
|
### P1-1: Historische innere Scrollkonzepte in Teilbereichen
|
|
|
|
Bereiche:
|
|
|
|
- Falukant
|
|
- Admin
|
|
- Minigames
|
|
|
|
Beobachtung:
|
|
|
|
- Mehrere Views arbeiten weiterhin mit eigenen `contenthidden/contentscroll`-Strukturen innerhalb des bereits scrollbaren App-Contents.
|
|
- Das fuehrt zu falschen Sticky-Bezuegen, abgeschnittenen Bereichen und inkonsistenter Scrolllogik.
|
|
|
|
Risiko:
|
|
|
|
- Nutzer verlieren Orientierung.
|
|
- statische Leisten oder Footer/Header verhalten sich unerwartet.
|
|
|
|
Empfehlung:
|
|
|
|
- alle View-internen Scrollcontainer systematisch inventarisieren
|
|
- entscheiden, welche Bereiche echte lokale Scrollflaechen brauchen und welche komplett auf die Shell-Scrolllogik gehen
|
|
|
|
### P1-2: Fehler- und Erfolgsfeedback ist nicht konsistent genug
|
|
|
|
Bereiche:
|
|
|
|
- Auth
|
|
- Settings
|
|
- Admin
|
|
- Vokabeltrainer
|
|
|
|
Beobachtung:
|
|
|
|
- Mischung aus `alert`, MessageDialog, ErrorDialog, DialogWidget-internem Feedback und stillen `console.error`-Pfaden.
|
|
- Beispiel: [RegisterDialog.vue](/mnt/share/torsten/Programs/YourPart3/frontend/src/dialogues/auth/RegisterDialog.vue) nutzt fehleranfaellig `errrorDialog` statt eines klar vereinheitlichten Feedbackpfads.
|
|
|
|
Risiko:
|
|
|
|
- Nutzer verstehen nicht sicher, ob eine Aktion fehlgeschlagen ist oder erfolgreich war.
|
|
- Fehler werden in einzelnen Flows inkonsistent oder gar nicht sichtbar.
|
|
|
|
Empfehlung:
|
|
|
|
- gemeinsames Feedbacksystem definieren
|
|
- `success`, `warning`, `error`, `info`, `loading` als einheitliche Muster durchziehen
|
|
|
|
### P1-3: Formvalidierung erfolgt oft zu spaet oder zu unsichtbar
|
|
|
|
Bereiche:
|
|
|
|
- Registrierung
|
|
- Account-Settings
|
|
- Admin
|
|
- Falukant-Formulare
|
|
|
|
Beobachtung:
|
|
|
|
- viele Formulare validieren erst beim Absenden
|
|
- Feldfehler sitzen selten direkt am Eingabepunkt
|
|
- Pflichtlogik ist nicht durchgaengig erkennbar
|
|
|
|
Risiko:
|
|
|
|
- hohe Reibung beim Ausfuellen
|
|
- Wiederholschleifen und Frust bei laengeren Formularen
|
|
|
|
Empfehlung:
|
|
|
|
- Validierung naeher ans Feld bringen
|
|
- Pflichtfelder, Eingabeformat und Fehltext systematisch sichtbar machen
|
|
|
|
### P1-4: Komplexe Arbeitsflaechen haben zu wenig gefuehrte Primaeraktionen
|
|
|
|
Bereiche:
|
|
|
|
- Falukant
|
|
- Admin Match3
|
|
|
|
Beobachtung:
|
|
|
|
- Fachflaechen zeigen viele Optionen gleichzeitig, ohne klare Priorisierung.
|
|
- Beispiel: [MinigamesView.vue](/mnt/share/torsten/Programs/YourPart3/frontend/src/views/admin/MinigamesView.vue) ist funktionsreich, aber als Bearbeitungsfluss kaum gefuehrt.
|
|
|
|
Risiko:
|
|
|
|
- Nutzer verstehen den naechsten sinnvollen Schritt nicht.
|
|
- Bedienfehler in fachlich dichten Bereichen steigen.
|
|
|
|
Empfehlung:
|
|
|
|
- pro komplexer View den eigentlichen Arbeitsfluss definieren
|
|
- Primaeraktionen, Sekundaeraktionen und Expertenaktionen sichtbarer trennen
|
|
|
|
## P2-Probleme
|
|
|
|
### P2-1: Hauptnavigation ist funktional, aber noch nicht ausreichend auf Aufgaben priorisiert
|
|
|
|
Beobachtung:
|
|
|
|
- Navigation ist technisch konsistenter als vorher, aber die inhaltliche Priorisierung der Menuepunkte ist noch stark historisch gewachsen.
|
|
- Der Unterschied zwischen Kernzielen und Tiefenfunktionen ist nicht deutlich genug.
|
|
|
|
Empfehlung:
|
|
|
|
- Menueaufbau gegen echte Nutzungsszenarien pruefen
|
|
- seltene Spezialpunkte staerker entlasten
|
|
|
|
### P2-2: Login-Einstieg ist reich an Inhalt, aber nicht maximal fokussiert
|
|
|
|
Beobachtung:
|
|
|
|
- [NoLoginView.vue](/mnt/share/torsten/Programs/YourPart3/frontend/src/views/home/NoLoginView.vue) erzaehlt Produkt und Zugang parallel.
|
|
- Fuer Erstnutzer ist die Seite informativ, aber die eigentliche Primaerhandlung konkurriert mit vielen Begleitinhalten.
|
|
|
|
Empfehlung:
|
|
|
|
- Zugangspfad noch klarer vom Story-Bereich trennen
|
|
- Login, Registrierung und Passwort-Reset als zusammenhaengenden Entscheidungsraum denken
|
|
|
|
### P2-3: Registrierung ist bedienbar, aber noch nicht robust genug gefuehrt
|
|
|
|
Beobachtung:
|
|
|
|
- [RegisterDialog.vue](/mnt/share/torsten/Programs/YourPart3/frontend/src/dialogues/auth/RegisterDialog.vue) ist funktional, aber nutzt wenig Hilfetext, kaum Inline-Validierung und schwer lesbare Fehlerpfade.
|
|
|
|
Empfehlung:
|
|
|
|
- Feldgruppen strukturieren
|
|
- Passwortlogik und Sprachwahl klarer erklaeren
|
|
- Fehler am Feld statt nur global rueckmelden
|
|
|
|
### P2-4: Forum hat guten Einstieg, aber zu wenig Orientierung im Schreiben-und-Lesen-Wechsel
|
|
|
|
Beobachtung:
|
|
|
|
- [ForumView.vue](/mnt/share/torsten/Programs/YourPart3/frontend/src/views/social/ForumView.vue) mischt Themenliste und Neuerstellung in einem einfachen Toggle.
|
|
- Es fehlt eine staerkere Fuehrung, wann man lesen und wann man schreiben soll.
|
|
|
|
Empfehlung:
|
|
|
|
- Schreibmodus staerker vom Lesemodus absetzen
|
|
- Entwurf, Abbruch und Rueckkehr klarer machen
|
|
|
|
### P2-5: Vokabeltrainer ist funktional breit, aber als Lernpfad noch nicht klar genug
|
|
|
|
Beobachtung:
|
|
|
|
- Anlegen, Abonnieren, Kapitel, Kurs, Lektion und Uebung sind einzeln verbessert, bilden aber noch keinen vollkommen klaren End-to-End-Lernpfad.
|
|
|
|
Empfehlung:
|
|
|
|
- Informationsarchitektur entlang von:
|
|
- entdecken
|
|
- beitreten
|
|
- lernen
|
|
- ueben
|
|
- bearbeiten
|
|
|
|
### P2-6: Falukant ist visuell stark, aber in taeglichen Routineablaeufen noch nicht effizient genug
|
|
|
|
Beobachtung:
|
|
|
|
- Statusleiste und Einstiege sind besser, aber Arbeitsablaeufe ueber mehrere Unterseiten bleiben kognitiv schwer.
|
|
|
|
Empfehlung:
|
|
|
|
- Top-5-Routinen definieren
|
|
- dafuer direkte Folgeaktionen aus Status und Uebersichten anbieten
|
|
|
|
### P2-7: Admin-Flaechen haben zu wenig gemeinsame Bedienlogik
|
|
|
|
Beobachtung:
|
|
|
|
- einzelne Admin-Seiten sind moderner, aber Such-, Editier- und Speichermuster unterscheiden sich weiterhin.
|
|
|
|
Empfehlung:
|
|
|
|
- gemeinsames Admin-Muster fuer Suche, Detailansicht, Editieren und Speichern definieren
|
|
|
|
### P2-8: Match3 hat gute Spieloberflaeche, aber Meta-Interaktion ist noch zu verstreut
|
|
|
|
Beobachtung:
|
|
|
|
- Spielstatus, Levelbeschreibung, Statistiken und Steuerung konkurrieren um Aufmerksamkeit.
|
|
|
|
Empfehlung:
|
|
|
|
- klare Prioritaet:
|
|
- Spielbrett
|
|
- aktuelles Ziel
|
|
- verbleibende Zuege
|
|
- Meta-Infos nur sekundär
|
|
|
|
### P2-9: Rueckwege sind nicht ueberall gleich gut sichtbar
|
|
|
|
Bereiche:
|
|
|
|
- Vokabel-Unterseiten
|
|
- Forum-Themen
|
|
- Falukant-Unterseiten
|
|
- Admin-Details
|
|
|
|
Empfehlung:
|
|
|
|
- gemeinsames Rueckwegmuster definieren
|
|
- nicht nur einzelne Buttons, sondern konsistente Bereichsorientierung
|
|
|
|
### P2-10: Leere Zustände sind nicht systematisch genug
|
|
|
|
Beobachtung:
|
|
|
|
- teilweise vorhanden, aber sehr uneinheitlich in Ton, Handlungsangebot und Sichtbarkeit.
|
|
|
|
Empfehlung:
|
|
|
|
- Standard fuer:
|
|
- keine Daten
|
|
- keine Treffer
|
|
- noch nicht gestartet
|
|
- keine Berechtigung
|
|
|
|
### P2-11: Mobile Nutzbarkeit ist verbessert, aber nicht abschließend entlang echter Kernaufgaben geprüft
|
|
|
|
Empfehlung:
|
|
|
|
- echter Geräte-/Viewport-Durchgang entlang der Kernszenarien
|
|
|
|
## P3-Probleme
|
|
|
|
### P3-1: Button-Semantik und Farblogik sind noch nicht vollkommen systematisch
|
|
|
|
Beobachtung:
|
|
|
|
- globale Buttons sind modernisiert, lokale Altvarianten bestehen weiter.
|
|
|
|
### P3-2: Teilweise alte Feld- und Listenmuster in Spezialbereichen
|
|
|
|
### P3-3: Headline-Hierarchien sind nicht in allen Ansichten gleich klar
|
|
|
|
### P3-4: Dialoginhalte wirken je nach Bereich unterschiedlich dicht
|
|
|
|
### P3-5: Tabellen haben uneinheitliche Leselogik und Aktionsplatzierung
|
|
|
|
### P3-6: In einigen Bereichen ist unklar, welche Aktion primaer und welche optional ist
|
|
|
|
### P3-7: Beta-/Systemhinweise koennen in Teilen ruhiger und weniger redundant werden
|
|
|
|
### P3-8: Einige Views nutzen sehr lange vertikale Inhaltsflaechen ohne Zwischenanker
|
|
|
|
### P3-9: Inline-Hilfen und Tooltips sind in komplexen Bereichen noch unterentwickelt
|
|
|
|
### P3-10: Touch-/Hover-Verhalten ist nicht in allen Spezialviews gleich robust
|
|
|
|
### P3-11: Message- und Error-Wording ist noch nicht konsistent
|
|
|
|
### P3-12: Manche Dialoge und Formulare sind auf Desktop gut, aber auf enger Breite nur ausreichend
|
|
|
|
### P3-13: Such- und Filterbereiche koennten staerker standardisiert werden
|
|
|
|
## P4-Punkte
|
|
|
|
### P4-1: Mikrointeraktionen in Karten, Listen und Toolbars weiter harmonisieren
|
|
|
|
### P4-2: Badge- und Statusdarstellungen semantisch weiter schaerfen
|
|
|
|
### P4-3: Fokus- und Hover-Zustaende in Spezialkomponenten weiter angleichen
|
|
|
|
### P4-4: Editorbereiche visuell und bedienlogisch weiter vereinheitlichen
|
|
|
|
### P4-5: Leichte Textkuerzungen fuer schnellere Scanbarkeit in Hero-Bereichen
|
|
|
|
### P4-6: Weitere Feinarbeit an Footer/Fensterleiste in langen Nutzungssessions
|
|
|
|
## Bereichsspezifische Kurzbewertung
|
|
|
|
### Shell und Navigation
|
|
|
|
- deutlich verbessert
|
|
- noch offen: inhaltliche Priorisierung, Rueckwege, Endabnahme kleiner Screens
|
|
|
|
### Einstieg ohne Login
|
|
|
|
- stark verbessert
|
|
- noch offen: Zugangspfad fokussierter gegen Story-Inhalt absetzen
|
|
|
|
### Registrierung/Login
|
|
|
|
- funktional ok
|
|
- UX-seitig noch zu wenig gefuehrt und rueckmeldearm
|
|
|
|
### Forum
|
|
|
|
- guter Ueberblick, aber Schreib-/Lesefluss noch nicht ideal getrennt
|
|
|
|
### Vokabeltrainer
|
|
|
|
- optisch konsistent, aber noch kein vollkommen klarer End-to-End-Lernpfad
|
|
|
|
### Falukant
|
|
|
|
- visuell stark, fachlich noch der anspruchsvollste Bedienbereich
|
|
|
|
### Admin
|
|
|
|
- einzelne Ansichten verbessert, gemeinsame Admin-Bedienlogik fehlt noch
|
|
|
|
### Minigames
|
|
|
|
- Match3 solide, aber Status-/Metaebene kann bedienlogisch weiter fokussiert werden
|
|
|
|
## Priorisierte Umsetzung nach U1
|
|
|
|
### Paket U1-A
|
|
|
|
- Feedbacksystem vereinheitlichen
|
|
- Formularvalidierung sichtbar machen
|
|
- Scroll- und Sticky-Logik historischer Sonderfaelle bereinigen
|
|
|
|
### Paket U1-B
|
|
|
|
- Navigation und Rueckwege nach Aufgaben priorisieren
|
|
- Leere Zustände und Systemzustände standardisieren
|
|
|
|
### Paket U1-C
|
|
|
|
- Vokabeltrainer-Lernpfad schärfen
|
|
- Falukant-Routinen entschlacken
|
|
- Admin-Bedienmuster vereinheitlichen
|
|
|
|
### Paket U1-D
|
|
|
|
- Mobile Kernaufgaben-Endabnahme
|
|
- Konsistenz-Feinschliff auf P3/P4-Niveau
|
|
|
|
## Fazit
|
|
|
|
Die App ist gestalterisch deutlich weiter als vor dem Redesign, aber bedienlogisch noch nicht auf demselben Reifegrad. Die größten UX-Hebel liegen nicht mehr in Farben oder Layout, sondern in:
|
|
|
|
- konsistentem Feedback
|
|
- klareren Aufgabenflüssen
|
|
- sichtbarerer Validierung
|
|
- entschlackten Fachbereichen
|
|
- sauberer Priorisierung von Aktionen
|
|
|
|
Phase U1 ist damit abgeschlossen. Die naechste sinnvolle Arbeitsphase ist `U2: Shell, Navigation und Feedback`.
|