kv.digital
UX und UI Design mit System für das Gesundheitswesen
Die Aufgabe:
Unterstützung der Produktteams der kv.digital bei der UX- und UI-Designentwicklung der offiziellen digitalen Anwendungen der Kassenärztlichen Bundesvereinigung. Weiterentwicklung der nativen 116117-App und Neuentwicklung der zentralen Webanwendung der Terminservicestellen zur Vermittlung von Facharzt- und Psychotherapeuten-Terminen.
Die Lösung:
Gemeinsam mit dem Team der kv.digital Fortsetzung einer Systematisierung des Designs in Form eines modularen Designsystems. Festlegung übergreifender Standards und Aufbau eines gemeinsamen Komponentenbaukastens als Basis für die digitalen Produkte rund um die Terminvermittlung.
Die einzelnen Produktteams bedienen sich im zentralen Designsystem, das übergreifende Standards festlegt. Darüber hinaus existieren produktspezifische Komponenten, um die individuellen Bedürfnisse der einzelnen Produktteams zu berücksichtigen.
Was ist ein Designsystem?
Ein Designsystem zeichnet sich durch eine Sammlung wiederverwendbarer Komponenten aus, die sich an klaren Standards orientieren und zu einer beliebigen Anzahl von Anwendungen zusammengestellt werden können. Diese Komponentenbibliothek wird auch Pattern Library genannt und ist oftmals nach Atomic Design-Methodik aufgebaut.
Wie die Komponenten genau einzusetzen sind, wird durch eine Dokumentation festgelegt, die gleichfalls zentraler Bestandteil eines Designsystems ist.
Die Vorteile:
- Ein systematischer Aufbau nach modularen Designprinzipien, macht ein Designsystem flexibel anpassbar. So lassen sich Designaktualisierungen automatisch auf bereits existierende Anwendungen ausrollen.
- Ein gemeinsames Baukastensystem für Designer und Entwickler sorgt für Konsistenz innerhalb einer Softwarelandschaft, die für die User Experience besonders relevant ist.
- Designsysteme helfen Unternehmen dabei, die Produktentwicklung zu beschleunigen, um so mehr Raum für Innovation in den Entwicklungsteams zu schaffen.
Ein modulares Komponentensystem für Design und Entwicklung
Die Grundbausteine des Designsystems, wie Buttons, Formular- und Dialogelemente sind Teil eines Komponentenbaukastens, der jeweils als Code- und als Designbibliothek vorliegt. Beide Bibliotheken entsprechen einander, so dass das Designteam nur mit Assets gestaltet, die auch als Code-Basis vorhanden sind. Dies bildet die Grundlage, um auf effiziente Weise konsistente und zugängliche Produkte zu gestalten.
Design-Token sind der neue Weg, um visuelle Grundlagen in den 116117-Produkten zu verankern. Token werden verwendet, um Farben, Höhen, Abstände und andere Stile innerhalb des Designsystems zu standardisieren.
„Designdoc“, das Designsystem der 116117 Produkte
Ein einprägsamer Name für ein Designsystem trägt dazu bei, effektiv darüber zu kommunizieren und die Akzeptanz im Team zu erhöhen. „Designdoc“ ist der Name des Designsystems der 116117 Produkte. Der Name wird in Dokumentationen, Präsentationen und Styleguides verwendet.
UI-Illustrationen um das Nutzererleben zu steigern
Illustrationen sind Teil des Designsystems und werden gezielt im UI Design eingesetzt. Sie sorgen für eine emotionale Ansprache und sind dazu da, das positive Nutzererleben zu steigern. Dies kann zu mehr Verbundenheit mit der Anwendung, häufigere Nutzung und mehr Weiterempfehlungen führen.
Wir entwarfen verschiedene, individuelle Illustrationen, die auf dem bestehenden Corporate Design beruhen und Inhalte und Nutzerinteraktionen auf zugängliche Weise vermitteln.
Onboarding-Grafik zum Thema „Bereitschaftspraxen“
Onboarding-Grafik zum Thema „Ärztliche Versorgung finden“
Onboarding-Grafik zum Thema „Terminbuchung“
Illustration zum Einsatz auf Suchseiten
Animierte SVG-Illustration, die zum Einsatz kommt, wenn Wartungsarbeiten durchgeführt werden
Detailierte Illustration, die großflächig auf Anmelde-Seiten für Fachkräfte eingesetzt wird
Das Designsystem in der Praxis
Das Interfacedesign für die zentrale Anwendung der Terminservicestellen zur Terminvermittlung richtet sich an medizinisches Fachpersonal. Sie wollen administrative Aufgaben einfach und schnell erledigen. Die Nutzenden arbeiten oft täglich mit der Software.
Deshalb ist die Benutzeroberfläche vollgepackt mit Informationen und enthält eine gut durchdachte Kombination aus Struktur, Hierarchie und Farbe, die bei der Navigation durch das Produkt hilft. Eine klare und aufgeräumte Designsprache sorgt dabei für den notwendigen Spielraum, viele Informationen unterzubringen ohne zu überfordern.
Als Teil des Teams der kv.digital arbeiteten wir an den nativen 116117-Apps, die sich an Patienten und Patientinnen richten. Dabei haben wir dazu beitragen können, das bestehende Interface-Design auf das neue Designsystem umzustellen. Zusätzlich sind neue Illustrationen entstanden, die rund um den Terminbuchungsprozess eingesetzt werden. Bei allen Maßnahmen steht die Zielgruppe im Fokus: sie interagiert mit der Anwendung aus einer Notwendigkeit heraus und befindet sich möglicherweise in einem Zustand von Stress und Dringlichkeit. Übergreifendes Ziel ist deshalb eine übersichtliche Gestaltung mit klaren Nutzerwegen, um die Anwendung zugänglich und leicht nutzbar zu gestalten.
Die Entwicklung der 116117-Produkte befindet sich in einem kontinuierlichen Weiterentwicklungsprozess. Anforderungen kommen aus dem Gesundheitswesen, den Produktteams und natürlich von den Nutzenden selbst. Ein zentralisiertes Designsystem hilft, auf dieses dynamische Umfeld reagieren zu können und die digitalen Produkte permanent zu optimieren.
Kunde
kv.digital (ein Tochterunternehmen der Kassenärztlichen Bundesvereinigung)
Unsere Leistungen
UX & UI DesignUX WritingResponsive DesignIllustration & IcondesignDesignsysteme
Projektlaufzeit
2022–heute
