Erklärung Eine Snackbar ist ein UI Pattern, das genutzt wird, um den Benutzer einer Webanwendung über einen gerade ablaufenden oder abgeschlossenen Prozess zu informieren. Dies geschieht in Form einer kurzen Meldung, die meist vorübergehend am oberen oder unteren Bildschirmrand erscheint. Snackbars sollten so gestaltet sein, dass sie die Benutzerfreundlichkeit nicht beeinträchtigen und ohne die Interaktion […]
Erklärung Ein Design System ist in der Regel eine Kombination aus (Living) Style Guides, Component Libraries und allgemein gefassten Richtlinien – bspw. zur Tonalität von Inhalten oder zur Verwendung von Komponenten. Es dient im Idealfall als »Single Source of Truth«, um das Design verschiedener Plattformen und Channels (z. B. Web, Print, App) möglichst zentral zu […]
Erklärung Ein Pop-Over wird auf einer Webseite dazu genutzt, um zusätzliche Inhalte anzuzeigen. Diese Inhalte sind zwar nicht wichtig genug, um von vornherein auf der Webseite dargestellt zu werden, können aber zu einem verbesserten Benutzererlebnis beitragen. Ein Pop-Over tritt in der Regel erst nach einer Aktion des Benutzers auf, wenn z. B. ein bestimmtes Element […]
Erklärung »Inclusive Design« bezeichnet den Ansatz, im gesamten Designprozess die Bedürfnisse unterschiedlichster Personen zu berücksichtigen. In Web Design Projekten wird dabei von Beginn an der Fokus auf alle Menschen gerichtet. Es geht darum Barrieren zu erkennen, aus der Vielfalt der Menschen zu lernen und durch diese Erkenntnisse ein Design zu entwickeln, von denen alle profitieren können. […]
Erklärung Sog. »Responsive Patterns« sind erprobte und bewährte Lösungen für oft wiederkehrende Problemstellungen im Responsive Web Design (RWD). Bei diesen Lösungen steht die optimale Darstellung auf unterschiedlichen Ausgabegeräten und Displaygrößen im Vordergrund. Einige Beispiele: Priority+ Navigation: Je nach verfügbarem Platz zeigt die horizontale Navigation nur so viele Elemente, wie auf den Bildschirm passen. Die restlichen […]
Erklärung UI Patterns sind erprobte und bewährte Lösungen für oft wiederkehrende Problemstellungen im User Interface (UI) Design. Das betrifft sowohl Layout-Anforderungen für ganze Seiten als auch einzelne Komponenten. Einige Beispiele für Komponenten sind: Accordions = Problem: Wie stellt man Inhalte bereit, die nur optional von Interesse sind, z. B. bei FAQ? Breadcrumbs = Problem: Wie weiß […]
Erklärung »Dark Patterns» sind Vorgehensweisen (deshalb Muster = pattern), mit denen unlautere Ziele erreichen werden sollen. Diese laufen in der Regel den eigentlichen Absichten derjenigen zuwider, die mit »dunklen Mustern« attackiert werden. Im Bereich des Web Design trifft das vor allem auf zwei Anwendungsbereiche zu: Besucher von Webseiten sollen dort eine Aktion auslösen, die sie gar […]
Erklärung IxD (Abkürzung für Interaction Design) ist das Gestalten der Interaktion zwischen Anwendern und Geräten. Dabei stehen die spezifischen Schnittstellen im Vordergrund, beispielsweise ein Handy-Display oder ein Computerbildschirm. Das Erreichen eines Ziels soll möglichst selbsterklärend, fehlerfrei und angenehm möglich sein. In der Regel wird Interaction Design als eine Teilmenge der UX (User Experience) betrachtet, bei […]
Erklärung Von Faden (engl. verblassen) spricht man im Web Design, wenn Elemente von einem Zustand in den anderen übergehen – »überblenden«. Der Übergang von dem einen in den anderen Zustand ist beim Faden nicht schlagartig sondern an eine Zeitkomponente gekoppelt. »Fade-In« oder »Fade-Out« beschriebt dabei im speziellen den Übergang vom unsichtbaren in den sichtbaren Zustand, bzw. […]
Erklärung Im Unterschied zu einem konventionellen Styleguide legt ein Living Styleguide (LSD) vor allem das Erscheinungsbild und Verhalten einer Website oder Applikation fest. Typografische und gestalterische Vorgaben werden in Komponenten unterschiedlicher Komplexität umgesetzt. Ein Living Styleguide ist im Prinzip eine Website, so dass die in ihm festgehaltenen Vorgaben ohne Verluste im Ausgabemedium Browser überprüft werden […]
Erklärung Das sog. Card-Element ist eine häufig benutzte Komponente im User Interface-Design (UI Design) – insbesondere im responsive Design. Das Card-Element dient als anklickbarer Einstiegspunkt zu ausführlicheren Informationen. Die Card enthält in der Regel verschiedene Elemente wie Bild, Überschrift und Teaser. Card-Elemente sind sowohl in der Anordnung ihrer eigenen Bestandteile als auch in der Anordnung in Gruppen […]
Erklärung MUI steht für »Multilingual User Interface« und bedeutet, dass eine Benutzeroberfläche, die Möglichkeit bietet in verschiedenen Sprachen genutzt zu werden. Im Regelfall bietet ein MUI jegliche Beschriftung von Bedienelementen, Hilfetexte etc. in mehreren Sprachen an. Zwischen diesen kann über eine Schaltfläche oder eine Menü gewechselt werden.
Unsere Agentur in Berlin realisiert vom durchgestylten One-Pager bis zur funktionalen Konzern-Website Projekte mit sehr unterschiedlichem Umfang. Wir haben u.a. mit folgenden Kunden erfolgreich zusammengearbeitet: