Warum beeinflusst die Formulierung das SVG?

Jedes Logo, Icon, jeder Sticker und jedes Abzeichen aus dem Studio wird erst gezeichnet und dann in Vektorpfade nachgezeichnet, eine Form pro Fläche einer flachen Farbe. Eine Zeichnung aus wenigen kräftigen, flachen Formen ergibt wenige saubere Pfade. Schattierungen, Texturen und Verläufe ergeben Hunderte schmale Splitter. Das Nützlichste, was eine Beschreibung tun kann, ist also, um eine Grafik zu bitten, die schon flach ist. Die eigenen Anweisungen des Studios verlangen genau das, und deine Worte sollten das nicht wieder aufheben.

Drei Schritte: eine Sprechblase, eine Checkliste und eine Lupe

Was sollte die Beschreibung eines Logos sagen?

Drei Dinge in einem Satz: was es zeigt, für wen es ist und die Farben.

ein Farnblatt, das zugleich ein Pfeil nach oben ist, für eine Spar-App namens „Fernvault“, tiefes Marineblau und warmes Gold

  • Eine Idee. „Ein Blatt, das auch ein Pfeil ist“ ist ein Logo. „Ein Blatt, eine Münze, ein Diagramm, ein Schild und ein Schlüssel“ ist ein Gedränge.
  • Konkrete Substantive. „Vertrauen“ und „Wachstum“ lassen sich nicht zeichnen. „Zwei Hände“, „ein Keimling“ und „ein Pfeil nach oben“ schon.
  • Den Namen in Anführungszeichen oder im Namensfeld – nur, wenn das Logo ihn ausschreiben soll. Wähl den Chip Wortmarke, wenn der Name das Logo ist (Logo-Stile).

Wie beschreibe ich ein Icon-Set?

Liste die Icons als Chips auf (Dinge, keine Handlungen): Tasse Kaffee, Croissant, Standort-Pin, Treuekarte. Beschreib dann den Stil einmal im Stilfeld. Er fließt in jedes Icon ein, und genau das hält das Set einheitlich.

Zwölf flache Icons in Blau, Marineblau und Korallenrot: eine Checkliste, eine Download-Ablage, eine Pipette, eine Glühbirne, eine Lupe, ein Farbeimer, ein Bleistift, ein Foto, eine Schere, ein Smartphone, eine Sprechblase und ein Ebenenstapel

Die Icons in unseren Anleitungen sind ein Set, das genau so entstanden ist: zwölf Chips, „Flache Farben“, abgerundete Ecken, die Farben #0061fc, #0a2d8f und #ef6e50 und die Stilworte „klare moderne Produktillustrations-Icons, einfache kräftige Formen, flache Füllungen, keine Umrisse, keine Verläufe“.

Gute Stilworte beschreiben das Zeichnen, nicht die Stimmung: „abgerundete Enden“, „dicke gleichmäßige Linien“, „scharfe Ecken“, „keine Umrisse“, „klobige Formen“, „Retro-Posterfarben der 70er“. Vermeide Worte, die Details hinzufügen, die ein Icon bei 24 px nicht tragen kann: „realistisch“, „kunstvoll“, „3D“, „detaillierte Schattierung“. Halte den Detailgrad über die ganze Liste gleich. Ein „Punkt“ neben einer „Skyline einer Stadt“ wirkt ungleichmäßig, egal in welchem Stil.

Wie beschreibe ich Sticker und Abzeichen?

  • Sticker: Beschreib eine Figur einmal und genau: Tierart oder Gegenstand, Körperform, zwei oder drei Farben, ein Detail („eine runde, pummelige rote Katze mit cremefarbenem Bauch und rosigen Wangen“). Liste dann Ausdrücke auf, mit der Beschriftung in Anführungszeichen: winkend "Hallo!". Halte Beschriftungen bei zwei oder drei Wörtern. Jeder Buchstabe wird gezeichnet, prüf also die Rechtschreibung vor dem Absenden.
  • Abzeichen: Der Name der Leistung kommt nach oben, darunter eine kurze Regel oder derselbe Text. Zwei oder drei Wörter passen viel besser in die Rundung des Rings als ein Satz. Beschreib das Bild in der Mitte als einen einfachen Gegenstand: „ein Laufschuh“, „ein Berg mit einer Fahne“.

Was sollte ich weglassen?

Vermeiden Warum Stattdessen verlangen
Verläufe, „leuchtend“, „glänzend“ werden zu Streifen flacher Farbe zwei flache Töne
fotografisches Licht, Schatten, „realistisch“ ergeben viele schmale Splitter „flach“, „volle Formen“
feine Texturen, „Grunge“, „Aquarell“ ergeben Sprenkel eine saubere Kante oder Textur, die später im Editor dazukommt
winziger Text, Slogans im Zeichen in kleinen Größen unlesbar der Name neben dem Zeichen, in einer Schrift gesetzt
mehr als drei Farben unruhigere Sets, mehr Pfade bis zu drei Farben, benannt oder als Hex-Werte

Wie korrigiere ich, was zurückkommt?

Ändere immer nur eine Sache. Ist ein Set nah dran, nutze eine Runde und zeichne einzelne Icons mit einer kurzen Notiz neu („einfacher, eine schlichte aufgerollte Matte“), statt von vorn anzufangen. Ist ein Logo nah dran, verfeinere es mit Worten („das R kräftiger“). Stimmt nur eine Farbe oder eine verirrte Form nicht, öffne das SVG im SVG-Editor – das geht schneller als eine weitere Runde. Und wenn das SVG viel mehr Pfade hat, als die Zeichnung Formen hat, war die Zeichnung nicht flach genug: Bitte um „flache Füllungen, keine Schattierung“ und lass neu zeichnen.