Erstellen Sie eine Reihe von Frühstückspixel-Symbolen in Adobe Photoshop

Was Sie erstellen werden

Beginnen Sie Ihren Tag mit einigen Pixelkunst-Motiven zum Frühstück! In Adobe Photoshop gezeichnet, dienen diese süßen Kreationen als Desktopsymbole, Avatare oder Spielsymbole. Lernen Sie die Grundlagen der Formerstellung, des Anti-Aliasing und der Farbauswahl.

1. Toast es!

Schritt 1

Wir beginnen einfach und langsam mit der grundlegenden Umrisslinie der Toastform. Ein ... kreieren Neues Dokument im Adobe Photoshop. Ich neige dazu, Pixel-Art-Designs in einem zu erstellen 200 x 200 Raum, mit dem Hintergrund auf Transparent. Verwenden Sie die Bleistiftwerkzeug (B) an setzen 1 Pixel und fange an, folgendes zu zeichnen:

  1. Sieben Pixel über.
  2. Ein auf beiden Seiten diagonal nach oben.
  3. 11 Pixel auf beiden Seiten bilden den Rest der oberen Kante. Runden Sie die Ecken mit ab zwei diagonale Pixel auf jeder Seite. Zehn auf jeder Seite nach unten, bevor wir in die Basis der Brotform gelangen.
  4. Zwei unten diagonal, und 20 auf beiden Seiten nach unten.
  5. Zwei runter und zwei über, um den Boden abzurunden. 
  6. Füllen Sie den Rest des Platzes mit 23 über.

Schritt 2

Das grundlegende Design des Brotes umfasst vier Farben:

  • Dunkelbraun für die Umrisse: R: 108 G: 013 B: 003.
  • Mittel braun für die Außenseite der Kruste: R: 182 G: 090 B: 020.
  • Braun für den Rest der Kruste: R: 214 G: 123 B: 027.
  • Bräunen für das Innere des Brotes: R: 250 G: 211 B: 127.

Stelle das Mittel braun um die Ränder des Toasts. Braun wird weiter die Grenzen der Kruste ausfüllen. Verwenden Sie an dieser Stelle die Farbeimerwerkzeug (G) das Brotstück mit füllen Bräunen.

Schritt 3

  1. Dieses Brot wird ohne einen schmelzenden Butterkloß einfach nicht komplett sein. Mach ein Neue Schicht, in dem Schichten Panel, bevor Sie Ihre Butter zeichnen.
  2. Verwenden Sie eine helle, Hahnenfuß Gelb die Form der geschmolzenen Butter mit zeichnen Bleistift-Werkzeug
  3. Im Gegensatz zum Toast müssen seine Ränder mit den im letzten Schritt verwendeten Brauntönen definiert werden. 
  4. Beachten Sie, wie die dunkelsten Farben um die Ecken und vertikalen Kanten hinzugefügt werden. 
  5. Legen Sie die Butter in die Mitte des Toasts.
  6. Weiße und leichte Sahne werden für Highlights auf Butter und Brot verwendet.
  7. Wählen Dunkelbraun für Ihre Bleistiftfarbe und reduzieren Sie die Deckkraft auf 30-50%. Umreißen Sie den Toast mit dunkleren Farben in den Ecken der Pixelform, um die scharfe Kante zu mildern.

2. Ich mache Waffeln!

Schritt 1

Die Waffelform ist ziemlich einfach: Ein abgerundetes Quadrat. Anfangs entschied ich mich für die Ecken zwei diagonale Pixel so blieb die waffel sehr quadratisch. Später habe ich es geändert zwei horizontal, eine Diagonale, und zwei vertikale Pixel für die Ecken. 

Schritt 2

Für die Füllfarbe der Waffel habe ich gewählt R: 241 G: 180 B: 99. Die Schattenfarben sind Braun und Mittel braun von Abschnitt 1, Schritt 2. In dem Schichten Panel, machen Sie eine Neue Schicht und klein zeichnen sechs mal sechs Quadrate, wobei das Eckpixel gelöscht wurde, um das Waffelmuster zu bilden.

Schritt 3

Ich finde es am einfachsten, in so einem Design Kopieren (Control-C) und Einfügen (Kontrolle-V) Die quadratischen Formen bilden ein Gitter um die Waffelbasis. Benutzen Bräunen um das Muster hervorzuheben, und Mittel braun Tiefe anzeigen. 

Schritt 4

Das Verfahren zum Ziehen des Butterklopfens und das Anti-Aliasing der äußeren Waffelkante sind dieselben wie beim Toast Abschnitt 1, Schritt 3.

3. Toast dieses Gebäck

Das Design des Toasters ist ebenfalls recht einfach: ein abgerundetes Rechteck (beachten Sie das zwei unten, zwei quer Ecken), wobei die obere rechte Ecke aus sechs diagonale Pixel, die einen "Biss" aus dem Teig bilden.

Schritt 2

Ähnlich wie beim Toastdesign beginnt dieses Toaster-Gebäck mit den äußeren Rändern Braun und Bräunen. Ich fing an, den "Biss" in zu umreißen Braun um sicherzugehen, dass der Bereich definiert ist, und um einen Schattenbereich für die bald tropfende "Geleefüllung" zu erstellen.

Schritt 3

Der Zuckerguss ist weiß, daher sind die Schatten auf dem Zuckerguss sehr hellblau. Beachten Sie, wie einige der Zeilen "gedithert" werden. Dithering ist in Pixelkunst eine Technik, bei der ein Muster (rauschartig) erstellt wird, um einen Bereich zu schattieren oder hervorzuheben, ohne die Farbzahl zu erhöhen.

Die Streusel sind gerade vier bei vier Farbfelder oder einzelne Pixel sind verstreut. Vergessen Sie nicht, den gesamten Zuckerbereich mit Weiß auszufüllen, falls Sie die Grafik später als transparente Datei speichern.

Die "Jelly" -Füllung ist hellrosa, mit Akzenten in Dunkelrosa und Pink. Vergessen Sie nicht, Ihr Gebäck in Dunkelbraun anzufassen 30-50% Opazität um die Ecken leichter mischen zu lassen.

4. Eier, Sunnyside Up!

Schritt 1

Die Ei-Symbolform ist ein Kompromiss zwischen einem richtigen Spiegelei (das überall vorhanden wäre) und einem perfekten Kreis (der selbst für diese kleinen Pixel-Designs zu künstlich erscheint). Die Pixelanzahl lautet wie folgt:

  • Zehn Pixel breit.
  • Überspringen Sie ein Pixel und platzieren Sie drei auf beiden Seiten in der nächsten Zeile.
  • Zwei Pixel diagonal von den letzten drei und ein weiteres diagonal. 
  • An dieser Stelle wiederholen Sie, was bereits getan wurde. Setzen Sie jedoch zuerst vier Pixel an 50% Deckkraft in den fehlenden Ecken (siehe unten). Vervollständige den Kreis.

Schritt 2

Fangen wir einfach mit dem Eigelb an, da im Vergleich zu den anderen bisher gezeichneten Symbolen viel zum Rendern des Eies verwendet wird. Drei Farben bilden das Eigelb-Design.

  • Mittel braun in der unteren Hälfte: R: 182 G: 090 B: 020.
  • Gelber Ocker auf den Seiten: R: 255 G: 150 B: 57.
  • Gelb für den Rest: R: 251 G: 208 B: 59.

Schritt 3

Die Bilder können komplizierter erscheinen, als sie wirklich sind. Ich habe das gleiche Lichtblau vom Toaster verwendet Sektion 3, aber variierte seine Deckkraft während Schattieren und Dithering. Das gleiche gilt für Dunkelbraun, was reicht in Opazität von 20% -50% und ist über Weiß oder Blau (auf der Unterseite des Eies) geschichtet. Ich machte das Ei weiter mit Gelb, Sahne und Weiß.

Das Anti-Aliasing um die äußeren Ränder des Eies erfolgt in drei Schritten: Ecken sind 50% Deckkraft, ein paar Pixel neben jeder Ecke ist 30% Deckkraft, und der Rest ist 10-20% Opazität.

5. Frischen Sie etwas Speck auf

Schritt 1

Ich entschied mich für einen dicken, kurzen Schnitt Speck, anstatt etwas Realistischeres. Dieses Symbol ist zwar dünner und größer als die anderen Symbole, aber ich wollte diese Ungleichheit nicht extremer machen, wenn sie zusammengestellt werden.

Verwenden Sie die Bleistift-Werkzeug zeichnen vier Pixel, dann drei nach unten und zum Recht auf der diagonal, und vier Pixel nochmal. 

Die linke Ecke ist abrupt sechs Pixel Nieder, vier diagonale zum linkssieben Pixel nach untendrei Nieder, und schlussendlich, vier nach unten.

Die rechte Seite ist drei zum Rechtein auf der diagonal,sechs unten, zwei auf der diagonal zum links, vier nach unten, und acht unten zum Recht.

Kopieren und Einfügen dieser obere Abschnitt, gehe zu Bearbeiten> Transformieren> Vertikal spiegeln umzudrehen und mit der oberen Hälfte zu verbinden. Zusammenführen (Control-E) die kopierte Ebene in die ursprüngliche Ebene und lassen Sie uns das Specksymbol rendern.

Schritt 2

Verwenden Sie die Farbeimer Werkzeug den Speck mit füllen Ziegelrot (R: 204 G: 0 B: 0). Zeichnen Sie Wiggley-Streifen mit Weiß an 50% Deckkraft. Schattieren Sie die Ränder des Specks mit Dunkelbraun beim 50% Deckkraft.

Schritt 3

Markieren Sie die Streifen mit Weiß beim 30%, 20% und 100% Opazität. Für kleine glänzende Spitzen am Speck fügen Sie ein paar Pixel um die Kanten an 80% Deckkraft.

Schritt 4

Für eine einfachere Möglichkeit, eine Gliederung hinzuzufügen, benutze die Zauberstab-Werkzeug (W) außerhalb des Specksymbols auswählen. Gehe zu Wählen Sie> Ändern> Vertrag und eintreten 1 PixelUmkehren das Auswahl (Shift-Control-I). Ein ... kreieren Neue Schicht unter der Speckschicht, in der Schichten Panel und füllen Sie Ihre Auswahl mit Dunkelbraun beim 30% Opazität. Stapeln Sie durchscheinende braune Pixel in den Ecken, um die Kanten des Speck-Symbols zu mildern. Wenn zufrieden, Zusammenführen (Control-E) ausgewählte Speckschichten, in der Schichten Panel.

Guten Morgen, du bist fertig!

Erweitern Sie Ihre Frühstückssymbole mit Obst, Kaffee, Saft und mehr. Dieses Set orientiert sich an amerikanischen Frühstücksnahrungsmitteln. Wenn Sie sich also außerhalb der USA befinden oder Ihr Leben von anderen Kulturen beeinflusst wurde (egal, ob Sie Ihre eigene oder die andere ist), fordere ich Sie auf, kleine Symbole für diese leckeren Gerichte zu machen. Gehen Sie noch einen Schritt weiter und machen Sie aus jedem Lebensmittel in Ihrer Küche Symbole. Viel Spaß beim Pixeln, Leser!