Redesign – SuperFit App/Member Area

Im Kurs Digitale Typografie von Frank Rausch ging es darum, die Regeln und Methoden der analogen Typografie auch im digitalen anzuwenden. Das Ziel war es, die Mittel & Tools die einem die digitale Typografie zur Verfügung stellt zu nutzen und das Potential darin zu erkennen. Dazu gab es jede Woche eine neue Aufgabe, die uns dazu brachte uns mit einem typografischen Problem zu beschäftigen. In den letzten Wochen des Kurses konnten wir uns ein Projekt suchen, für das wir ein digitales Produkt, eine Webseite oder App typografisch umgestalten und redesignen sollten. Ich habe mich dafür entschieden, die App der Fitnessstudio-Kette Superfit so umzugestalten, dass ihre Nutzung einladend und hilfreich ist. Dabei wollte ich die grundlegende Funktionalität der App beibehalten.

Der Status Quo

In einem ersten Schritt habe ich die Schwächen der Superfit App und der darin »integrierten« Member Area vrogenommen. Die Member Area ist der Bereich in dem die Mitglieder der Studios ihre Verträge und persönlichen Daten einsehen und bearbeiten können. Aktuell weist diese digitale Produkt folgende Schwächen auf:

– Undurchsichtiges Hauptmenü
– Uneinheitliche Menüführung
– enge & kleine Schrift
– charakterlose Typografie
– Unnötig komplizierte Informationsarchitektur

Diese Punkte wollte ich in meinem Redesign verbessern.

Redesign

Zu erst habe ich die leicht unterschiedlichen Rottöne, die sich im UI der App befinden, durch ein Magenta ersetzt, dass nun als Primärfarbe dient.

Bei der Schriftauswahl wollte ich eine Schrift die dynamisch und doch gut leserlich ist. Meine Wahl viel zunächst auf die Dax Pro. Das Schriftbild der Dax Pro erinnert allerdings ein wenig zu sehr an einen Computerspiel-Kontext. Eine gute Alternative dazu bietet die »Ubuntu«, eine Schrift, die im Zeitraum 2010-2011 entwickelt wurde. Die Entwicklung wurde im Namen der breiteren Freie-Software-Gemeinschaft und des Ubuntu-Projekts finanziert. Das technische Schriftdesign und die Implementierung werden von Dalton Maag durchgeführt, einer internationalen Schrift Foundry, die sich auf Schriftdesign und digitale Schriftproduktion spezialisiert hat.
Ubuntu hat mir erlaubt, das UI viel übersichtlicher und mit mehr Charakter zu gestalten.

Menüstruktur

Neben der Änderung von Farbe und Font habe ich als Omage an das ursprüngliche App Design die geometrischen Objekte silhouettenhaft nachgezeichnet und (geblurrt) als Hintergrund eingefügt.

Die Menüpunkte habe ich dunkel und halbtransparent gestaltet, so dass der Hintergrund auch ein wenig zur Geltung kommt.

Datenzugriff & -übersicht

In einem weiteren Schirtt habe ich die Art und Weise wie Daten – egal ob Vertragsdaten oder Persönliche Daten, wie Adressen und Telefonnummern – eingesehen und bearbeitet werden können.

Feed

Zum Abschluss habe ich die chaotische Struktur des Studiofeeds überarbeitet. Statt der immer wiederkehrenden Standardphrasen habe ich Icons und kurze Beschreibungen eingesetzt und somit ein aufgeräumteres Interface geschaffen.

Alle redesignten Screens

Abschlusspräsentation

PDF

Fazit

Der Kurs hat mich in vielerlei Hinsicht weitergebracht. Zum einen konnte ich die Regeln der Typografie , die ich im Print-Kontext gelernt habe, nun auch im digitalen Rahmen umsetzen. Über das Semester hinweg habe ich viele Tools kennengelernt und meinen Blick für typografische Feinheiten geschärft.

Das Projekt an sich hat nochmal die gesammelten Erkenntnisse gebündelt und die Komponente des App Designs hinzugefügt. Alles in allem denke ich auch, dass mir eine deutliche Verbesserung des UIs der Superfit App gelungen ist.