Therapeutische Anwendung (DiGa) zur Heimtherapie von Menschen mit Schulterbeschwerden.
Meine Aufgaben:
- Überführen des Projektes von Adobe XD zu Figma
- Interaction Design
- Wireframes
- Screen Design
- Usability Tests
- Cognitive Walkthrough
- Style guide & Design System
Als UX-Designerin hatte ich die spannende Aufgabe, eine therapeutische App für Menschen mit Schulterbeschwerden zu entwickeln. In diesem Blog-Beitrag möchte ich einen Einblick in das abgeschlossene Projekt geben und die verschiedenen Phasen des UX-Design-Prozesses beleuchten. Vom Überführen des Projektes von Adobe XD zu Figma bis hin zur Gestaltung des Screen Designs und der Durchführung von Usability Tests, werden alle wichtigen Aspekte des Use Cases behandelt.
Überführen des Projektes von Adobe XD zu Figma

Eine der ersten Herausforderungen bestand darin, das bestehende Projekt von Adobe XD zu Figma zu überführen. Dies ermöglichte es dem Team, nahtlos zusammenzuarbeiten und die Vorteile der Funktionen und Kollaborationsmöglichkeiten von Figma zu nutzen. Durch den reibungslosen Transfer aller Designelemente, Prototypen und Interaktionen konnte das Projekt ohne Verzögerungen fortgesetzt werden.
Interaction Design:
Das Interaction Design war ein zentraler Schwerpunkt bei der Entwicklung der Therapie-App. In enger Zusammenarbeit mit Therapeuten und medizinischen Experten wurde eine benutzerzentrierte Designstrategie entwickelt. Die Bedürfnisse und Einschränkungen von Menschen mit Schulterbeschwerden standen im Mittelpunkt, um eine intuitive und barrierefreie Interaktion mit der App zu gewährleisten. Besonders herausfordernd war, dass der Trainingsbereich komplett ohne Interaktionen ablaufen sollte, aber gleichzeitig jederzeit die Möglichkeit zu Feedback geben musste.
Wireframes
Basierend auf dem Interaction Design wurden detaillierte Wireframes für die einzelnen App-Bildschirme erstellt. Diese Wireframes dienten dazu, den Informationsfluss und die Platzierung von Funktionen zu visualisieren. Durch iterative Überarbeitungen wurden die Wireframes schrittweise verfeinert, um eine optimale Benutzerführung zu erreichen. Dabei wurde besonders darauf geachtet, dass die Navigation und die Interaktionselemente leicht zugänglich und benutzerfreundlich sind.

Screen Design
Das visuelle Screen Design spielte eine entscheidende Rolle bei der Gestaltung der Therapie-App. Unter Berücksichtigung der Zielgruppe wurden Farben, Typografie, Symbole und weitere visuelle Elemente verwendet, um ein ansprechendes und kohärentes Erscheinungsbild zu schaffen. Das Design wurde so konzipiert, dass es die Nutzer bei der Nutzung der App unterstützt und ihnen ein angenehmes visuelles Erlebnis bietet.



Usability Tests
Um sicherzustellen, dass die App den Bedürfnissen der Nutzer gerecht wird, wurden umfangreiche Usability Tests durchgeführt. Menschen mit Schulterbeschwerden wurden eingeladen, die App zu testen und Feedback zu geben. Dabei wurden verschiedene Aufgaben gestellt, um das Verhalten der Nutzer zu beobachten und Erkenntnisse über mögliche Verbesserungen zu gewinnen. Die gewonnenen Erkenntnisse flossen direkt in den weiteren Designprozess ein. Die Tests waren Teil der formativen Evaluation.

Cognitive Walkthrough
Ein weiterer wichtiger Schritt war der Cognitive Walkthrough. Dabei wurde die App aus der Perspektive der Nutzer mit Schulterbeschwerden bewertet. Potenzielle Probleme, Schwierigkeiten und Risiken bei der Verwendung der App wurden identifiziert und Lösungen entwickelt, um die Benutzererfahrung zu optimieren. Besonderes Augenmerk lag darauf, dass die App als Medizinprodukt sicher zu verwenden ist. Der Cognitive Walkthrough war Teil der summativen Evaluation.
Style Guide & Design System:
Um die Konsistenz des Designs zu gewährleisten, wurde ein Style Guide und ein Design System entwickelt. Der Style Guide definierte einheitliche Designrichtlinien hinsichtlich Farben, Schriften, Icons und anderen visuellen Elementen. Das Design System umfasste eine Bibliothek von wiederverwendbaren UI-Komponenten, um eine effiziente Entwicklung neuer Features sicherzustellen und eine kohärente Benutzererfahrung zu gewährleisten.


Fazit
Die Entwicklung der App war ein herausforderndes und gleichzeitig äußerst spannendes UX-Design-Projekt. Durch den reibungslosen Übertrag des Projekts von Adobe XD zu Figma, die Fokussierung auf Interaction Design, die Erstellung detaillierter Wireframes und das ansprechende Screen Design wurde eine benutzerfreundliche App geschaffen. Die Durchführung von Usability Tests und Cognitive Walkthroughs gewährleistete, dass die App den Bedürfnissen der Zielgruppe optimal entsprach. Abschließend ermöglichten der Style Guide und das Design System eine konsistente und effiziente Weiterentwicklung der App.