Interaktionsdesignmuster
Interaktionsdesignmuster sind Entwurfsmuster, die im Kontext der Mensch-Computer-Interaktion angewendet werden und allgemeine Entwürfe für grafische Benutzerschnittstellen beschreiben.
Ein Entwurfsmuster ist eine formale Möglichkeit, eine Lösung für ein häufiges Entwurfsproblem zu dokumentieren. Die Idee wurde von dem Architekten Christopher Alexander zur Verwendung in der Stadtplanung und Gebäudearchitektur eingeführt und für verschiedene andere Disziplinen adaptiert, darunter Lehre und Pädagogik, Entwicklungsorganisation und -prozess sowie Softwarearchitektur und -design.[1]
Somit sind Interaktionsdesignmuster eine Möglichkeit, Lösungen für gängige Usability- oder Accessibility-Probleme in einem bestimmten Kontext zu beschreiben.[2] Sie dokumentieren Interaktionsmodelle, die es den Benutzern erleichtern, eine Schnittstelle zu verstehen und ihre Aufgaben zu erfüllen.[3]
Geschichte
BearbeitenEntwurfsmuster entstanden als ein architektonisches Konzept von Christopher Alexander. Solche Muster sind Möglichkeiten, bewährte Praktiken zu beschreiben, gute Entwürfe zu erklären und Erfahrungen zu erfassen, damit andere Menschen diese Lösungen wiederverwenden können.
Entwurfsmuster in der Informatik werden von Softwareingenieuren während des eigentlichen Entwurfsprozesses und bei der Kommunikation von Entwürfen mit anderen verwendet. Design Patterns haben in der Informatik an Popularität gewonnen, nachdem das Buch Design Patterns: Elements of Reusable Object-Oriented Software veröffentlicht wurde. Seitdem ist eine Pattern-Gemeinschaft entstanden, die Muster für Problemdomänen einschließlich Architekturstile und objektorientierte Frameworks spezifiziert. Der Tagungsband „Pattern Languages of Programming Conference“ (jährlich, seit 1994) enthält viele Beispiele für domänenspezifische Muster.
Die Anwendung eines mustersprachlichen Ansatzes beim Interaktionsdesign wurde erstmals in Norman und Drapers Buch User Centered System Design (1986) vorgeschlagen. Die Apple Computer’s Macintosh Human Interface Guidelines zitieren in ihrer empfohlenen Lektüre auch Christopher Alexanders Werke.
Bibliotheken
BearbeitenAlexander stellte sich eine Mustersprache als ein strukturiertes System vor, in dem die semantischen Beziehungen zwischen den Mustern ein Ganzes bilden, das größer ist als die Summe seiner Teile, ähnlich wie grammatikalische Beziehungen zwischen Wörtern Sprache sinnvoll machen.[4] Während einige Sammlungen von Mustern versuchen, die strukturellen Beziehungen zu schaffen, die zur Bildung einer Sprache erforderlich sind, sind viele andere einfach eine Ansammlung von Mustern (und werden daher passender als Musterbibliotheken bezeichnet).
Bibliotheken für mobile Interaktionsmuster
BearbeitenDie Beliebtheit mobiler Geräte wie Smartphones und Tablets macht eine Bibliothek mit Entwurfsmustern für mobile Interaktionen erforderlich.
Dieses Bedürfnis wird angetrieben von:
- Unterschiede im Benutzerverhalten und in der Interaktion auf mobilen Geräten wie Streich- und Tippgesten, vis-a-vis Interaktion auf einer Desktop-GUI, die mausgesteuert ist
- Unterschiede in den physikalischen Eigenschaften zwischen einem Mobil- und einem Desktop-Gerät, z. B. Bildschirmgröße, Touchscreen etc.
- Design-Richtlinien, die von mobilen Betriebssystemen empfohlen werden, z. B. iOS, Android
Elemente
BearbeitenDamit Muster für die Designer und Entwickler, die sie verwenden werden, hilfreich sind, müssen sie auffindbar und lesbar sein.[5][6][7]
Gemeinsame Elemente
BearbeitenObwohl die Musterbeschreibungen etwas variieren, enthalten viele Musterbibliotheken einige gemeinsame Elemente:
- Name des Musters: Die Wahl eines klaren und beschreibenden Namens hilft beim Auffinden des Musters und fördert die klare Kommunikation zwischen den Teammitgliedern während der Designdiskussionen.
- Beschreibung des Musters: Da kurze Namen wie „Ein-Fenster-Drilldown“ manchmal nicht ausreichen, um das Muster zu beschreiben, helfen ein paar zusätzliche Erklärungszeilen (oder ein kanonischer Screenshot), die Funktionsweise des Musters zu erklären.
- Problemdarstellung: In benutzerzentrierter Sprache geschrieben, wird dem Endbenutzer mitgeteilt, was der Benutzer erreichen will oder was die Herausforderung für ihn ist.
- Wann verwenden: Der „Nutzungskontext“ ist eine kritische Komponente des Entwurfsmusters. Dieses Element hilft, Situationen zu verstehen, in denen das Entwurfsmuster zutrifft (und in denen es nicht zutrifft).
- Lösung: Die Lösung sollte erklären, „wie“ das Problem zu lösen ist, und kann präskriptive Checklisten, Screenshots oder sogar kurze Videos enthalten, die das Muster in Aktion zeigen.
- Begründung: Durch die Angabe von Gründen, „warum“ das Muster funktioniert, wird die Lösung untermauert, auch wenn Entwickler, die unter Zeitdruck stehen, es vielleicht vorziehen, diese Erklärung zu ignorieren.
- Beispiele: Jedes Beispiel zeigt, wie das Muster erfolgreich angewendet wurde. Dies wird oft von einem Screenshot und einer kurzen Beschreibung begleitet.
- Anmerkungen: Ein Platz für die Teammitglieder, an dem sie die Anwendung des Musters diskutieren können, trägt dazu bei, eine aktive Ressource zu erhalten, und hält das Team beschäftigt.
Optionale Elemente
BearbeitenMusterbibliotheken können auch optionale Elemente enthalten, je nach den Bedürfnissen des Teams, das sie verwendet. Dazu können gehören:
- Implementierungsspezifikationen: Ein Styleguide mit detaillierten Informationen zu Schriftgrößen, Pixelabmessungen, Farben und Formulierungen für Nachrichten und Etiketten kann für Entwickler hilfreich sein.
- Usability-Forschung: Jede unterstützende Forschung aus Usability-Tests oder anderes Benutzer-Feedback sollte erfasst werden. Dies kann auch Feedback von Entwicklern, dem Kundendienst oder dem Verkaufsteam umfassen.
- Verwandte Muster: Die Musterbibliothek kann ähnliche Muster enthalten, oder sie kann in einer Hierarchie von Eltern- und Kindmustern organisiert sein.
- Ähnliche Ansätze: Da es wahrscheinlich viele mögliche Lösungen für dieses Problem gibt, wünschen sich die Teams vielleicht einen Ort, um ähnliche Alternativen zu erfassen.
- Quellcode: Wenn der Code modular genug ist, um wiederverwendet zu werden, dann kann er auch in die Bibliothek aufgenommen werden.
Vorteile von Design Patterns
BearbeitenZu den Vorteilen der Verwendung von Interaktionsdesignmustern gehören:
- Unterrichtung von Neulingen über einige bewährte Praktiken und gemeinsame Ansätze
- Erfassung der kollektiven Weisheit von Konstrukteuren über viele Anwendungen und Szenarien
- Den Teams eine gemeinsame Sprache geben, Missverständnisse, die sich aus dem unterschiedlichen Vokabular ergeben, reduzieren
- Reduzierung von Zeit und Kosten im Design- und Entwicklungs-Lebenszyklus
- Brauchbare Entwürfe zum „Weg des geringsten Widerstands“ machen
- Verschwendete Zeit, die damit verbracht wurde, „das Rad neu zu erfinden“, zu eliminieren
- Sicherstellen einer konsistenten und vorhersehbaren Erfahrung der Benutzer innerhalb einer Anwendung oder eines Dienstes
Vorteile gegenüber Gestaltungsrichtlinien
BearbeitenRichtlinien sind im Allgemeinen nützlicher für die Beschreibung von Anforderungen, während Muster nützliche Werkzeuge für diejenigen sind, die Anforderungen in spezifische Softwarelösungen umsetzen müssen. Einige Leute betrachten Designrichtlinien als eine Instanz von Interaktionsdesignmustern, da sie auch ein üblicher Ansatz sind, um die Erfahrungen beim Interaktionsdesign zu erfassen. Allerdings haben Interaktionsdesignmuster in der Regel die folgenden Vorteile gegenüber Designrichtlinien:
- Abstrakte Richtlinien, wie die Acht Goldenen Regeln des Interfacedesigns von Shneiderman, geben keine Hinweise darauf, wie ein Problem wie viele Interaktionsdesignmuster gelöst werden kann, und können nicht für die interdisziplinäre Kommunikation verwendet werden. Darüber hinaus bieten Richtlinien keine Erklärung dafür, warum eine bestimmte Lösung funktioniert.
- Konkrete Richtlinien, wie die Macintosh Human Interface Guidelines, sind zu sehr auf eine bestimmte Schnittstelle zugeschnitten und daher nicht so effektiv, wenn sie auf andere Schnittstellen (insbesondere Nicht-Macintosh-Schnittstellen) angewendet werden.
- Andere Probleme mit Richtlinien sind, dass sie tendenziell zu zahlreich sind, was es für Designer schwierig macht, die richtigen Richtlinien anzuwenden. Außerdem nehmen Richtlinien eine absolute Gültigkeit an, während sie normalerweise nur in einem bestimmten Kontext angewendet werden können. Daraus ergibt sich auch, dass Richtlinien oft zu Konflikten neigen, nur weil sie einen Kontext nicht beschreiben.
Richtlinien und Muster sind nicht unbedingt widersprüchlich, und beide können in Verbindung miteinander verwendet werden, um das Problem zu identifizieren und dann eine gültige Lösung zu finden.
Siehe auch
BearbeitenWeiterführende Literatur
Bearbeiten- Jan Borchers: A Pattern Approach to Interaction Design.
- Ian Graham: A Pattern Language for Web Usability.
- Andreas Prinz: Interaction Design Patterns für NFC-basierte Electronic Data Capture Anwendungen. Prinz Publishing, Dieburg 2014.
- Douglas K. van Duyne, James A. Landay, Jason I. Hong: The Design of Sites: Patterns for Creating Winning Websites. 2. Auflage.
- Jenifer Tidwell: Designing Interfaces: Patterns for Effective Interaction Design.
- Christian Crumlish, Erin Malone: Designing Social Interfaces: Principles, Patterns, & Practices for Improving the User Experience.
- Kamran Sedig, Paul Parsons: Interaction Design for Complex Cognitive Activities with Visual Representations: A Pattern-Based Approach. In: AIS Transactions on Human-Computer Interaction. Band 5, Nr. 2, S. 84–133. (aisel.aisnet.org)
Weblinks
Bearbeiten- 10 Great Sites for UI Design Patterns at Interaction Design foundation
- Yahoo Design Pattern Library
Einzelnachweise
Bearbeiten- ↑ James Coplien: A Pattern Definition. Bell Laboratories. Archiviert vom Original am 9. Februar 2007. Abgerufen am 24. November 2008.
- ↑ What's a Pattern? Yahoo!. Abgerufen am 24. November 2008.
- ↑ Jennifer Tidwell: Common Ground: A Pattern Language for Human-Computer Interface Design. MIT. Abgerufen am 24. November 2008.
- ↑ Lyn Pemberton: Genre as a Structuring Concept for Interaction Design Pattern Languages. University of Brighton. Abgerufen am 24. November 2008.
- ↑ Jared Spool: The Elements of a Design Pattern. User Interface Engineering. Abgerufen am 24. November 2008.
- ↑ Erin Malone: Implementing a Pattern Library in the Real World: A Yahoo! Case Study. Boxes and Arrows. (boxesandarrows.com)
- ↑ Tibor Kunert: User-Centered Interaction Design Patterns for Interactive Digital Television Applications. Springer, 2009, ISBN 978-1-84882-274-0.