Das unentbehrliche Tool des digitalen Zeitalters – Pattern Libraries
Lesezeit: 5 Minuten
Ein brandaktueller Trend in der digitalen Welt: Unterschiedliche Formen, leichte Bedienbarkeit, wiederverwendbare Content-Elemente all das und vieles mehr, ist seit Anfang des Jahres als Pattern Library bekannt.
Besuche uns auf LinkedIn.
Du willst keine Neuigkeiten verpassen? Folge uns doch einfach auf LinkedIn!
LinkedIn ProfilAnmeldung zu dem medani-Newsletter
Was sind Pattern Libraries?
Pattern Libraries sind für Designer ein nützliches Werkzeug, welches seit einiger Zeit voll im Trend liegt. Pattern Libraries gibt es in unterschiedlichen Formen. Wenn es WordPress Webseiten betrifft, sind es Sammlungen wiederverwendbarer Content-Elemente, die im Branding der jeweiligen Webseite designt und umgesetzt sind, und sich responsive optimal an die nötigen Screengrößen adaptieren. Inhalte von Pattern Libraries können sein: Buttons, Header, Slider, Teaser, Buttons, Kontaktabschnitte, Trust-Elemente. Auch Animationen sind oft in den Libraries verankert.
Kurz und generell gesagt kann ein Pattern vieles sein, was ein Nutzer auf der Webseite wahrnehmen kann und sein definiertes Verhalten auf verschiedenen Endgeräten. Sowohl kleine als auch komplexere Gebilde, sind möglich beispielsweise die Menüleiste, bei der sich Schrift, Größe und Abstände zwischen einzelnen Elementen automatisch anpassen. Die Libraries enthalten bestimmte Richtlinien wie sich UI-Elemente im Zusammenspiel mit Inhalten verhalten sollen, um eine gute User Experience zu erschaffen. Meist sind die Musterbibliotheken mit Code-Snippets kombinierbar.
Der Detailreichtum von Pattern Libraries ist unterschiedlich zu definieren. Es gibt molekular aufgelöste, die kleinsten Einheiten von UI-Design Elementen auflösen, z.B. in das Suchfeld. Darin gibt es wiederum verschiedene molekular aufgebaute Elemente, wie zum Beispiel das Suchfeld-Label, der Suchfeld-Button, das Suchfeld-Button-Icon, etc. Diese Auflösung in kleinste Elemente nennt man Atomic Design.
Vorteile
Durch unsere langjährige Erfahrung im Webdesign wissen wir, wie Redakteure optimal mit CMS Systemen umgehen können: Kleinaufgelöste Elemente sind weniger leicht zu behandeln als bereichsartig definierte Elemente und ganzseitigen breite Streifen (Sections). Warum? Weil groß-aufgelöste Design-Sections schon die Platzierung der Elemente mitbringen, die Abstände zueinander und ihr Verhalten auf unterschiedlichen Endgeräten. Ein kleines Element wie ein Button für sich muss dagegen erst platziert werden, und in einem rundherum aus weiteren Elementen angeordnet werden. Mit einer zentralen Pattern Library, kann man in nur wenigen Stunden komplette Landingpages oder Seitenbereiche zusammenklicken.
Verschiedene Werkzeuge in WordPress bieten als Lösung deshalb das Speichern und Verwalten von Patterns als ganzseitige Design-Sections an.
Der große Vorteil von Pattern Libraries ist auch, dass einfache Bedienbarkeit kombiniert wird mit einem einheitlichen Design, auch für mehrere Webseiten eines Unternehmens. Pattern Libraries bieten ein konsistentes Nutzererlebnis und einen einheitlichen Look. Ein Unternehmen mit mehreren Unterseiten kann effizient und mit wenig Zeitaufwand zu einem signifikanten und identischen Ergebnis gelangen. Gerade sinnvoll sind Pattern Libraries bei Unternehmen mit Tochtergesellschaften oder Produktlinien, die ein ähnliches Branding widerspiegeln.
Tipp
Ein guter Tipp ist es, die einzelnen Pattern ihrer Funktion nach zu benennen. Zum Beispiel: Ein Pattern – Trust-Element – ist dafür da Vertrauen aufzubauen, ein anders um einen bestimmten Content anzuteasern oder ein anderes USPS aufzählen. Da sich das Design in den Jahren verändern wird, kann es individuell bearbeitet werden von Farben bis hin zu Bildern. Doch die Absicht hinter dem funktionalen Pattern bleibt bestehen. Ein Kontaktformular bleibt ein Kontaktformular.