Design Sprint › Erstellung des Prototypen
Protoyp als Figma-Klickdummy
Allgemein
- Wahl der Plattform: Figma -> schnelle Gestaltung möglich / Interaktivität / Mobiler Prototyp möglich + Neues Feature der Videoeinbindung
- Mobiler Prototyp: Größe iPhone 11/12 -> Smartphone steht beim User Test in echt zur Verfügung
Vorgehen
- Um Einheitlichkeit zu erreichen ist es wichtig eine grundlegende Design-Sprache zu entwickeln -> Definition von Schriften, Farben und einer groben Layout-Aufteilung
- Schrift: Lesbarkeit für Menschen mit Dyslexia (Zielgruppe) muss gegeben sein. Google Fonts stellt zwei Schrift-Familien bereit, die explizit für diese Nutzergruppe gestaltet wurde. (Lexend, Atkinson Hyperlegibal) -> Wahl auf Lexend da Variable Font und Schrift mehrere Breite-Grade anbietet: Höhere Lesbarkeit
- Grauwerte: Kontrast-Werte von mind. AA (WCAG 2.0) -> bestehende Grauwerte (IBM‘s Carbon Design System)
- Farbe: Entspannende und Beruhigende Farben -> Grüne Farbwerte
- Aufteilung der Gestaltung in die Gruppenmitglieder, um den Prototypen so schnell es geht umsetzen zu können -> Aufteilung nach Abschnitt im User Flow (Onboarding, Zielbeschreibung, Navigationsbegleitung, Belohnung)
- Vorgehen in mehreren Iterationen: erste Gestaltung (4 Pers.), Vereinheitlichung und zusammenhängende Erweiterung um Interaktionspunkte
Minimale Anpassung des Prototypen nach Entwicklung des Nutzertest-Plans -> Aufteilung der screens während Navigation für Positive/Negative-Flow
- Vorlesung von Inhalten: Text-to-Speech Neuronales Netz -> Konvertierung in mp4
Retro
- Umsetzung der Designsprache war im Team -> Prozess war zu lange (besser wäre alleine)
- Vereinheitlichung der Gestaltung war notwendig, da teilweise Gestaltung auseinander gegangen ist
