Ratgeber: Design-Regeln für das optimale Icon

Icon-Design ist schwieriger als man denkt - wir haben Tipps und Tricks.

Ratgeber: Design-Regeln für das optimale Icon

Ratgeber: Icon-Design ist schwieriger als man denkt. In dem vorliegenden Artikel geben wir Tipps und Ratschläge für das optimale Icon. Sie sind klein, sollen nicht unscheinbar wirken. Aussagekräftig wäre ideal, auch der Wiedererkennungswert sollte gegeben sein. Icons sind somit weitaus mehr als nur schnöde, mickrige Grafiken. Spätestens seit iPhone & Co. sind sie zudem allgemein bekannt, was die Sache nicht einfacher macht. Das Icon soll in den App Stores von Apple und Google zum Download anregen und zugleich Marke oder Funktion wiederspiegeln. Das Branding soll außerdem natürlich bestmöglich gefördert werden. Viele Aufgaben für eine kleine Grafik, bei dem ein effektives Design die entscheidende Rolle spielt.

Geht es um Symbole, gibt es allerdings zweifellos einige goldene Regeln. Der wesentliche Zweck eines Icons besteht sicherlich darin, das Wesen einer App vollständig wiederzugeben. Bevor man sich dem Icon-Design widmet, sollten daher grundlegende Richtlinien und Prinzipien studiert werden. Folgende Themen sind von Bedeutung: Zielgruppe, Größe, Einfachheit, Beleuchtung, Perspektive und Stil. Der vorliegende Artikel geht auf diese Themen ein und stellt einen Ratgeber für alle diejenigen dar, die ihrer Conversion-Rate in den App Stores auf die Sprünge helfen wollen.

Zielgruppe

Das Wissen um die eigene Zielgruppe ist von herausragender Bedeutung. Das Thema der App gibt diese zumeist vor, nun muss das Design des Icons dies auch wiedergeben. Apps, die sich mit Freizeitpark Gutscheinen beschäftigen, könnten zum Beispiel eine Achterbahn als Hintergrundmotiv haben. Bei Foto-Apps ist eine Kamera stets eine gute Wahl. Bei dem Icon-Design spielen zudem auch kulturelle Überlegungen eine Rolle. Produzenten von Apps sollten ihre Zielgruppe also gut kennen.

Entwurf

Symbole und Icons verbindet eine Gemeinsamkeit: Beide sollten so schlicht wie möglich gehalten werden und zugleich mo2glichst viel aussagen. Als Blaupause können zum Beispiele die Icons der eingebauten Apps von Apple iPhones oder Google Android Geräten gelten. Es kann mit Sicherheit davon ausgegangen werden, dass die beiden großen US-Konzerne viel Zeit und Geld in das Design ihrer Icons investieren. Ein Blick über die Schulter kann da nicht schaden. Als Faustregel kann und muss gelten, dass Icons keine künstlerischen Meisterwerke mit viele Details sind. Einfach und gut sollten sie sein.

Schriftarten, Symbole, Farben und Stile müssen innerhalb ihrer eigenen Familien konsistent und innerhalb ihrer erweiterten Familien harmonisch sein. Wenn alle Elemente auf einer Plattform funktionieren, ist es notwendig, die gleiche Balance zu reproduzieren, damit auch alle Designs für die einzelnen Plattformen eine ebensolche harmonische Familie bilden. Auch Farbverläufe, Schatten und Perspektiven müssen stimmig sein. Das gängige Symbol für RSS-Icons kennen bestimmt viele Es zeigt wie wichtig es ist, die richtige Balance der Konsistenz innerhalb der Symbolfamilien zu finden, um zu verhindern, dass das Gesamtdesign einheitlich, flach und langweilig wird.

Abmessungen

Das Versprechen aufkommender Technologien wie SVG und Icon-Fonts muss erst noch realisiert werden, daher gelten aktuell nach wie vor die altbekannten Regeln. Die meisten Icons werden als .png-Dateien ausgegeben, die eine deutliche Verbesserung gegenüber ihrem Vorgänger, dem .gif-Format, darstellen. Die PNG-Datei wird jedoch nicht skaliert, was zur Folge hat, dass man nicht einfach ein einzelnes Symbol entwerfen und dessen Größe ändern kann. Dies würde zu Unschärfen führen und damit die gesamte Qualität des Designs schmälern. Kleinere Symbole erfordern weniger Details, während größere Symbole ein tieferes und reichhaltigeres Design erfordern. Unabhängig von der Größe müssen Icons aus einem einzigen Design stammen und für jede Iteration der Größe subtil angepasst werden.

Die unterschiedlichen Mobil-, Tablet- und Desktop-Plattformen geben Größen für die Konsistenz innerhalb jeder Plattform vor, aber es gibt keine Konsistenz zwischen den Plattformen. Favicons sind jedoch im Allgemeinen 16 Pixel groß. Es gibt verschiedene Denkansätze darüber, wie man sich dem Icon-Design nähert. Der Top-Down-Ansatz besteht darin, für die größte Bildschirmgröße mit den meisten Details zu entwerfen und für jede Iteration nach unten zu verfeinern, um das knackigste Symbol in der kleinsten Größe zu erzielen.

App-Symbole werden den Nutzern in vielen verschiedenen Platzierungen und Größen angezeigt. Bei Google Play beispielsweise erscheinen App-Icons in Top-Charts in einem viel kleineren Maßstab als auf Produktseiten. Wer zu viele oder zu kleine Elemente hinzufügt, riskiert, dass das Icon unkenntlich wird und die Zielsetzung verfehlt.

Farbwahl

Weniger ist mehr und auch zu massive Farbverläufe erscheinen mit Stand 2021 nicht mehr zeitgemäß. Viele Unternehmen nutzen seit Jahren bestimmte Farben, die sich auch im Logo, auf Briefpapier und in der Werbung wiederfindet. Das Icon sollte diese Farben unbedingt ebenfalls nutzen, wodurch der Wiedererkennungswert deutlich zunimmt. Kulturelle und gesellschaftliche Einflüsse sollten allerdings auch berücksichtig werden.

Einzigartigkeit

Icons bestehen oftmals nur aus einem Piktogramm. Das kann man machen, muss es aber nicht. Durch eine geschickte Kombination von zwei oder drei Piktogrammen kann oftmals ein einzigartiges Symbol mit hoher Aussagekraft erstellt werden. Eine weitere und stets gute Methode besteht darin, Branding-Elemente wie Markennamen oder Logo hinzuzufügen. Maskottchen werden ebenfalls gerne verwendet, beinhalten allerdings die Gefahr, dass sie zu viele Details aufweisen.

Inspirierende Icon-Sets

Als Fazit ist das Design von Icons nicht allzu schwierig, die oben stehenden Hinweise sollten allerdings beachtet werden. Mehr noch, die Arbeit an den kleinen Grafiken bringt mit der Zeit viel Spaß und motiviert viele, irgendwann dann den ersten eigenen Satz von professionellen kommerziellen Symbolen zu erstellen. Der Verkauf von Icons kann für einen Designer ein lukratives Unterfangen sein. Kreative können somit jederzeit ein Icon erstellen und in Online-Shops verkaufen.

TIPP: Nichts mehr verpassen! Kostenlosen Newsletter bestellen, uns auf Facebook und Instagram folgen oder unsere Handy App laden.


Keine Beiträge vorhanden

Anmelden
Benachrichtige mich zu:
0 Kommentare
Inline Feedbacks
View all comments