So erstellen Sie ein Icon Pack

Als Anfänger in Illustrator habe ich einige ziemlich coole Grafiken erstellt, die ich gerne auf meiner Website teilen möchte. Nach dem, was ich gesehen habe, erstellen die Leute ein .ai-Symbolpaket mit einer Datei, das Sie herunterladen und frei verwenden können. Die meisten davon sind in einem perfekten Rasterformat eingerichtet, sogar mit etwa 100 Symbolen. Wenn ich so etwas vorhabe, wie sollte ich bei der Einrichtung meines Projekts vorgehen? Soll ich jedes Symbol einzeln erstellen und dann in die Master-Symbolpaketdatei importieren? Jede Richtung wäre toll. Danke!

Meine Meinung ist, dass Sie .pdf und nicht .ai verwenden sollten. Die Leute werden viel mehr Glück haben, wenn sie eine PDF-Datei öffnen.
Nicht wirklich, wenn das Ziel darin besteht, die Quelldateien zu teilen. Dafür ist Illustrator EPS weit verbreitet.
@KMSTR Warum würden Sie dann keine .pdf verwenden?
Ich muss Joonas zustimmen. PDF ist ein viel besser übertragbares Format als EPS. PDF-Dateien können vollständig bearbeitbare Vektordaten enthalten.
Illustrator PDF würde auch funktionieren. Ich habe es einfach öfter in EPS gesehen.
Ja, gehen Sie mit ai. EPS ist ein altes Format, als Drucker in den 80er Jahren feststeckten. Jeder, der Ihre Dateien verwenden möchte, verfügt über Illustrator (oder das Open-Source-Äquivalent) und kann Ihre Datei öffnen. Warum sich die Mühe machen, Formate zu ändern und möglicherweise sogar die Dateigröße zu erhöhen? Bleiben Sie einfach bei .ai.
Wie Sie sehen, gibt es viele Möglichkeiten. Lassen Sie mich auch SVG erwähnen, da Browser dieses Format jetzt unterstützen.

Antworten (3)

Ich würde mit einem Raster beginnen , das einen guten Abstand zwischen den Symbolen hat, nicht nur um die Arbeit zu erleichtern, sondern auch, weil Sie am Ende nicht neu anordnen müssen. Das einfachste, was ich mir vorstellen kann, sind 16x16px-Icons mit einem Abstand von 16px zwischen ihnen (wenn Sie an einem Icon-Sprite arbeiten, sollte der Abstand zwischen ihnen jedoch minimal sein). Je nachdem, was man am Ende will. Dies sollte es jedoch erleichtern, die Dokumentmaße am Anfang zu bestimmen. Sie können auch Hilfslinien oder ein Hintergrundraster einrichtenum sicherzustellen, dass Sie im richtigen Raum/in den richtigen Abmessungen arbeiten. Ich ziehe diese Methode dem Erstellen von Symbolen in einzelnen Dateien vor, da Sie so einen guten Überblick darüber erhalten, ob die Symbole alle gut zusammenpassen. Etwas, das Sie beim Entwerfen ständig neu bewerten müssen.

Auch hier sind die Optionen riesig und hängen davon ab, was Sie am Ende wollen, also gebe ich Ihnen nur ein Beispiel :

Geben Sie hier die Bildbeschreibung ein

Der andere Vorteil beim Erstellen einer All-in-One-Datei ist die einfache Wiederverwendung der Farbpalette und der Grafikstile.
Oh, und vergessen Sie nicht, die Pixelvorschau einzuschalten und an Pixel auszurichten, und verwenden Sie Effekt > Verzerren & Transformieren ... > Transformieren, um Ihr Raster aus Arbeitsquadraten zu erstellen. Ich bevorzuge eine einzelne Pixelregel, um meinen Arbeitsbereich abzugrenzen, wenn nicht sogar eine dedizierte Zeichenfläche.
Danke schön. Das ist genau das, was ich brauchte. Ich schätze Ihre Zeit.
@plainclothes: gute Ergänzungen, die Wiederverwendung von Formen, Farben und Stilen macht einen großen Unterschied.

Ich bin kein Experte für die Erstellung von Symbolen, aber meiner Meinung nach hängt es davon ab, wie komplex Ihre Symbole sind. Wenn sie viele Elemente haben, würde ich aus Gründen der Größe und Handhabung verschiedene Dateien verwenden, um sie zu erstellen. Sobald sie fertig sind, können Sie sie in Ihre Grid-Datei einfügen, aber sie auch zuerst als transparentes .png exportieren, zum Beispiel. Sie werden höchstwahrscheinlich sowieso eine Bitmat-Datei für jedes Symbol benötigen, da viele der Pakete, die ich heruntergeladen habe, Vorschauordner hatten (sowie die eigentliche .ai-Datei). Und wenn Sie in Zukunft verschiedene Packungen mit denselben machen möchten, ist es auch einfacher zu handhaben.

Ein weiterer beliebter Trend ist das Erstellen von Icon-Fonts . Diese sind im Web sehr gut nutzbar. Dies ist jedoch nur möglich, wenn Sie einfarbige Symbole haben. Diese sind eigentlich ziemlich praktisch, ich verwende sie wegen der Benutzerfreundlichkeit regelmäßig im Design.

Aber die meisten Icon-Pakete, die ich sehe, haben einige Variationen zur Verfügung: - Einige Größen als separates 24-Bit-PNG mit Transparenz (dunkel auf weiß und umgekehrt) - separate AI- oder PDF-Dateien - Symbolschrift (falls verfügbar) - separate ICO-Dateien, in verschiedene Größen (echte Symbole).

Ich habe nicht viele auf einem "Kontakt" -Blatt gesehen, aber das könnte ich sein :)