Icon Design im Jahr 2020: Die wichtigsten Trends
Symbole sind möglicherweise eines der wichtigsten - und unterschätzten - Designbeispiele in Ihrem Portfolio. Hier ist ein Blick auf das Icon-Design mit einigen inspirierenden Beispielen.
Icon-Elemente werden fast überall gezeigt, aber manchmal nachträglich produziert. Das sollte nicht der Fall sein. Tolles Icon-Design kann unverwechselbar sein und einem Projekt Finesse und Flair verleihen.
Werfen wir einen Blick darauf, was neu ist und was im Icon-Design im Jahr 2020 angesagt ist!
Entdecken Sie Envato-Elemente
1. Liniensymbole mit Farbformen
Dank eines vielseitigen Stils, der mit fast jedem anderen Designelement gut aussieht, sind Liniensymbole immer eine beliebte Wahl. Der Trend fügt nur ein wenig mehr visuelles Interesse hinzu, mit einem Farbtupfer, oft in Form eines Kreises oder Quadrats, hinter dem Liniensymbol.
Die Farbform füllt möglicherweise einen Teil des Liniensymboldesigns aus, schwebt jedoch häufig nur im Hintergrund. Dieses kleine visuelle Interesse kann ein Symbolset zusammenfügen, eine Markenfarbe hervorheben oder einfach eine ältere Site mit Liniensymbolen auffrischen.
Der schwierige Teil des Icon-Designs ist die Platzierung und Größe des Farbformelements. Wenn die Farbe zu groß oder zu hell ist, kann das Symbol entfernt werden. Wenn die Form zu klein ist, riskieren Sie, dass sie wie ein Fehler aussieht.
Obwohl es keine perfekte Größe gibt, behalten die meisten Symbole, die diesen Trend verwenden, die Farbform auf etwa ein Viertel der vollen Größe des Symbols bei.
2. Abstrakte Symbolformen
Sie sind sich nicht sicher, welches Symbol Ihren Inhalt darstellt? Eine abstrakte Symbolform könnte die Antwort sein.
Immer mehr Designer erstellen abstrakte Stilsymbole für die Verwendung auf verschiedenen Websites. Das Schöne an diesem Stil - und dem Trend im Allgemeinen - ist, dass abstrakte Stile ein Gefühl von Laune und Staunen erzeugen, das zu einigen der größeren allgemeinen Trends im Design passt.
Der Schlüssel zum Arbeiten mit abstrakten Formen besteht darin, sicherzustellen, dass Sie nicht versehentlich etwas replizieren und dass Symbole wirklich abstrakt sind. (Versuchen Sie nicht, Symbole zu erstellen, die Ihrem Logo ähneln. Sie sehen beispielsweise möglicherweise wie Fehler aus.) Verwenden Sie für Symbole und Markenmaterialien dieselbe Farbpalette, wenn sie wirklich übereinstimmen.
3. Primärfarben
Primärfarbpaletten sind eine mutige, helle und ansprechende Wahl für kleine Designelemente.
Dieser Symboldesign-Trend verwendet Rot, Blau, Grün und Gelb (zusammen mit Lila und Orange), um einen grundlegenden Satz von Farbregeln zu erstellen. Was diesen Stil zum Funktionieren bringt, ist ein Fokus auf Farbe, um die Aufmerksamkeit auf kleine Elemente auf dem Bildschirm zu lenken. Primärfarben heben sich auch von allen „Material“ -Helligkeiten ab, die in letzter Zeit die Paletten dominiert haben.
Machen Sie das Design mit Verläufen (oder Faux-Ombre-Verläufen wie im obigen Beispiel) weicher, damit die Farbpalette nicht zu elementar wirkt. Gehen Sie beim Arbeiten mit Primärfarben nicht über Bord. Sie können eine überwältigende Berührung sein. Betrachten Sie eine gedämpfte Primärpalette oder ein monochromatisches Schema.
4. Symbole mit Hintergrundsymbolen
Einige Trendsymbole haben eigene Symbole. Ernsthaft!
Für eine ausgefeiltere Verwendung von Symbolen - wir verwenden hier keine winzigen Favoriten - können Symbole gestapelt und überlagert werden, um mehr Kunstelemente zu erstellen.
Dieser Trend verwendet häufig Farben und Schattierungen, um zwischen dem Hauptfokussymbol und den Hintergrundsymbolen zu unterscheiden. Das primäre Symbol ist häufig farbig oder ein ausgefülltes Symbol. Die Hintergrundsymbole haben fast immer einen Linienstil und möglicherweise helle Farbpaletten.
Sie können diesen Effekt mit vielen vorgefertigten Symbolkits erzielen, indem Sie Symbole auf unterschiedliche Weise mischen und anpassen. Schaffen Sie Tiefe und visuelles Interesse mit Symbolen eines ähnlichen Themas und halten Sie sich an nur eine Handvoll Elemente, um zu verhindern, dass die Szene zu beschäftigt wird. Haben Sie keine Angst davor, Elemente zu verwenden und wiederzuverwenden, und verwenden Sie dieselben Symbole (abwechselnd und ausgefüllt) in Hintergründen und Vordergrund.
5. Zweifarbige Symbole
Ein weiterer Icon-Design-Trend, der auf beliebten Liniensymbolstilen aufbaut, besteht darin, zweifarbige Elemente zu erstellen.
Zweifarbige Symbole können auf Ihrer vorhandenen Farbpalette oder Markenfarbe aufbauen oder fast jedes andere Farbpaar kombinieren. Achten Sie beim Entwerfen mit dem Symboltrend auf Farbpaare, die sich von dem Hintergrund abheben, auf dem Sie sie verwenden möchten.
Wenn es um das Design geht, wählen Sie für den größten Teil des Symbols eine Primärfarbe. Verwenden Sie eine Sekundärfarbe, um ein Element des Symbols hervorzuheben. (Denken Sie daran, die Primärfarbe für 70% bis 80% des Designs und die Sekundärfarbe für den Rest zu verwenden.)
Dies schafft einen Akzent im Icon-Design, der das Auge auf das Designelement und hoffentlich auch auf den umgebenden Inhalt lenkt.
6. Symbol "Kurzschrift"
Wenn Sie in einem App Store stöbern, sehen Sie viele häufige Markierungen - Umschläge für E-Mail-Apps, Überprüfungen für Produktivitäts-Apps, Sperren für Sicherheits-Apps.
Diese Symbolkürzel bietet eine schnelle visuelle Meldung, die den Benutzern mitteilt, was die App tut. Dieselbe Abkürzung gilt fast überall für das gesamte Icon-Design. Während Designer mit Symbolen in ihrem eigenen Stil experimentieren, besteht die Tendenz, Symbole für eine bestimmte Bedeutung zu verwenden.
Und das ist gut so. Ein Symbol sollte auf einen Blick leicht zu sehen und zu verstehen sein. Ein Symbol soll Benutzern helfen, zu wissen, was sie tun sollen und wie sie mit dem Design interagieren sollen. Diese gebräuchliche Symbolkürzel ist eine schöne Weiterentwicklung, wie man genau das macht.
7. Helle Farbe
Helle Farbauswahl war in allen Aspekten des Designs eine große Sache. Bei Symbolen ist das nicht anders. Eine helle Farbe ist eine verlockende Möglichkeit, das Auge auf das Symbol zu lenken.
Farbe wird beim Icon-Design-Trend auf verschiedene Arten verwendet:
- Als Hintergrund mit einem weißen oder schwarzen Linienstil
- Für farbige Symbolelemente mit einem realistischeren Aussehen
- Für Symbolelemente mit einem flacheren, verlaufenden oder superhellen Design
Beliebte Farboptionen in der hellen Familie sind Gelb, Blau, Grün und Purpur. Diese Farben sind eher positiv und es ist beliebt, eine Farbpalette mit drei bis fünf Farbtönen für ein Symbolset zu erstellen.
Sie sind sich nicht sicher, wo Sie anfangen sollen? Die Materialpalette zeigt Farben, die einen großen Anteil am Trend des Farbsymboldesigns haben.
8. Symbole in Logos
Beachten Sie, wie viele Logos Symbole enthalten. Sobald Sie darüber nachdenken, wird es schwierig sein, nicht alle kleinen Symbole im Logo-Design zu sehen.
Das Schöne an einem Symbol in einem Logo ist, dass es mit dem Markennamen zusammenarbeitet und mit der Zeit und dem Markenwert für sich allein stehen kann. Denken Sie an das obige Beispiel Spotify. Obwohl der Musikanbieter nicht allzu lange da ist (im Rahmen von Marken), ist der Kreis mit drei Linien sehr gut erkennbar.
Das Symbol funktioniert in Farbe und ohne - ein Schlüssel eines starken Symbols - und kann einzeln oder mit Schriftzug stehen. Diese Vielseitigkeit macht es leicht zu erkennen, warum Symbole ein beliebtes Element im Logo-Design sind.
9. Kreise
Kreise sind eine der harmonischsten Formen. Und wenn es um Icon-Design geht, sind sie sehr beliebt. Von Symbolen, die in einer Kugel enthalten sind, bis zu Kreisen innerhalb von Objekten kann das Erstellen einer Designmarke mithilfe von Kreisen genau das richtige Gefühl für Benutzer erzeugen.
(Möchten Sie mehr über Kreise im Design erfahren? Das haben wir hier.)
Ein Teil des Einflusses von Kreisen auf das Icon-Design kann auf einige der von Google mit Material Design festgelegten Richtlinien zurückgehen. Alle diese runden Tasten eignen sich perfekt zum Tippen auf Mobiltelefone. Dieselbe Philosophie gilt auch für das Icon-Design. (Denken Sie nur daran, wie oft ein Symbol ein berührbares oder anklickbares Element ist.)
Der Teil, der ein kleiner Trick bei diesem Symboltrend sein kann, ist das Ineinandergreifen von Kreisen an allen Stellen, an denen andere Formen verwendet werden. App-Symbole sind in der Regel quadratisch. Social-Media-Profile sind kreisförmig (und quadratisch).
Stellen Sie beim Erstellen eines runden Symbols sicher, dass der Inhalt des Symboldesigns bei kleinen Größen leicht verständlich ist, da Sie es häufig verkleinern müssen, damit es an andere Stellen passt.
10. Design der Linienstil-Symbole
Linienstil-Symbole scheinen der Trend zu sein, der niemals alt wird.
Ein Grund dafür ist, dass dieser Symbolstil praktisch überall auf jedem Hintergrundtyp funktionieren kann. Viele der beliebten, herunterladbaren Icon-Packs enthalten aufgrund dieser Vielseitigkeit häufig ein Linienstil-Design.
Das obige Beispiel zeigt dies leicht. Jedes Symbol ist in praktisch jeder Größe leicht zu sehen und zu verstehen.
11. Einfache Elemente und Darstellungen
Wie bei den meisten anderen Designtrends im Jahr 2020 gehört auch die Einfachheit zum Icon-Design. Einfache Formen und Geografie bilden zusammen fast über vereinfachte Darstellungen für Symbole.
Das Ergebnis ist ein ziemlich kunstvolles Design, das die Benutzer aussehen lässt.
In dem obigen Beispiel mit Lebensmittelsymbolen verwendet jedes Symbol den gemeinsamen Faden eines Kreises im Symbol. Dies kann die Gesamtform des Symbols selbst oder ein Teil des Symboldesigns sein. Diese Form verbindet jedes Symbol im Projekt miteinander.
12. Symbole mit Verläufen
Der Farbverlauf mit Farbverläufen, der zu einem der dominierenden Themen des Jahres 2019 geworden ist, ist auch ein Faktor im Icon-Design. Von einfachen Verläufen in Linienstrichen (wie im obigen Beispiel) über vollständige Farbverläufe bis hin zu weißen Symbolen auf einem Hintergrund mit Farbverlauf ist dieses Farbschema beliebt.
Das könnte das Attraktive an der Verwendung von Verläufen in Symbolen (und insgesamt) sein - es gibt so viele verschiedene Möglichkeiten, den Trend zu verwenden. Sie können einen Farbverlauf hinzufügen und haben immer noch kein Projekt, das genau wie etwas anderes aussieht.
13. Konzentrieren Sie sich auf einfaches Färben
Icon-Designer verfolgen auch bei der Farbe den umgekehrten Ansatz und halten sich bei diesen kleinen Designelementen an einfache, eingeschränktere und grundlegendere Farbpaletten.
Die Verwendung einer begrenzten Palette ist eine gute Idee. Bei einem so kleinen Design können zu viele Farben oder Details den Raum schnell überfordern und das Auge belasten.
Sie möchten nicht, dass Benutzer darüber nachdenken müssen, was das Symbol ist oder was Farbe bedeutet. Durch die Begrenzung der Detailgenauigkeit - einschließlich aufwändiger Farbgebung - kann jedes einzelne Symbol leichter gesehen und verstanden werden. Dies ist am wichtigsten bei Symbolen, die bei den kleinsten Größen verwendet werden.
14. Alles App Style
Einer der Gründe, warum Symbole so populär geworden sind, ist, dass wir sie bereits für fast alles entwerfen. Von App-Symbolen bis hin zu Symbolen im App-Stil für Favoriten oder Desktop-Symbole ist dieser Stil praktisch überall.
Symbole im App-Stil haben fast einen eigenen Stil. Das beinhaltet:
- Quadratische Form
- Abgerundeten Ecken
- Farbiger Hintergrund (normalerweise einfarbig)
- Einfache Form innerhalb des Symbols
- Viel Kontrast zwischen Symbol und Hintergrundfarbe
- Kein Text oder Schriftzug
15. Dicke, gleichmäßige Striche
Besonders beliebt sind nicht nur Symbole im Linienstil, sondern auch Symbole mit dicken Strichen.
Diese Symbole wurden häufig für einfarbige Anwendungen entwickelt und werden häufig in Weiß oder Schwarz über Farb- oder Fotohintergründen verwendet.
Symbole mit dicken, gleichmäßigen Strichen werden am häufigsten einzeln verwendet, z. B. ein Warenkorbsymbol oder ein Kontaktsymbol. Sie werden nicht oft in einer Sammlung von Symbolen verwendet.
16. Flache Symbole bleiben beliebt
Während ein Großteil des harten Fokus auf flaches Design verflogen ist, ist das Icon-Design immer noch ziemlich flach (oder zumindest fast flach).
Dies ist wahrscheinlich auf die supereinfache Natur des flachen Designs und die Idee zurückzuführen, dass sich dieser Look ziemlich leicht in eine Reihe anderer Stile integrieren lässt.
Selbst wenn Sie sich einige der hier vorgestellten Beispiele und Trends für das Icon-Design ansehen, werden Sie feststellen, dass viele davon flach sind. (Linienstilsymbole sind beispielsweise fast immer flach.)
17. Emoji-Symbole
Emojis sind fast zu ihrer eigenen Sprache geworden - eine visuellere Form der Kommunikation, die immer allgemeiner akzeptiert wird.
Das Design von Icons nimmt auch ein emoji-artiges Flair an. Diese Symbole sind aufgrund eines Fokus auf die Kopfform einer Person oder Kreatur erkennbar. (Die von Star Wars inspirierten Emoji-Symbole oben sind ein großartiges Beispiel dafür, wie man Spaß mit dem Symboldesign hat.)
Dieser Stil des Symbols eignet sich hervorragend für eine Kontaktseite oder zur Darstellung von Personen oder Personen in einem Design.
Wie man ein besseres Symbol entwirft
Das Erstellen eines guten Symbols oder einer Reihe von Symbolen ist mehr als nur ein Sprung zu einigen der neuesten Trends im Symboldesign. Aufgrund der geringen Größe der Symbole sind Liebe zum Detail und Präzision ein wichtiger Bestandteil des Designprozesses.
Für das Icon-Design im Jahr 2019 gelten immer noch einfache Regeln. Kombinieren Sie diese Richtlinien mit einigen der oben genannten Trendideen, um etwas zu schaffen, das Sie lieben werden:
- Beginnen Sie mit einem Raster
- Mit Geometrie bauen
- Erstellen Sie eine einzigartige Form
- Geben Sie den Symbolen viel Platz
- Halten Sie sich an Ihre Markenfarben
- Verwenden Sie konsistente Divots
- Design für die kleinste Größe, die Sie benötigen
- Nicht dekorieren
Richtlinien für die Gestaltung von Symbolen
Ein guter Weg, um mit dem „In“ Schritt zu halten, ist das Betrachten von Grafikstandards und Styleguides. Jedes Mal, wenn Apple oder Google ihren Ansatz ändern, ändern sich auch alle anderen. Teilweise, weil sie müssen und teilweise, weil der neue Stil oft die Zeiten und Trends im Icon-Design widerspiegelt.
Richtlinien finden Sie hier:
- Apple App Icons
- Android App Icons
- Material Design Produktsymbole
- Material Design System Icons
Fazit
Symbole sind ein nützliches Entwurfswerkzeug. Von der Verwendung als App-Symbole über Website-Marken oder Favoriten bis hin zu Divots, die in einem Logo oder in einem Designprojekt verwendet werden können, ist das Symbol eine Marke, die erhalten bleibt.
Gehen Sie beim Icon-Design genauso vor wie bei fast jedem anderen Projekt, aber denken Sie wirklich an Einfachheit und Größe. Symbole sind schnell zu sehen und oft klein. Dies kann einen großen Einfluss auf das Design haben.
