Die App Tebonin® Übungen gegen Schwindel unterstützt die Therapie bei Schwindel mit speziellen Übungen, die auf dem neuesten Stand wissenschaftlicher Erkenntnissen beruhen. Sie bietet 23 Übungsanleitungen, die dem Nutzer nach Eingabe der Diagnose zu einem passenden Übungsplan zusammengestellt werden.
Das Befinden des Nutzers wird regelmäßig von der App abgefragt und in einem Report dargestellt. Der Export dieser Daten kann dem behandelnden Arzt zur Verfügung gestellt werden.
Organisation und Durchführung des Projekts
In diesem Projekt waren wir für die Konzeption und alles was die User Experience und das Visual Design angeht, verantwortlich. Da es sich um ein medizinisches Produkt handelt, unterliegt die App verschiedenen Vorgaben im Entwicklungsprozess und der Dokumentation. Für diesen Bereich war die Firma Johner Medical Teil des Projektteams. Für regelmäßigen Austausch und um offene Fragen zu klären, haben wir uns für wöchentliche Sprintplannings zusammen mit dem Kunden getroffen.
Analyse der bestehenden App
Bevor wir mit der Überarbeitung des Designs begonnen haben, haben wir gründlich analysiert: Die Nutzungsdaten zeigten, dass die Downloadrate zwar hoch war, die App dagegen aber selten genutzt wurde. Es gab also pain points im Nutzererlebnis, die die Nutzer zum Ausstieg brachten. Wir führten zuerst einen ausführlichen UX-Audit durch, um diese Probleme in der Nutzerführung zu identifizieren und Lösungsansätze dafür zu finden. Die Kernzielgruppe an die wir uns mit der App richten, ist 60 Jahre oder älter und von Schwindel betroffen. Somit ist unsere Nutzergruppe tendenziell wenig technikaffin und in der Nutzung mobiler Endgeräte und deren Apps eher unroutiniert.
Konzeption der Funktionen und Nutzerführung
Im nächsten Schritt wandten wir uns der Konzeption der einzelnen Bereiche der App zu. Bei der Erstnutzung der App ist ein umfängliches Onboarding sehr wichtig: Auf den ersten Screens muss auf eine verständliche und einfache Art erklärt werden, was die App dem Nutzer bietet und welche Vorteile er davon hat. Außerdem werden wichtige medizinische Daten abgefragt, die den späteren Übungsplan beeinflussen. Der Prozess muss also klar erklärt werden und nachvollziehbar sein.
Für die Eingabe der Diagnose, den Übungsplan, die Reports und die Erinnerungs-Funktion der App, erstellten wir Screens und optimierten diese in mehreren Schritten. Wir haben die Texte, den Aufbau der Screens und die Nutzerführung immer weiter entwickelt und genau für die Zielgruppe angepasst. Wichtig war es, übersichtliche Screens zu erstellen, nicht zu viele Informationen und Interaktionen unterzubringen und die Sprache und Texte eindeutig und einfach verständlich zu halten. Nur so kann die App der Nutzergruppe gerecht werden.
Feedback von echten Nutzern: User Testing
Aus den daraus entstandenen Wireframes entwickelten wir low-fidelity Prototypen, um damit Nutzerfeedback einzuholen. Low-fidelity bedeutet, dass hier Inhalte und Funktionen ohne finales Visual Design abgebildet sind. Dafür haben wir moderierte Usability-Tests mit vier Personen aus der entsprechenden Zielgruppe durchgeführt. Der Prozess durchlief mehrere Iterationen: für die hier identifizierten Probleme entwickelten wir Lösungen und passten wenn notwendig die Texte, den Aufbau der Screens oder auch die Nutzerführung an, bis wir zu einem auf die Zielgruppe optimierten Ergebnis kamen.
Ein neues Visual Design für die App
Ein Design-System als Basis
Wir haben eine Auswahl von Screens vordefiniert und diese auf unsere Testergebnisse aufbauend ausgestaltet. Danach haben wir daraus ein Design System definiert, das wir für alle weiteren Screens in der Entwicklung als Grundlage verwendet haben.
Native Apps für Android und iOS
Die App ist für Android und iOS Nutzer verfügbar. Da jedes Betriebssystem mit eigenen technischen Anforderungen und UI-Patterns arbeitet, haben wir zwei Design-Systeme erstellt. Wir haben uns entschieden mit den jeweiligen Schriftarten, die im System von Android und iOS verwendet werden, zu arbeiten. Das Erscheinungsbild wäre zwar konsistenter, aus folgenden Gründen haben wir uns jedoch für die Verwendung von Systemschriften entschieden:
- bessere Performance
- sehr gute Lesbarkeit, da die Schriften genau für diesen Zweck entwickelt wurden
- Unterstützung von Systemanpassungen wie zum Beispiel dynamische Schriftgrößen
- die Unterstützung aller Sprachen und Zeichen, da die App in sieben weitere Sprachen übersetzt wird
- bei Apps mit Systemschriften muss nicht für jedes Update Entwicklungsarbeit investiert werden
Gestaltet und getestet haben wir auf den kleinsten aktuellen Device-Größen mit 320px Viewport-Breite. So konnten wir sicherstellen, dass alle Elemente und Texte ausreichend Platz auf allen Endgeräten haben. Die Umsetzung der App hat eine Agentur übernommen, die auf die mobile App Entwicklung spezialisiert ist. Aus dem finalen Design haben wir einen Styleguide im Tool Zeplin aufgebaut. So konnten wir alle (für die Umsetzung des Designs) notwendigen Informationen übersichtlich zur Verfügung stellen.
Fazit: Zusammenspiel von Nutzerbedürfnissen und Design
Mit dem Relaunch der Tebonin-App konnten wir in einem nutzerzentrierten Design-Prozess ein digitales Produkt weiterentwickeln, das passgenau auf die Bedürfnisse der Zielgruppe zugeschnitten ist. Die App hilft dem Nutzer neben ärztlicher Begleitung und Medikation, durch regelmäßige Übungen seine Schwindelbeschwerden zu verbessern und damit auch zu mehr Lebensqualität. Durch die optimierte Benutzerführung und das auf die Zielgruppe angepasste Visual Design findet er sich nun in der App zurecht. Wir freuen uns über das Ergebnis und danken unserem Kunden und Partner für eine tolle Zusammenarbeit!
Das Projektteam
Design und Experience
Jim Morrison, Doro Sthamer, Michael Wallner
Technische Dokumentation und summative Evaluation
Johner Medical
Hast Du Fragen zum Projekt oder unserem Prozess oder möchtest gerne selbst mit uns durchstarten? Dann geht es hier für Dich weiter.
