Share
Die Grundausstattung jedes italienischen Frühstücks ist hausgemachter Espresso-Kaffee, der mit der ikonischen "Moka Express" -Kanne zubereitet wird. In diesem Lernprogramm erstellen wir einen Moka von Grund auf mit Formen, Ebeneneffekten und einer Reihe von Tipps zur Steigerung der Produktivität. Wir werden dann unser Design in ein professionelles Icon für Leopard und Vista umwandeln. Also machen Sie Ihre Kaffeetassen fertig und lassen Sie uns brauen!
Dieses Lernprogramm richtet sich an fortgeschrittene Benutzer von Photoshop. Daher sind Kenntnisse der Benutzeroberfläche und Kenntnisse der wichtigsten Tastenkombinationen erforderlich. Schauen Sie sich das Bild unten an, um zu sehen, wie unser fertiges Symbol aussehen wird.
Bevor wir anfangen, lassen Sie uns mit unserer Kaffeekanne aquatintieren. Lesen Sie alles darüber und werfen Sie einen Blick auf das folgende Bild. Dies ist mein geliebter Moka Express, ohne den ich keinen Tag anfangen könnte. Es sieht kompliziert aus, ist es aber wirklich nicht.
Wir können sehen, dass der Moka aus einem achteckigen Bodenbehälter mit einem Ventil auf einer Seite, einer achteckigen verschraubten oberen Kammer mit einem Schnabel zum Ausschenken des Kaffees und einem ringförmigen Boden, einem Deckel, der mit einem Knopf und einem Deckel versehen ist, besteht Griff mit dem Scharnier des Deckels verbunden. Hier gibt es zwei Materialien: schwarzen Kunststoff für den Knopf und den Griff und Aluminium für den Körper.
Beginnen wir mit dem Ring. Erstellen Sie ein neues leeres RGB-Dokument und legen Sie seine Größe auf 512 x 512 Pixel fest. Dies ist die maximale Auflösung von OS X Leopard-Symbolen.
Verwenden Sie im gesamten Lernprogramm weiße, graue und dunkelgraue Hintergrundebenen, damit Sie das Bildmaterial besser sehen können. Lassen Sie uns unser Dokument einrichten. Drücken Sie D, um die Standardfarben Schwarz (Vordergrund) und Weiß (Hintergrund) zu aktivieren. Aktivieren Sie im Menü Ansicht die Option Lineale (Befehl + R) und Einrasten (Befehlstaste + Umschalttaste + Doppelpunkt-Taste). Wir sind bereit zu gehen.
Zeichnen Sie mit dem Ellipse-Werkzeug und mit Hilfe einiger Hilfslinien zwei Ellipsen auf zwei separaten Ebenen. Machen Sie die untere Ellipse schwarz und benennen Sie die Ebene "bottom". Machen Sie die obere Ellipse weiß und benennen Sie ihre Ebene "Basis".
Treffen Sie mit dem Rechteck-Auswahlwerkzeug (M) eine Auswahl in der Mitte der Hilfslinien auf der untersten Ebene. Drücken Sie dann Alt + Rücktaste, um die Vordergrundfarbe von Schwarz zu füllen (siehe Abb. 3a)..
Drücken Sie Befehlstaste + D, um die Auswahl aufzuheben. Wenn Sie sich noch auf der "unteren" Ebene befinden, klicken Sie bei gedrückter Befehlstaste auf die Miniaturansicht der weißen Ellipse auf der "Basis" -Ebene, um die Umrisse auszuwählen. Klicken Sie anschließend auf Löschen, um diese Auswahl aus der schwarzen Ellipse zu löschen (Abb. 3b)..
Schalten Sie die "Basis" -Schicht aus, um das Ergebnis zu sehen (Abb. 3c). Löschen Sie die beiden oberen Dreiecke, indem Sie sie mit einer rechteckigen Auswahl einschließen und den Inhalt löschen. Wir haben jetzt einen halben Ring (Abb. 3d). Benennen Sie diese Ebene in "Ring" um.
Nun fügen wir einige Materialien hinzu. Um Umgebungsreflexionen auf dem Aluminium zu simulieren, fügen Sie der "Ring" -Ebene einen Verlaufsstil hinzu. Erstellen Sie einen horizontalen linearen Farbverlauf mit mehreren Farbvariationen. Versuchen Sie, leichte Tönungen vorzuschlagen und dabei ein mittleres Grau zu erhalten. Machen Sie auch die rechte Seite leichter, um die Lichtrichtung anzuzeigen. Siehe das Bild für die Details.
Das Aluminium sieht gut aus, aber wir möchten ihm eine gebürstete Textur geben, um es realistischer zu machen. Erstellen Sie auf einer neuen Ebene ein weißes Rechteck mit ähnlichen Proportionen wie der Ring (Abb. 5a). Drehen Sie es jetzt um 90 Grad, so dass es senkrecht steht. Verwenden Sie das Frei-Transformations-Werkzeug (Befehlstaste + T) zum Drehen und halten Sie die Umschalttaste gedrückt, um den rechten Winkel einzufangen (Abb. 5b).
Vergewissern Sie sich, dass die Standardfarben für Schwarz und Weiß aktiviert sind. Gehen Sie zu Filter> Rendern> Fasern, und passen Sie die Einstellungen an, bis Sie mit wenigen Änderungen viele dünne Streifen erhalten (Abb. 5c). Jetzt sehen Sie den Grund, warum wir das Rechteck drehen mussten: Der Filter erzeugte vertikale Fasern, aber wir brauchen sie horizontal.
Drehen Sie nun das Rechteck um 90 Grad zurück in die ursprüngliche horizontale Position. Nennen Sie diese Ebene "brushed_alu" und ändern Sie den Füllmodus in "Bildschirm". Dadurch werden die schwarzen Bereiche ausgeblendet, so dass schöne helle Linien durchscheint (Abb. 5d)..
Jetzt müssen wir die gebürstete Textur so verziehen, dass sie zu unserem Ring passt. Setzen Sie die Deckkraft der Ebene auf 25%, damit der Ring sichtbar wird. Rufen Sie erneut das Free Transform Tool (Befehl + T) auf. Klicken Sie mit der rechten Maustaste, und wählen Sie Warp aus (Abb. 6a)..
Ein Netz wird angezeigt. Ziehen Sie die Griffe und die inneren Punkte manuell nach unten, um das Netz an den Ring anzupassen. Versuchen Sie, einen gleichmäßigen Abstand zwischen den Maschenlinien einzuhalten, damit sich die Ebene korrekt verformt (Abb. 6b)..
Klicken Sie bei gedrückter Befehlstaste auf die Ebene "Ring", verwenden Sie diese Auswahl, um die Ebene "brushed_alu" zu maskieren oder diese Auswahl einfach umzukehren (Befehlstaste + Umschalttaste + I). Drücken Sie dann die Entf-Taste, um alle zusätzlichen Pixel zu entfernen. Was für eine schöne subtile Textur (Abb. 6c)! Wir werden diese Technik jedes Mal wiederholen, wenn wir den gebürsteten Look erzielen möchten.
Schalten Sie die Basisebene wieder ein. Bewegen Sie es unter die Ebene "Ring" und duplizieren Sie es, indem Sie Befehlstaste + J drücken. Skalieren Sie die neue Ellipse etwas nach unten und verschieben Sie sie etwas nach oben. Machen Sie diese Ebene schwarz (Alt + Rücktaste) und rastern Sie sie. Wenden Sie einen Gaußschen Weichzeichner (Filter> Weichzeichnen> Gaußscher Weichzeichner) mit einem Radius von 5 Pixel an. Dies wird der Schatten des Rings sein.
Wenn der Ring und sein Schatten an Ort und Stelle sind, gehen wir weiter zum Reservoir. Duplizieren Sie die "Basis" -Schicht, verschieben Sie sie nach unten und skalieren Sie sie nach oben (Abb. 8a). Nennen Sie diese Ebene "bottom".
Richten Sie ein Raster mit Hilfslinien ein, um die Größe und Position des Reservoirs zu bestimmen. Verwenden Sie immer die Fangfunktion, um Elemente zu skalieren und an den richtigen Ort zu verschieben. Wählen Sie bei aktiviertem Raster das Stiftwerkzeug (P) im Formschichtmodus und zeichnen Sie die Vorderseite des Achtecks (Abb. 8b). Machen Sie eine beliebige Farbe, wir werden es bald genug ändern. Nennen Sie diese Ebene "center".
Duplizieren Sie die Ebene "center", um die Fläche rechts davon zu erstellen. Bewegen Sie es und passen Sie es mit dem Free Transform Tool (Befehl + T) an. Wählen Sie alternativ Verzerrung und Neigung durch Rechtsklick, um die Perspektive zu korrigieren. Nennen Sie diese Ebene "richtig".
Dupliziere und spiegele es, benenne es "left" und verschiebe es nach links von der "center" Ebene. Jetzt müssen Sie nur noch die beiden äußersten Flächen mit der hier beschriebenen Technik hinzufügen. Benennen Sie diese Ebenen als "ganz rechts" und "ganz links".
Lassen Sie uns dem Reservoir etwas Textur geben. Fügen Sie zunächst zu jeder Fläche einen Verlaufsstil für die Verlaufsüberlagerung hinzu, und verwenden Sie dann die in Schritt 5 und 6 erlernte Technik, und fügen Sie eine gebürstete Aluminiumschicht direkt darüber hinzu. Verwenden Sie lineare Farbverläufe von hellen bis mittleren Grautönen, die gedreht werden, um sich mit der Perspektive auszurichten.
Aluminium ist ziemlich reflektierend, daher ist seine Farbe stark von der Umgebung beeinflusst. Es gibt helle und dunkle Objekte, die aus vielen Richtungen kommen, also machen Sie die Farbverläufe nicht gleich. Eine gute Methode, um ein Gefühl von Tiefe zu vermitteln, besteht darin, einen starken Kontrast zwischen zwei benachbarten Gesichtern herzustellen, wie Sie im folgenden Bild sehen können, wo ein wirklich dunkles Grau auf ein wirklich helles trifft. Beachten Sie auch, dass die gebürstete Aluminiumschicht verzerrt ist, sodass die Linien mit der Perspektive fließen.
Bewegen Sie die "Basis" -Schicht unter die Reservoirschichten und füllen Sie die Lücke mit Weiß. Wie zuvor hinzugefügt, fügen Sie einen Verlaufstil für die Verlaufsüberlagerung und eine gebürstete Aluminiumschicht hinzu. Passen Sie auf die Lichtrichtung an: Die rechte untere Ecke sollte hell sein, während die obere linke Ecke dunkel sein sollte. Es ist diese Beständigkeit, die unserer Ikone Realismus verleihen wird. Beachten Sie auch, wie die untere Ebene verdunkelt wurde.
In der realen Welt ist keine Kante vollkommen scharf. Es gibt immer einen dünnen Materialstreifen, an dem sich Gesichter treffen. Um realistisch zu sein, fügen wir diese nette kleine Note hinzu. Duplizieren Sie die "Center" -Fläche, benennen Sie sie in "Highlight" um und reduzieren Sie den Füllwert auf 0%. Dadurch wird der Inhalt der Ebene ausgeblendet, während die Ebenenstile sichtbar bleiben.
Fügen Sie mithilfe der folgenden Parameter einen Strich-Ebenenstil hinzu: Farbe Weiß, Größe 1px, Position Außen und Deckkraft 30%. Fügen Sie dann einen Outer Glow-Stil hinzu: Mischmodus Normal, Farbe Weiß, Deckkraft 50% und Größe 5px (siehe Abbildung). Wiederholen Sie diesen Vorgang für die "linken" und "rechten" Flächen.
Die Highlights laufen nicht über die gesamte Höhe des Reservoirs, daher müssen wir den Boden nach außen hin ausblenden. Fügen Sie die drei Hervorhebungs-Layer in eine neue Layergruppe mit dem Namen "Highlight" ein.
Wählen Sie die Gruppe aus und drücken Sie die Tastenkombination Befehlstaste + E, um sie nach unten zusammenzuführen: Sie haben jetzt eine Ebene ("Highlight"), und die Ebenenstile wurden eingebacken. Drücken Sie Q, um die Schnellmaske aufzurufen, und mit einem weichen, runden Schwarz Pinsel streichen den unteren Teil der Kanten aus.
Verwenden Sie 100% Deckkraft an der Unterseite und verringern Sie sie allmählich, wenn Sie die Kanten nach oben verschieben, um eine schrittweise Auswahl zu treffen. Wenn Sie erneut auf Q drücken, werden die lackierten Teile durch eine umgekehrte Auswahl ausgeblendet. Verwenden Sie es, um die Ebene zu maskieren, und wenden Sie die Maske schließlich an, wenn Sie mit den Ergebnissen zufrieden sind.
Lass uns jetzt die obere Kammer bauen. Erstellen Sie eine neue Ellipse auf dem Ring (Abb. 14a). Dies wird die Basis der Kammer sein. Zeichnen Sie nun wie in Schritt 8 die rechte Mittelmitte des Achtecks. Richten Sie die Hilfslinien ein, aktivieren Sie die Option „Einrasten“ und verwenden Sie das Stiftwerkzeug (P) im Formebenenmodus (Abb. 14b). Duplizieren Sie diese Ebene, drehen Sie sie horizontal und platzieren Sie sie neben der ersten (Abb. 14c)..
Fügen Sie Verlaufsüberlagerungen (Abb. 14d) und die gebürstete Aluminiumstruktur (Abb. 14e) hinzu. Baue die äußersten Gesichter und strukturiere sie auf dieselbe Weise (Abb. 14f). Benennen Sie diese Ebenen jeweils "rechts", "links", "ganz rechts" und "ganz links".
Lassen Sie uns auch einige feine Kanten an der Oberseite hinzufügen. Verwenden Sie dieselbe Technik, die in den Schritten 12 und 13 erläutert wird, aber geben Sie diesmal einen schwarzen Strich für die Schichten "ganz links" und "links" und einen weißen Strich für die Schichten "ganz rechts" und "rechts". Denken Sie daran, dass wir die rechte Seite des Reservoirs zuvor markiert haben?
Gruppieren Sie alle Ebenen mit aussagekräftigen Namen wie "BASE", "RING" und "TOP". Duplizieren Sie die "TOP" -Gruppe und drehen Sie sie vertikal (Abb. 16a). Skalieren Sie es ein wenig vertikal. Zeichnen Sie mit Hilfe unserer hellblauen Freunde (der Guides) ein weißes Achteck zwischen den beiden Oberteile (16b). Verwerfen Sie das Oberteil oben da wir es nicht mehr brauchen.
Duplizieren Sie das weiße Achteck und machen Sie es schwarz (Abb. 17a). Füllen Sie die Lücken an den Ecken des weißen Achtecks (die eingekreisten Bereiche in Abb. 17b). Nehmen Sie eine rechteckige Auswahl für das weiße Achteck vor und dunkeln Sie sie etwas ab, um die Reflexionen der Deckeldicke zu simulieren (siehe das Rechteck in Abb. 17b). Denken Sie daran, die rechte Seite leichter zu halten. Jetzt haben wir einen schönen dünnen Deckel. Zeichnen Sie eine weiße Ellipse etwas oberhalb der Mitte des Deckels. Es ist die Basis des Kunststoffknopfes (Abb. 17b)..
Zeichne jetzt den Deckel nach oben. Zeichnen Sie mit dem Stiftwerkzeug (P) vier Dreiecke (Abb. 18a), kopieren Sie sie und drehen Sie sie auf die andere Seite. Fügen Sie Verlaufsüberlagerungen (Abb. 18b) und die gebürstete Textur (Abb. 18c) hinzu. Der Deckel ist jetzt vollständig.
Für den Knopf duplizieren Sie die kleine Ellipse, vergrößern Sie sie und geben Sie ihr einen Verlaufsüberlagerungsstil (Abb. 19a). Zeichnen Sie ein Trapez auf der rechten Seite (Abb. 19b) und spiegeln Sie es nach links. Rastern Sie beide Ebenen und mischen Sie sie dann in eine. Weisen Sie dieser Ebene eine horizontale Verlaufsüberlagerung zu, damit sie rund erscheint (Abb. 19c)..
Lassen Sie uns nun den Regler hervorheben. Duplizieren Sie die obere Ellipse, setzen Sie den Füllwert auf 0% und geben Sie einen weißen Strich an (Abb. 20a). Legen Sie diese Ebene in eine Gruppe und führen Sie sie zusammen. Geben Sie nun Quick Mask ein und streichen Sie die Teile aus, die wir nicht benötigen (Abb. 20b). Beenden Sie den Schnellmaskenmodus, verwandeln Sie die Auswahl in eine Maske und wenden Sie sie an (klicken Sie mit der rechten Maustaste auf die Maske und wählen Sie Maske anwenden). Fügen Sie einfach etwas Gaußsche Unschärfe hinzu und fertig (Abb. 20c)!
Nun wollen wir noch etwas Scalloping hinzufügen. Zeichnen Sie eine ovale Form in der Mitte (Abb. 21a) und geben Sie ihm einen inneren Schatten (Abb. 21b) und einen Strich (Abb. 21c). Duplizieren Sie diese Ebene zweimal (Abb. 21d). Jetzt fügen Sie alle diese Ebenen in eine neue Gruppe mit dem Namen "KNOB" ein.
Lassen Sie uns eine Reflexion hinzufügen. Duplizieren Sie die Gruppe "KNOB" und führen Sie die resultierende Gruppe "KNOB copy" zusammen. Drehen Sie ihn senkrecht und bewegen Sie ihn hinter und unter dem Knopf (Abb. 22a). Nehmen Sie in Quick Mask eine Farbverlaufsauswahl vor (Abb. 22b) und verwenden Sie sie zum Maskieren der Ebene. Stellen Sie den Mischmodus so ein, dass das Licht und die Deckkraft auf 50% festgelegt werden..
Nun zum Schnabel. Zeichnen Sie eine Reihe von Formen und fügen Sie wie in der Abbildung unten Verlaufsüberlagerungen hinzu. Zum Schluss fügen Sie allen Teilen eine gebürstete Textur hinzu, wie wir es früher gelernt haben. Lege alle diese Layer in die Gruppe "BEAK".
Folgen Sie einem ähnlichen Vorgang, um das Scharnier zu zeichnen. Beachten Sie, dass der kleine Kreis (der Nabe) hat einen dunkelgrauen Strich. Fügen Sie diese Ebenen in eine neue Gruppe mit dem Namen "HINGE" ein.
Um den Griff zu zeichnen, erstellen Sie eine neue schwarze Formebene (Abb. 25a). Optimieren Sie den Pfad, bis Sie damit zufrieden sind, und rastern Sie ihn anschließend. Wählen Sie nun das Color Dodge-Werkzeug (O), wählen Sie einen halbtransparenten, weichen Rundpinsel aus und malen Sie die Lichter auf der Oberseite des Griffs und an den Seiten nach unten, um die Hintergrundbeleuchtung zu simulieren (Abb. 25b) es prominenter (Abb. 25c).
Der Griff hat auch eine Jakobsmuschel. Zeichnen Sie es mit einer Formebene und geben Sie ihm einen subtil weißen inneren Schatten, indem Sie den Mischmodus auf Normal setzen und mit der Deckkraft spielen, bis Sie zufrieden sind (Abb. 25d). Der Griff ist fertig!
Als letzten Schritt setzen wir das Ventil ein. Zuerst ziehen wir die Schraube. Machen Sie eine Formebene und färben Sie sie mittelgrau, erstellen Sie eine hellere Kopie und verschieben Sie sie neben der ersten (Abb. 26a)..
Fügen Sie die restlichen Formen hinzu und decken Sie sie mit Farbverläufen ab, damit sie abgerundet aussehen (Abb. 26b-26e). Zum Schluss alle Teile in eine neue Gruppe mit dem Namen "VENTIL" einlegen, drehen und an der Seite des Reservoirs platzieren (Abb. 26f). Wir sind fertig!
Junge war so langatmig! Es hat sich aber gelohnt, findest du nicht? Nun, da der Moka Express fertig ist, müssen wir ihn nur noch auf 256px (für Vista), 128px (für Dockanwendungen), 48px, 32px und 16px (für die verschiedenen Symbol- / Listen- / Detailansichten in Betriebssystemfenstern) verkleinern. und importieren Sie alle Größen in unsere bevorzugte Symbolbearbeitungssoftware. Ich hoffe, Sie hatten Spaß und haben während dieser Tour de Force viele nützliche Techniken gelernt. Brauen Sie jetzt Ihre eigenen Icons!
Accentsconagua