User Interface Design
Die Qualität eines User Interface beruht auf einem möglichst einfachen und dem Workflow des Anwenders angemessenen Bedienkonzept (Effektivität). Kommen ansprechendes visuelles Design (Emotion) und natürliche Interaktionsweise (Effizienz) hinzu, dann entsteht selbst bei komplexen Produkten ein außergewöhnliches Nutzungserlebnis.
Bedienkonzept
Das Bedienkonzept bildet den Eckpfeiler eines jeden User Interface und umfasst die Informationsarchitektur und das Navigationskonzept des betreffenden Programms. Ziel ist es, den Workflow des Benutzers optimal zu unterstützen - ausreichende Kenntnisse der Nutzeranforderungen vorausgesetzt.
Angefangen bei der Definition der Hauptkomponenten des Systems und dem Gesamt-Layout werden zunächst verschiedene View- bzw. Fenstertypen entsprechend ihrer Priorität Funktionalitäten zugeordnet. Im Anschluss wird konsequent von Widget-Ebene hin auf Toolbar- und Buttonebene verfeinert.
Um potentielle Showstopper identifizieren zu können, müssen technische Einschränkungen von Anfang an thematisiert werden.
 |
InteraktionUnabhängig von der Technologie, ob Desktop- oder Multi-Touch-Applikation, entscheidet heute zunehmend die Detail-Interaktion über den Erfolg eines Produkts. Insbesondere neuartige und animierte Kontrollelemente erweitern die Benutzerfreundlichkeit sinnvoll hinsichtlich des Aufforderungscharakters, der Interaktion selbst sowie des Systemfeedbacks. Dabei geht es um handfesten interaktionalen Mehrwert: Durch die rapide ansteigende Informationsdichte und kognitive Mehrbelastung wird die maximale Intuitivität eines Produktes verpflichtend. Letztendlich spiegelt sich diese Entwicklung auch in einer wachsenden Erwartungshaltung der Nutzer an moderne User Interfaces wieder. |
Visuelles Design
Das visuelle Design ist zumeist der Charakterzug eines Interface, welcher den ersten Eindruck entscheidend prägt. Durch ein stimmiges Look & Feel, prägnante Key Visuals sowie aussagekräftige Icons können Professionalität, Modernität, Wertigkeit, aber letztendlich auch Spaß kommuniziert werden. Die Gewichtung von Emotion gegenüber Effektivität und Effizienz ist jedoch stark kontextabhängig, z.B. bei Consumer Products.
Existieren Corporate Design-Richtlinien im Unternehmen, muss eine harmonische Angleichung geschehen, um die Markenidentität zu unterstreichen. Bei einem bereits vorhandenen Interaktionskonzept ist es auch möglich, nur die Erstellung eines Visual Design zu beauftragen.
Design-Prozess
Unser kontrollierter Iterationsprozess, bei dem eine Reihe von Checkpoints den Übergang zur nächsten Phase einleitet, stellt die Grundlage unseres Gestaltens dar. Der reine Design-Anteil - sowohl konzeptuell als auch visuell - zeichnet sich dabei durch folgende fünf Schwerpunkte aus:
Wir wollten einen Wow-Effekt mit unser Software erreichen, und wir haben ihn bekommen! Mehr noch, die Zusammenarbeit hat wirklich Spaß gemacht. Danke ERGOSIGN!
Alastair Green, Leica Geosystems
Wireframes
Die ersten Entwürfe konzentrieren sich primär auf das Layout und Fenstermodell. Dabei werden sämtliche visuellen Details wie Farben und Icons außen vor gelassen. Dies ermöglicht, zeiteffizient Alternativen zu entwickeln oder Varianten zu testen. In Workshops kann die Gestaltung auch direkt "papier-basiert" geschehen und die Diskussion über das Konzept zielführend an konkreten Beispielen stimuliert werden.
Erst nach einer prinzipiellen Einigung über das Interaktionskonzept mit allen Stakeholdern werden die Wireframes weiter zu konkreten Mock-ups ausgestaltet.
Mock-ups
Mock-ups stellen statische, jedoch sehr detaillierte Screenentwürfe dar. Aufbauend auf dem groben Raster der Wireframes liegt der Schwerpunkt hier auf der Exploration verschiedener visueller Ausprägungen und der Ausgestaltung von konkreten Bedienungsabläufen.
Nur so wird für alle Beteiligten schnell greif- und artikulierbar, wie die Applikation in Zukunft aussehen könnte und an welchen Gestaltungsmitteln überhaupt angesetzt werden kann. Nach der Konsolidierung des Designs kann in einem weiteren Schritt eine Umsetzung in der Zielsprache der späteren Entwicklung geschehen.
Iterationen
Iterationen im Gestaltungsprozess sind eine notwendige Voraussetzung, um die Erfüllung aller Anforderungen an das Interface zu gewährleisten. Folglich erarbeiten wir eine Lösung schrittweise vom Grobkonzept hin zur detaillierten Spezifikation in enger und regelmäßiger Abstimmung mit Ihnen.
Erfolgskritisch ist hierbei, dass Vertreter aller relevanten Stakeholergruppen in die Workshops involviert sind. Dies betrifft nicht nur die Produktmanager, sondern in besonderem Maße auch Entwicklungsvertreter. Nur so werden frühzeitig alle Erwartungen und gegebenenfalls (existenzielle) Beschränkungen transparent.
Vereinheitlichung
Eine Herausforderung stellt die (Um)gestaltung ganzer Applikationsfamilien dar, die über einen gewissen Zeitrahmen sukzessive gewachsen ist. Hier erstreckt sich die initiale Bestandsaufnahme über die gesamte Anwendungsbreite. Auf der Basis von ausgewählten Programmen wird ein umfassendes Konzept erstellt und schrittweise auf weitere Programme ausgedehnt bzw. validiert.
Besonders interessant ist eine Vereinheitlichung von User Interfaces, wenn hierbei auch Medienübergänge betroffen sind und beispielsweise Web-Applikationen in konsistenter Weise mit touch-basierten Smartphones harmonieren sollen.
Folgeschritte
Die Ergebnisse eines User Interface Design-Prozesses werden abschließend in Form eines Style Guide oder Design Manual dokumentiert. Die Dokumentation beinhaltet neben genauen Spezifikationen zu Interaktions- und visuellem Design auch ausgewählte, detailliert ausgearbeitete Screens.
Bei Bedarf können Kernszenarien auch prototypisch umgesetzt werden, zum einen, um optionale Nutzerevaluationen durchzuführen, zum anderen aber auch, um Input für die Entwicklungsphase zu liefern. Zusätzlich können wir für die meisten GUI-Technologien die Implementierung eines Custom Look & Feel übernehmen.
Anwendungskontext - Der Schlüssel zur Innovation
Die Usability eines interaktiven Systems kann nicht unabhängig von seinen Anwendungsbedingungen betrachtet werden. Im Gegenteil, der Anwendungskontext ist oft der Schlüssel zur Gestaltung eines außergewöhnlich ansprechenden und zugleich einfachen User Interface.
Jared M. Spool
