HaemActive

In dieser Case Study beschreiben wir, wie wir die App HaemActive bei Karlmax Berlin entwickelt haben. Der Fokus liegt dabei auf dem Konzept und dem Erstellungsprozess and unseren Ergebnissen nach der Erstellung des MVPs.

Es wird ein detaillierter Einblick gegeben auf die nötigen Schritte und Aufgaben, die erfüllt werden müssen bevor der Software Entwicklungsprozess startet. Außerdem wollen wir die Idee hinter verschiedenen Zwischen-Artefakten beleuchten und wie wir sie im frühen Projektstadium nutzen, um Erkenntnisse zu sammeln.

Einen allgemeineren Einblick in das Projekt gibt unsere Projektreferenz.

Grundlegende Annahmen

Menschen mit Hämophilie benötigen ein gewisses Fitness-Level, um Verletzungen zu vermeiden. Viele Patienten und Verwandte sind jedoch unsicher, welche Übungen geeignet sind und meiden deshalb diese körperliche Herausforderung.

Nutzer & Zielgruppen

Menschen mit Hämophilie unterschiedlichen Alters und verschiedener Krankheitsbilder; Eltern und Angehörige, sowie Physiotherapeut:innen und Ärzt:innen.

Herausforderung

Das Engagement von NovoNordisk für Menschen mit Hämophilie sollte unterstrichen und eine umfassende Versorgung gefördert werden. Ihnen sollte Sicherheit in ihren physiotherapeutischen Übungen und Motivation zu regelmäßiger Bewegung gegeben werden. Physiotherapeut:innen sollte ein Werkzeug zur Betreuung der Menschen mit Hämophilie und eine gewisse Entlastung zur Verfügung gestellt werden. Ärzt:innen sollte bei der optimalen Rundumversorgung Unterstützung geboten werden.

Lösung

Gut und sicher leben mit Hämophilie: Ängste abbauen, motivieren und mobilisieren. Mit Hilfe von Videos und Anleitungen können die Patient:innen geeignete Übungen sicher und regelmäßig durchführen, um gesund zu bleiben und individuelle Fitnessroutinen zu entwickeln.

Wie alles begann

Am Anfang stand ein Workshop mit verschiedenen Beteiligten, in denen wir gemeinsam mit unserem Partner hoch3 und NovoNordisk gemeinsam die Grundannahme erarbeitet haben und verschiedene Alternativen beraten. Wichtige Fragen drehten sich um die Einbindung in den Alltag, die Zusammenarbeit zwischen Therapeut:innen und den Nutzer:innen und wie ein Austausch zu Übungen und Erfolgen geschehen kann.)

User flow

In enger Zusammenarbeit mit dem Kunden entwickelten wir eine zielgerichtete Architektur. Somit konnte das Entwicklungsteam eine verständliche Darstellung der einzelnen Produktbereiche der App entwickeln. Gleichzeitig wurde die Navigation und gewisse Interaktionen sichtbar, damit sie validiert werden konnten, bevor der nächste Schritt folgte.

User stories

Anhand des User Flows erstellten wir ein Konzept, um das Problem der Anfangsphase zu lösen.

Um die Nachhaltigkeit und die Lebensfähigkeit beurteilen zu können, haben wir das Konzept mit Ärzten, Physiotherapeuten und den tatsächlichen Nutzern getestet. Wir haben viel zu den Erwartungen an die App gelernt und das Featureset abermals optimiert. Als Ergebnis konnten wir das Backlog mit Epics und User Stories füllen – die Basis für die Designs der Wireframes.

Wireframes

Wir entschieden uns, eine Bottom Navigation Bar zu entwickeln mit drei Hauptbereichen: Information, Übungen und Training.

Jeder Bereich ist in Unterbereiche im selben Format unterteilt: Top Tab Bar. Dadurch hat der/die User:in eine konsistente Navigation in jedem Bereich und kann sich auf den Content fokussieren.

Das Hauptfeature des Produkts is das Videomaterial, welches von NovoNodisk zur Verfügung gestellt wird. Der/die User:in kann sich mithilfe der Videos weiterbilden über Übungen, die geeignet sind für Personen mit Hämophilie, welches die Hauptaufgabe der App ist. Somit ist der Video Player der zentrale und wertvollste Teil der App.

Features

Die Kategorien der Übungen Dehnen, Kräftigen und Koordinieren sind jeweils in drei Unterkategorien geteilt: obere Extremitäten, Rumpf, untere Extremitäten.

Um den Videoplayer zu öffnen, muss der/die User:in lediglich auf eine Karte tippen und gelangt zur Detailseite. Hier gibt es noch Features wie „Als Favorit markieren“ und „Zum Trainingsplan hinzufügen“.

Die Funktion, eigene Videos hinzuzufügen, ist eines der Unique Selling Points von HaemActive und ist in jeder Kategorie verfügbar. Die Funktion kann über die Kamera gestarten werden und ist intuitiv nutzbar.

Um als Ergänzung zur Physiotherapie zu dienen, zielt die App darauf ab, tägliche Übungseinheiten zu fördern. Die individuellen Videos können dabei miteinander kombiniert werden, um einen Trainingsplan zu bilden.

Erstellung eines Images

Wir starteten mit einer Überprüfung der existierenden Apps, unter Berücksichtigung der Richtlinien und CI Spezifikationen von NovoNordisk. Wir fanden heraus, dass eine subtile UI kombiniert mit verspielten Grafiken die App angenehm und unterhaltsam gestaltet.

Das Mood Board, welches die visuelle Sprache und den Stil der App visualisiert, basiert auf diesen Erkenntnissen. Um besser zu verstehen, was illustriert werden soll, untersuchten wir ebenfalls die Positionen des Körpers während der Übung.

Durch die daraus resultierenden Illustrationen wurden einige Produktbereiche grafisch unterstützt und versinnbildlicht. Wir haben sie für die Darstellung der Kategorien verwendet sowie für den Hintergrund der Interaktionen.

Der Stil ist bewusst simpel gehalten. Details in Gesichtern und Kleidung werden minimal gehalten, um den Fokus auf den Körper zu richten.

Durch die Farbwahl vermeiden wir ethnische Feinheiten und können dadurch Stereotypen der User Gruppe vermeiden.

Die UI einer Cross-Plattform App zu erstellen involvierte die Aufgaben, Illustrationen und ein Design System zu erstellen, sowie die Google Material Guidelines zu benutzen. Unser Team entschied sich, das kürzlich veröffentlichte Cross-Plattform Framework Flutter zu verwenden.

Wir wählten klare und lebendige Farben, welche Teil der NovoNordisk Farbpalette sind.

Die Hauptfarben sind weiß und dunkelblau. Sie werden ergänzt durch hellblau, schwarz und zusätzliche Grautöne.

Aktive Zustände sind z.B. dunkelblau und inaktive Zustände hellblau. Informationselemente (beispielsweise Anweisungen für Übungen) sind grau gefärbt. Die begleitenden Illustrationen nutzen eine komplementäre Farbpalette, welche aus zusätzlichen NovoNordisk Farben besteht.

Fassen wir zusammen

Unsere Herausforderung war es, Menschen mit Hämophilie Sicherheit in ihren Physiotherapie Übungen zu bieten und sie zu motivieren, regelmäßig zu trainieren. Durch Erstellen einer intuitiven Navigation, einem zusammenhängenden visuellen System und User-freundlichen Interaktionen konnte unser Team ein Produkt veröffentlichen, welches jetzt von Tausenden von Usern weltweit genutzt wird.

CoachYourself