In diesem Artikel:
Im folgenden Abschnitt lernst du, wie du Icons findest, sie deinem Projekt hinzufügst und ihre Größe und ihren Stil formatierst. Du lernst auch, wie du sie auf der Seite gruppierst und mithilfe des Gliederungs-Panels schnell und effektiv organisierst.
Icons spielen eine wesentliche Rolle dabei, Benutzern die Navigation in einer Benutzeroberfläche zu erleichtern. Wenn du neu im Design bist, ist der einfachste Weg, ihre einzigartige Rolle und ihren Zweck zu verstehen, sich das Leitsystem eines internationalen Flughafens vorzustellen.
Die Ikonografie des Flughafens muss universell, inklusiv und sprachunabhängig sein. Reisende müssen auf einen Blick erkennen können, wo sie für Gepäck, Informationen, Essen, Toiletten, Zoll, Ankünfte, Abflüge, Taxis, Busse und so weiter hingehen sollen.
Daher müssen die Icons nicht nur klar und eindeutig sein, sondern auch zur selben „Familie" und zum selben Stil gehören – damit du sofort weißt, dass du es mit der offiziellen Beschilderung des Flughafens zu tun hast. Sie müssen eine eigene grafische Sprache haben, weshalb sie normalerweise in Stilgruppen angewendet werden.
Die Flughafenikonografie ermöglicht es Zehntausenden von Nutzern, gleichzeitig die komplizierte Architektur von Flughäfen zu navigieren, Chaos und Verwirrung zu minimieren und pünktlich zu ihren Flügen zu gelangen.
Ebenso ermöglichen die Icons in deiner UI Millionen von Benutzern eine nahtlose Navigation mit einfachen, schnellen und klaren Wegweisern.
Aufgrund der grundlegenden Bedeutung und des Nutzens von Icons haben sie einen eigenen, dedizierten Tab.
Um die Symbolbibliothek zu finden, gehe zur Linken Seitenleiste und klicke auf den Icons-Tab. Der Tab wird blau und öffnet das Icons-Panel.
![]()
Unsere Symbolbibliothek enthält zahlreiche Icon-Kits: Material Design, Font Awesome, Bootstrap, Feather, Hawcons, Amazon AWS, Azure Services, Kubernetes, Google Cloud, Cisco, RPG Awesome und Emoji. Und viele dieser Sets bieten verschiedene Themes; unser Material Design-Paket enthält beispielsweise jetzt die Varianten Filled, Outlined, Rounded, Sharp, Two-Tone und Community.
Icons können wie alle anderen Objekte angepasst und gestaltet werden – aber die Arbeit mit Icons unterscheidet sich in zwei wesentlichen Punkten:
Beide Themen werden wir in den folgenden Artikeln dieses Abschnitts behandeln.