Case Study 02Gesundheitswesen
Diagnose-Interface für medizinisches Fachpersonal
Patientendaten und Untersuchungsergebnisse so strukturiert, dass Fachpersonal schnell findet, was es braucht.
- Kunde
- Medizintechnik-Startup
- Zeitraum
- 2023 – 2024
- Rolle
- UI/UX Designer
- Plattform
- Medizinische Anwendung
- Werkzeuge
- Sketch, Figma
01 Ausgangslage
Medizinisches Fachpersonal braucht bei Untersuchungen schnellen, verlässlichen Zugriff auf Patientendaten und Ergebnisse. Viel komplexe Information – die klar, gut lesbar und ohne Umwege erreichbar sein muss.
02 Erkenntnisse
- Erkenntnis 01
Fachpersonal vergleicht mehr, als es sucht
Ein Befund ergibt oft erst im Vergleich Sinn – mit Vergleichswerten oder der letzten Untersuchung.
- Erkenntnis 02
Verwechslungen müssen ausgeschlossen sein
Wo zusammengehörige Messungen nebeneinander stehen, ist jede Unklarheit über die Zuordnung ein Risiko.
- Erkenntnis 03
Aufmerksamkeit gehört dem Patienten
Die Feedbackrunden zeigten: Jedes überflüssige Element lenkt ab. Gesucht war Ruhe, nicht Funktionsfülle.
03 Entscheidungen
- 1← Aus Erkenntnis 02
Feste Positionen für zusammengehörige Werte
Vergleichbare Messungen stehen immer an derselben Stelle, sind eindeutig beschriftet und farblich unterscheidbar.
- 2← Aus Erkenntnis 01
Vergleich als Standardansicht
Ergebnisse erscheinen direkt neben dem Vorbefund, Veränderungen werden hervorgehoben statt versteckt.
- 3← Aus Erkenntnis 03
Farbe nur für Befunde
Eine ruhige, neutrale Oberfläche. Farbe ist für Auffälligkeiten reserviert – und ein eigenes Icon-Set macht Untersuchungsarten auf einen Blick erkennbar.
04 User Flow
Eine Untersuchung dokumentieren
- 01Patient suchen
- 02Akte öffnen
- 03Ergebnisse erfassen◇ Vorbefund vorhanden?Seite an Seite vergleichen ↩
- 04Befund markieren
- 05Speichern
05 Wireframes
↔ Zum Scrollen ziehen
Vereinfachte, verallgemeinerte Darstellung – keine Original-Screens, Daten oder Kundeninhalte.
06 Design-System
Vereinfachte, verallgemeinerte Darstellung – keine Original-Screens, Daten oder Kundeninhalte.
Farben
- petrol-900#0F3B39Navigation, Primäraktion
- mint-300#7FE3C8Fokus, Auswahl
- surface-50#F4FAF8Flächen
- ink-900#10201FText
- finding-check#C98A00Kontrolle empfohlen
- finding-alert#C8372DAuffälliger Befund
Typografie
- Display · 30/36 · 700Befund
- Title · 22/28 · 600Messwert
- Body · 17/26 · 400Letzte Untersuchung vor 6 Monaten
- Data · 15/20 · 50016,0 · 14,0
Abstände
- 4
- 8
- 16
- 24
- 32
- 48
Radius
Komponenten
MESSWERT · B
Vorbefund: 17 · +4
Größere Grundschrift (17 px) und Kontraste nach WCAG AA für den Praxisalltag.
07 Vorgehen
- 1
Information ordnen
Komplexe Daten so strukturiert, dass der Zugriff schnell und verständlich bleibt.
- 2
Abläufe für Fachpersonal
Benutzerfreundliche Abläufe, die sich am Arbeitsalltag von medizinischem Fachpersonal orientieren.
- 3
Lesbarkeit & Accessibility
Kontraste, Typografie und Hierarchie mit Blick auf Accessibility und gute Lesbarkeit.
- 4
Testen mit Anwendern
Feedbackrunden mit medizinischen Anwendern durchgeführt und ausgewertet – vom Wireframe bis zum Prototyp.
08 Lieferumfang
- Wireframes, Mockups & Prototypen
- Interfaces für Patientendaten und Ergebnisse
- Icons und UI-Elemente für medizinische Anwendungsfälle
- Ausgewertete Feedbackrunden
Mehr zeige ich gern persönlich.
Kundenname und Original-Screens dieses Projekts teile ich nicht öffentlich. Im Gespräch führe ich dich gern durch Entwürfe, Prototypen und Entscheidungen.