Share
In diesem Tutorial zeige ich Ihnen, wie Sie eine Cartoon-Illustration eines Gehirns erstellen und dann das Bild für die Verwendung als Symbol für OSX und Vista konvertieren. Ich werde auch einige Punkte über Details für das Icon-Design besprechen. Lass uns anfangen!
Unten ist das endgültige Bild, auf das wir hinarbeiten werden. In diesem Lernprogramm erstellen wir auch daraus ein Symbol. Möchten Sie auf die vollständigen Vector Source-Dateien und herunterladbaren Kopien jedes Tutorials zugreifen, einschließlich dieses Tutorials? Nehmen Sie an Vector Plus für nur 9 € pro Monat teil.
Sammeln Sie Referenzmaterial und Bilder / Illustrationen von Gehirnen. Medizinische Bücher sind eine perfekte Quelle. Das Gehirn ist äußerlich genauso komplex wie intern. Die wichtigsten Dinge, die zu beachten sind, sind, dass das Gehirn eine allgemeine ovale Form ist, die die graue Substanz bildet, dann gibt es das Kleinhirn und den Hirnstamm. Von vorne / von oben gesehen ist das Gehirn bipolar und besteht aus zwei Halbkugeln.
Ich mag es, ein Grundformular zuerst auf Papier oder digital zu skizzieren, bevor ich es zu Illustrator nehme. Dies trifft insbesondere auf eine organische Form zu, da Sie nicht genau wissen, wie es aussehen wird. Es ist daher von Vorteil, die Grundlagen zu skizzieren, bevor Sie mit den Vektoren fortfahren.
Wenn Sie das Aussehen des Gehirns skizzieren, berücksichtigen Sie Folgendes:
Perspektive - Von welcher Seite werden Sie Ihr Gehirn retten? Eine Seitenansicht ist tendenziell nicht so dimensioniert, daher schlage ich vor, dass Sie sie ein wenig von der Seite positionieren, um die Linie zu integrieren, die die beiden Hemisphären trennt.
Modulieren - Ein Gehirn sieht fast aus wie ein großes Netzwerk von nicht einheitlichen Pfeifen, die zusammen auf eine Spaghetti-Kugel gebogen wurden. Diese Rohre haben eine einzigartige Krümmung, Sie können jedoch Elemente wie wieder verwenden S und M geformte Zickzacks, T Schnittpunkte und verschiedene andere Elemente in Ihrem Gehirn; Denken Sie daran, die Gesamtform beizubehalten und stellenweise hervorzuheben. Übertreiben - Wir streben kein realistisches anatomisch korrektes Rendering an. Verwenden Sie die Kurven, um bestimmte Bereiche zu betonen. Vereinfachen - Sie müssen nicht so viele Schnörkel wie ein echtes Gehirn machen. Wieder machen wir kein realistisches Rendern, vermeiden Sie also unnötige Details. Dies liegt daran, dass beim Konvertieren des Bildes in ein Symbol einige Details verloren gehen oder brechen können, wenn Sie mit kleineren Auflösungen angezeigt werden. Ich habe sogar das Kleinhirn und den Hirnstamm weggelassen, um das Bild zu vereinfachen. Konsistent - Halten Sie Ihre Liniengrafik konstant. Die Liniendicke bestimmt die Nähe und das Gewicht der Kurven untereinander. Denken Sie also daran.
Für manche ist dies möglicherweise ein unnötiger Schritt, aber ich gehe normalerweise in Flash über eine Bleistiftskizze, um klare Strichzeichnungen zu erstellen, und arbeite dann in Illustrator daran, obwohl Sie Ihren bevorzugten Arbeitsablauf frei wählen können.
Erstellen Sie in Illustrator eine Leinwand von 512 x 512 Pixel. Importieren Sie Ihre Skizze auf Ihrer Leinwand und erstellen Sie mit dem Stiftwerkzeug die Strichgrafik. Wenn Sie mit dem Pinselwerkzeug von Illustrator oder mit einem Tablett vertraut sind, können Sie dies anstelle dessen verwenden, aber danach in Konturen umwandeln. Achten Sie darauf, die Krümmung mit der Richtung zu kreuzen und geeignete Falten und Überlappungen zu erstellen.
Behalten Sie die extremen Falten mit scharfen Enden bei. Erstellen Sie für weichere Falten mehr abgerundete Enden oder fügen Sie sogar winzige Falten hinzu, um die visuelle Struktur zu unterstützen. Fügen Sie alle Formen mithilfe des Pathfinder Unite-Werkzeugs in einer einzigen Füllung zusammen und benennen Sie die Ebene in "Linien" um.
Verwenden Sie den Bucket Bool, um die Farben aufzufüllen, und extrudieren.
Nachdem Sie alle Strichzeichnungen sortiert haben, erstellen Sie die Füllungen mit dem Live-Paint-Bucket-Tool. Wählen Sie die Strichzeichnung und verwenden Sie eine leicht entsättigte rosa Farbe für die Basis. Machen Sie sie nicht grau oder zu rosa, aber es liegt an Ihnen.
Da das Bucket-Tool eine Live-Paint-Funktion ist, werden Ihre Vektoren zu einem Objekt in einer Live-Paint-Gruppe. Um dies zu beheben und sie voneinander zu trennen, gehen Sie zu Objekt> Malfarbe> Erweitern. Dadurch wird Ihre Live-Paint-Gruppe in eine normale Gruppe von Füllungen in Ihrer Ebenenpalette umgewandelt. Trennen Sie dann die rosafarbenen Füllungen auf eine andere Ebene und benennen Sie sie in "Basis" um.
Wir müssen ein paar weitere Details hinzufügen, damit das Gehirn glänzender und dreidimensionaler wird, indem Hervorhebungen und Schatten hinzugefügt werden. Bestimmen Sie, aus welcher Richtung das Licht kommt. In meinem Fall ist es Standard oben links. Erstellen Sie eine neue Ebene mit dem Namen "Highlights". Beginnen Sie nun mit dem Stiftwerkzeug, sehr abgerundete Formen zu machen, die auf das angenommene Licht ausgerichtet sind, wobei die Farbe etwas heller ist als Ihre Basis.
Denken Sie daran, dass es nicht realistisch sein soll, sondern durch das Hinzufügen von Glanz etwas Glanz verleihen soll. Halten Sie es einfach und fügen Sie nicht zu viel hinzu, da die Farben bei kleineren Auflösungen gemischt werden.
Während die Hervorhebungen abgerundet sind und ziemlich unabhängig sind, liegen die Schatten neben den Hervorhebungen an den Rändern. Erstellen Sie auf einer anderen Ebene namens "Schatten" mit dem Stiftwerkzeug und einer dunkleren Farbe von der Basis aus einige Schatten. Stellen Sie sicher, dass Sie sie an Orten hinzufügen, an denen sich die Gehirnformen überlappen und Schatten aufeinander werfen.
Duplizieren Sie Ihre Linien- und Basisebenen auf eine neue mit dem Namen "Farbverlauf", mit der wir dem Gehirn eine weitere Schattierungsfunktion hinzufügen. Verwenden Sie erneut das Pathfinder Unite-Werkzeug, um die Strichgrafik und die Basisfarbe Pink zu einer einzigen Füllung zusammenzufügen. Nehmen Sie dann eine Farbverlaufsfüllung vor, verwenden Sie einen anderen Rosa-Farbton als die bereits verwendeten und etwas weiche Farbe. Ich habe eine rosa Farbe mit etwas Orange darin verwendet. Stellen Sie die Ebene über alles und setzen Sie den Mischmodus auf "Farbe".
Der letzte Schritt besteht darin, Schatten unterhalb des Gehirns zu erzeugen, und zwar ausschließlich für die Verwendung von Symbolen. Duplizieren Sie die Basisschicht und legen Sie sie darunter. Füllen Sie die Formen mit Schwarz und verwenden Sie Effekte> Photoshop-Effekte> Weichzeichnen> Gaußsche Weichzeichnung mit einem Wert von 10px, um den Schatten zu verwischen. Stellen Sie sicher, dass Sie alles neu skalieren und so positionieren, dass nichts den Rand der Leinwand berührt und der Schatten auch nicht davon abgeschnitten wird.
Sie sollten mit 6 Hauptelementen enden: "Farbverlauf", "Linienführung", "Hervorhebungen", "Schattierungen", "Grundrosa" und "Schatten". Die letzte Abbildung ist unten. Nun können Sie die Illustration in ein Dateisymbol konvertieren!
Der neueste Mac OS Leopard und natürlich der neue Snow Leopard unterstützen Symbolgrößen von bis zu 512 x 512 Pixeln, während Windows Vista nur 256 x 256 Pixel unterstützt. Mac OSX unterstützt alle Arten von Formaten, die als Symbol verwendet werden können, da das Betriebssystem Bilder darstellt. Leider behandelt Windows das ICO-Format, das zwischen Vista und älteren Windows-Versionen nicht konsistent ist.
Mac OSX wird mit einem übersichtlichen Dienstprogramm namens "Icon Composer" geliefert, das sich in Root> Entwickler> Programme> Dienstprogramme befindet. Es ist Teil der kostenlosen Entwickler-Tools von Apple, die hier erhältlich sind (kostenloses Konto erforderlich)..
Windows verfügt nicht über ein natives Dienstprogramm, das Sie verwenden können. Es gibt jedoch einen Freeware-Symboleditor IcoFX, der unter anderem in ICO exportieren kann.
In diesem Tutorial werde ich nur das Originalbild 512x512 verwenden und die Software automatisch die Größe ändern lassen. Die erforderlichen Auflösungen für Mac OS sind 512x, 256x, 128x, 32x, 16x. Seltsamerweise sind sie für Windows 256x, 48x, 32x, 24x, 16x.
In der Realität würden Sie das Symbol in jedem Schritt bearbeiten und verfeinern, da es zu einem unglaublichen Verlust an Details kommt. Bei niedrigsten Auflösungen sind die Formen nicht zu unterscheiden, und Sie müssen auf die manuelle Bearbeitung bis auf Pixel zurückgreifen.
Wenn Sie sich nicht bei Apple anmelden und die Entwicklertools herunterladen möchten, um Icon Composer zu erhalten, haben Sie Glück, da Mac OS standardmäßige RGBA-PNGs in seinen Symbolen unterstützt. Alles, was Sie tun müssen, ist, Ihre Datei in Illustrator als 512 x 512-PNG-Datei mit Transparenz zu speichern. Öffnen Sie sie mit Vorschau, und klicken Sie auf Bearbeiten> Kopieren, um das Bild zu kopieren. Gehen Sie dann zu dem Ordner, dessen Symbol Sie ändern möchten, und klicken Sie mit der rechten Maustaste auf> Informationen abrufen (oder Befehlstaste + I). Suchen Sie in der oberen linken Ecke neben dem Ordnernamen nach dem Symbol und klicken Sie darauf. Es wird hellblau hervorgehoben.
Wenn Sie das hervorgehoben haben, können Sie fortfahren und auf Bearbeiten> Einfügen klicken. Dadurch wird das zuvor kopierte PNG eingefügt.
Der Nachteil ist, dass das Bild auch bei kleineren Größen immer noch 512 x 512 Pixel groß ist, was sich auf den Speicher auswirkt, wenn das Symbol angezeigt wird. Ein weiterer Grund ist die Tatsache, dass es Ihnen schwer fällt, es wieder herzustellen, wenn Sie eines der Systemsymbole ausgetauscht haben.
Um eine native OSX-ICNS-Datei zu erstellen, führen Sie Icon Composer aus und ziehen Sie das 512px x 512px PNG in die gleiche Größe. Das Programm fordert Sie auf, wenn Sie das Bild kopieren und in andere Auflösungen umwandeln möchten. Wenn Sie für jedes ein eigenes Bild erstellen möchten, fahren Sie fort. An diesem Punkt lasse ich den Computer die Größe für mich ändern.
Sie können sehen, dass sich auf der Unterseite eine Registerkarte Masken befindet. Dadurch können Sie ein unabhängiges Bild importieren, das für Transparenz sorgt. Da wir PNG-Dateien verwenden, können Sie eine ICNS-Datei über Datei> Exportieren speichern.
Wenn Sie unser neues ICNS in der Vorschau öffnen, werden Sie sehen, dass es sich um einen Container für 5 Bilder ihrer jeweiligen Größe handelt.
An diesem Punkt ist es schwierig, das ICNS als Symbol zu implementieren, da Sie es nicht einfach als ganze Datei kopieren und einfügen können. Wenn Sie sich auf Ihrem Mac mit Anpassungen auskennen und benutzerdefinierte Icons mögen oder wenn Sie ein Designer sind, der sein Artwork testen muss, empfehle ich ein sehr ordentliches Dienstprogramm CandyBar. Es ist nicht kostenlos, aber es lohnt sich, wenn Sie die Anpassung ernst nehmen möchten.
Vista unterscheidet sich von Windows XP. Icons mit PNG-Komprimierung wurden eingeführt und werden unter Windows 7 übernommen, sodass Sie schöne Icons mit ausreichender Transparenz erstellen können. Windows behandelt Symbole durch ICO-Dateien. Sie sind die Entsprechung des ICNS for mac, dem Container für Bilder mit verschiedenen Auflösungen.
Wir werden eine Freeware-Anwendung namens IcoFX verwenden. Windows unterstützt keine Symbolauflösungen über 256 x 256 Pixel. Daher empfehle ich Ihnen, ein 256 Pixel großes Bild direkt aus Illustrator zu exportieren, um eine zusätzliche Komprimierung zu vermeiden.
Gehen Sie zu Datei> Bild importieren, um Ihr 256px-Bild zu importieren. Verwenden Sie 32-Bit-Einstellungen für 256x256.
Klicken Sie im linken Bereich mit der rechten Maustaste auf> Neues Bild, um ein Bild mit der nächsten Auflösung zu importieren. Sie können einen benutzerdefinierten Import von 128x128 als zusätzliche Größe vornehmen. Dann importieren Sie den Rest der Bilder.
Wenn Sie alle Bilder geladen haben, können Sie die Datei als ICO-Datei speichern.
Um ein Symbol eines Ordners / Ortes in Vista zu ändern, ändere ich in diesem Fall das Symbol "Mein Computer". Klicken Sie mit der rechten Maustaste darauf, und wählen Sie Eigenschaften aus. Wenn Sie eine Verknüpfung ändern, wechseln Sie zur Registerkarte Verknüpfung oder, wenn es sich um einen Ordner handelt, zur Registerkarte Anpassen. Klicken Sie auf die Schaltfläche "Auswählen" und wählen Sie die ICO-Datei aus, die Sie gespeichert haben.
Bestätigen Sie die Bildauswahl und das Symbol sollte in Ihr benutzerdefiniertes Bild geladen werden.
Nun wissen Sie, wie Sie ein Symbol von Grund auf erstellen, sowohl für Mac OSX als auch für Windows Vista. Egal, ob Sie das Tutorial aus Abschnitt 1 lesen, um den Illustrationsprozess zu verfolgen, oder direkt zu Abschnitt 2 springen, um zu sehen, wie Sie Bilder in verwendbare Systemsymbole konvertieren. Ich danke Ihnen, dass Sie dem Tutorial gefolgt sind, und hoffe, dass Sie einiges an Anpassungskunst sehen! Es gibt viele tolle Startplätze.
Abonnieren Sie den Vectortuts + RSS-Feed, um mit den neuesten Vektor-Tutorials und Artikeln auf dem Laufenden zu bleiben.
Accentsconagua