Auf diese Weise helfen Musterbibliotheken, einzelne Elemente eines Entwurfs zu isolieren und gleichzeitig eine Plattform bereitzustellen, um den Überblick über alle Teile zu behalten. Dies ist entscheidend, um ein Design im Laufe der Zeit konsistent zu halten. Zum Beispiel: In einer Webanwendung ist eine Musterbibliothek eine Reihe von HTML-Elementen mit entsprechenden Stilen und Funktionen – eines davon kann ein Bestätigungsdialog sein, der beim Drücken der Schaltfläche “Weiter” geschlossen wird. Die Felder, die zum Definieren eines Musters erforderlich sind, sind die Felder Titel, Problem, Verwendung wann und Lösung. Andere Felder, die nicht ausgefüllt sind, werden nicht auf der Musterdetailseite angezeigt. Das Konzept einer Musterbibliothek ist einfach: Zerlegen Sie eine Schnittstelle in wiederverwendbare Bausteine, ordnen und gruppieren Sie sie, benennen Sie sie, erstellen Sie Regeln zwischen ihnen, generieren Sie einen Überblick über alle Komponenten und stellen Sie sie dem gesamten Team zum Erstellen und Entwerfen zur Verfügung. Die Vorteile sind greifbar und praktisch, einschließlich Konsistenz in Code und Design, ein gemeinsames Vokabular und eine bessere, effizientere Wartung. Ich konnte nicht viele Fallstudien finden, die ins Detail gehen, wie ein Unternehmen langfristig von einer Musterbibliothek profitiert hat, aber Airbnbs und Anna Debenhams Forschungen (siehe Folien 49 bis 69) sind lehrreich. Tradeshift UI ist eine Framework-agnostische JavaScript-Bibliothek und Sammlung von Designprinzipien, um App-Entwicklern zu helfen, kohäsive Benutzeroberflächen zu erstellen und wiederverwendbare UI-Komponenten bereitzustellen. Inspirierte Benutzeroberfläche verfügt über ein detailliertes Filtersystem mit Dutzenden von verfügbaren Kategorien – es wird für UX-Profis nicht schwierig sein, ein benötigtes Muster zu finden.

Damit Komponenten in Musterbibliotheken einem wichtigen Zweck dienen, ist es wichtig, dass jede Komponente mit einem Titel und einer Beschreibung versehen wird. Dies wird helfen zu verstehen, was die Komponente ist und was sie tut. Wir haben Anreize für das Management definiert. Wir fanden heraus, dass der beste Anreiz für das Buy-In des Managements darin bestand, die Projektziele mit den erklärten Geschäftszielen in Einklang zu bringen. So konnten wir beispielsweise dafür plädiensen, dass eine größere Konsistenz im gesamten Netzwerk die Anzahl der Rücksendebesucher und die durchschnittliche Anzahl der pro Sitzung verwendeten Produkte erhöhen würde. Wir haben dem Chief Product Officer auch gezeigt, wie er und seine Mitarbeiter die Bibliothek nutzen können, wenn sie wichtige Produkte vor der Veröffentlichung überprüfen. Zweitens werden sie nicht notwendigerweise einander zugeordnet. Beispielsweise erfordert ein Muster für die Menüelementreihenfolge möglicherweise keinen entsprechenden visuellen Standard, und es kann ein Dutzend visueller Standards für Typografie geben, die keinem Interaktionsentwurfsmuster zugeordnet sind.

An dieser Stelle sollten Sie darüber diskutieren, wie neue Muster hinzugefügt und wie sie vom Team gepflegt werden. Richten Sie eine Verbindung zur Musterbibliothek ein und machen Sie sie überall in Ihrer Organisation zugänglich – sei es im CMS, in der Kundensupportdokumentation oder im Wasserkühler. Irgendwann können Sie die Bibliothek sogar um visuellen Kontext, Tags und die Personen erweitern, die für bestimmte Komponentenfamilien verantwortlich sind. Sowohl “Wichtigkeit der Einhaltung” als auch “Beweiskraft” wurden den Standards des National Cancer Institute entlehnt und usability.gov/guidelines/index.html zur Verfügung gestellt. Wir haben uns auf “Wichtigkeit der Einhaltung” als einziges Rating festgelegt. Sein Zweck ist es zu beschreiben, wie wichtig es für einen Designer ist, sich an das Muster zu halten, wenn Yahoo! Produkte entworfen werden. In gewisser Weise wird beschrieben, “wie wichtig ist dieses Verhalten für die Marke Yahoo!?” Origami ist eine Gruppe von Dienstleistungen, Modulen und Tools, die beim Erstellen von Websites für die Financial Times helfen. Peer-Erkennung. Derzeit erwägen wir, Funktionen hinzuzufügen, damit Benutzer der Bibliothek die Nützlichkeit jedes Musters bewerten können.