app design mockup
strongr / 2024 / app / gamification
- Leistungen
- Konzept
- Wireframing
- UI / UX / Visual Design
Die Idee dieses App Design Mockups basiert auf dem smarten Functional Fitness Band des Startups STRAFFR. Als begeisterter Nutzer inspirierte mich dieses Gadget zur Konzeption der STRONGR play! App. Kernelement ist die Verbindung der individuellen Workout-Routine mit Gamification-Inhalten. Nach dem Motto „Spielerisch fit werden, egal wo man ist“ sollte sie hierbei den Grundgedanken der ursprünglichen App weitertragen.
Starting Point
Die Herausforderung bestand besonders darin, ein modernes und intuitives Nutzererlebnis zu schaffen. Dieses sollte sowohl auf Smartphones und Tablets als auch auf größeren Bildschirmen, z.B. per TV-Übertragung, funktionieren. Die gaming-affine Zielgruppe gestaltete sich dabei sehr heterogen: Vom Fitness-Junkie, über den Gelegenheitssportler bis hin zum Anfänger, der sich spielerisch an sein erstes Home-Workout herantasten will.
Das Gadget bietet durch seine smarte Technologie viele Möglichkeiten dies in ein spielerisches Umfeld zu tragen (Stichwort „Exergaming“). Via Bluetooth erhält der Nutzer Echtzeit-Feedback über Qualität und Ausführung der Übung. Der individuelle Fortschritt wird so messbar.
Deep Dive
Es musste sichergestellt werden, die Ziele des Unternehmens und die individuellen Bedürfnisse und Anforderungen der Zielgruppe gleichermaßen abzudecken. Die gesammelten Informationen wurden mit dem aktuellen Marktumfeld abgeglichen und in ein erstes Konzept überführt. Dazu zählten die Definition der User Personas, der User Journey und des User Flows.
Das Scribble zeigt beispielhaft die Idee vom Intro, Login- und Home-Screen mit Questauswahl, das alle wesentlichen Kernfunktionen abbildet und auf den Fortschritt des Nutzers eingeht.
Design
Basierend auf den Anforderungen der Marke wurde ein Mockup mit entsprechendem Look-and-feel in beispielhafter Standard-Displaygröße ausgearbeitet. Dieses umfasste das Design inklusive Logo, Farben, Schriften, Icons sowie das Styling der App-Elemente.
Cyan als Primärfarbe soll innerhalb der App jene Atmosphäre schaffen, die mit ihr am meisten verbunden wird: Ausgeglichenheit von Körper und Geist, Zufriedenheit und Seriosität.
Noch dazu lenkt der klare Farbton nicht zu sehr vom eigentlichen Inhalt und dessen unterschiedlichen Farben ab.
Mockup 3 zeigt den Home-Screen. Dieser vereint alle wesentlichen Informationen zum aktuellen Stand und Fortschritt. Außerdem zeigt er die verfügbaren Spiele und Trainings. Das momentane Programm ist dabei stets zentral gehighlightet. Beim Anwählen gelangt
der Spieler zur jeweiligen Detailansicht des Abenteuers (Mockup 4). Diese umfasst u.a. die Lore, Missionen und Statistiken.
Eine Besonderheit im Wiederspielwert ist die Skalierbarkeit des Contents dank der Möglichkeit zum „Reskin“: Denkbar wären in diesem Zusammenhang die Integration von weiteren Abenteuern oder auch Adaptionen von bestehenden Spielen und Franchises anhand von Lizenzen. Dies könnte über ein Abo-Modell oder mittels einmaliger In-App-Käufe monetarisiert werden.
Das App-Icon zeigt die Kernelemente von STRONGR play! in stilisierter Form: Band und Spiel, angedeutet als „S“ mit Controller-Buttons. Außerdem illustriert der Mood Shot die Idee vom am TV übertragenen Spiel mit passender Übung.
zurück
