Others – Wetter Icon Vektoren

Ich bin die Tage über ein Tutorial für den Adobe Illustrator gestolpert. Daher zeig ich euch hier mal wie diese Icons mit Photoshop gemacht werden.

[Bild: 64d7fbbn.png]

Das Tutorial ist recht lange, da ich jeden Icon einzeln erkläre Happy aber nur keine Angst davor, die einzelnen Icons sind recht schnell gemacht. Es sieht nur viel aus.

REGENBOGEN ICON

Für den Regenbogen mache ich zuerst eine Runde Form auf meinen Hintergrund. Um den Kreis absolut rund zu bekommen muss ich, die Shift Taste gedrückt halten wärend ich das Elipsen-Werkzeug benutze. Ich hab mal keinen Hintergrund, da ich es später ja als PNG speichern möchte.

[Bild: gothdlzj.png]

Da ich einen Regenbogen haben mag und keinen platten Kreis muss ich die Füllfarbe und die Konturen verändern. Die Dicke der Kontur leg ich bei mir bei ca 22px fest.

[Bild: 2vata3kv.png]

Damit ist die Farbe dann in einem Außenkreis und nicht mehr komplett auf der ganzen Fläche

[Bild: mcrztfdi.png]

Ich dupliziere den Kreis einmal und verändere die Farbe der Kontur. Dann verkleinere ich den Kreis etwas

[Bild: bbzz8jpb.png]

Das wiederhole ich insgesamt 5 mal so das ich 6 Farbstreifen habe

[Bild: yj7b38ko.png]

Ich reduziere alle auf eine Ebene und nehme das Auswahlwerkzeug und markiere die hälfte des Kreises

[Bild: 58fwnu87.png]

Dann nehme ich die markierte Seite weg

[Bild: z69k599g.png]

Jetzt nehme ich das Elipsen-Werkzeug aus meiner Werkzeugleiste und eine hellblaue Farbe und mache unten an den Regenbogen einen kleinen Kreis

[Bild: f9nlfli2.png]

Das wiederhole ich zwei mal und mache beide Kreise unterschiedlich groß, so das ich am Ende keine kleine Wolke am Fuße des Regenbogens habe.

[Bild: haldipv9.png]

Ich dupliziere die drei Kreise und schiebe das Duplikat von allen auf die andere Seite des Regenbogens.

[Bild: ekhy3mse.png]

Ich nehme erneut das Elipsen-Werkzeug und mache einen Runden Hintergrund hinter den Regenbogen.

[Bild: r64fvbpb.png]

Ich nehme eine Farbe die einen hauch dunkler ist als mein Hintergrund und mache mit dem Rechteck-Werkzeug nun ein Viereck auf meinen Regenbogen. Ich lege das Viereck hinter meinen Regenbogen.

[Bild: kb3a5lfx.png]

Ich mache aus dem Viereck eine Schnittmaske so das es nur auf den Kreis angewand wird

[Bild: 84396fcy.png]

Diesem Viereck geben ich eine Ebenemaske und nehme die Übersetehenden Kanten weg, so das es aussieht als wenn der Regenbogen einen Schatten wirft.

[Bild: zpcwkgrh.png]

 

SONNEN ICON

Auch hier mache ich zuerst wieder einen Kreis mit dem Elipsen-Werkzeug. Diesmal möchte ich ihn mit voller Füllfarbe haben.

[Bild: mn6hgsgb.png]

Dann suche ich mir in meinen Formen ein Dreieck und mache mit dem Eigene-Form-Werkzeug

[Bild: tdhokrtm.png]

und mache dann in einer etwas dunkleren Farbe als den Kreis ein Dreieck.

[Bild: tbbnbfgy.png]

Das Dreieck dupliziere ich dann insgesamt 7 mal und arrangiere sie einmal um den Kreis, so das es wie die Sonnenstrahlen aussieht

[Bild: twca47kr.png]

Ich nehme erneut das Elipsen-Werkzeug und mache einen Runden Hintergrund hinter der Sonne.

[Bild: ur4lmplo.png]

Ich nehme eine Farbe die einen hauch dunkler ist als mein Hintergrund und mache mit dem Rechteck-Werkzeug nun ein Viereck hinter meine Sonne

[Bild: ng6yorgt.png]

Ich mache aus dem Viereck eine Schnittmaske so das es nur auf den Kreis angewand wird.

[Bild: r8hmiytq.png]

Diesem Viereck geben ich eine Ebenemaske und nehme die Übersetehenden Kanten weg und auch in der mitte in der Lücke zwischen großem Kreis und Dreiecken.
So sieht es aus als wenn die Sonne einen Schatten wirft.

[Bild: iu9bw67r.png]

 

REGENWOLKEN ICON

Für die Regenwolke Starte ich mit einem kleinen hellblauen Kreis. Daneben mache ich einen größeren Kreis in der selben Farbe und danachebn noch mal zwei Kreise die immer kleiner werden. So das es aussieht wie eine Regenwolke.

[Bild: 5nzibzej.png]

Ich reduziere die Ebene alle auf eine und gebe der Wolke dann eine Ebenemaske. Dann nehme ich das Rechteckwerkzeug und markiere den unteren Teil der Wolke.

[Bild: 2nin3pll.png]

Ich nehme den unteren Teil dann weg.

[Bild: zq2imbrb.png]

Nun nutze ich das Eigene-Form-Werkzeug und suche mir dort einen Tropfen aus. Ich mache einen Tropfen unter meine Wolke.

[Bild: tdhokrtm.png]

 

[Bild: epofb7lq.png]

Dann dupliziere ich den Tropfen und packe einige unter meine Wolke

[Bild: 2wd97ysr.png]

Ich nehme erneut das Elipsen-Werkzeug und mache einen Runden Hintergrund hinter die Wolke.

[Bild: rk76z2ak.png]

Ich nehme eine Farbe die einen hauch dunkler ist als mein Hintergrund und mache mit dem Rechteck-Werkzeug nun ein Viereck hinter meine Wolke.

[Bild: nlcffuws.png]

Ich mache aus dem Viereck eine Schnittmaske so das es nur auf den Kreis angewand wird.

[Bild: mxfwr4ej.png]

Diesem Viereck geben ich eine Ebenemaske und nehme die Übersetehenden Kanten weg. So sieht es aus als wenn die Wolke einen Schatten wirft.

[Bild: fuf9tihe.png]

 

REGENSCHIRM ICON

Für den Regenschirm mache ich zuerst auch einen Kreis, den ich dann mit dem Auswahlwerkzeug halbiere

[Bild: m8q2i4kn.png]

 

[Bild: 9zy28lyp.png]

Nun mache ich fünf nebeneiannder liegende Kreise. Die die ganze breite des Regenschirms einnehmen.

[Bild: i28mpk6u.png]

 

[Bild: z49v5m5c.png]

Diese Kreise fasse ich auf eine Ebene zusammen und markiere sie dann

[Bild: udsp54um.png]

Nun blende ich die Kreise aus so das nur der Halbkreis mit der Auswahl stehen bleibt
Und dann nehme ich die Auswahl weg. So entsteht ein Regenschirmeindruck.

[Bild: imhhakew.png]

Ich erstelle mit dem Elipsen-Werkzeug ein längliches Oval, bei dem ich nur die Konturen farblich mache und nicht die Innenfläche

[Bild: f3evjpks.png]

Ich gebe dem Oval eine Ebenemaske und nehme den Oberen Bogen weg

[Bild: hlwmhf6e.png]

Und die linke Seite. Danach liege ich das Oval hinter den Halbkreis

[Bild: fdyq6c7l.png]

Ich nehme erneut das Elipsen-Werkzeug und mache einen Runden Hintergrund hinter der Schrim.

[Bild: kdz5ji7i.png]

Ich nehme eine Farbe die einen hauch dunkler ist als mein Hintergrund und mache mit dem Rechteck-Werkzeug nun ein Viereck hinter meinen Schrim.

[Bild: uophn28b.png]

Ich mache aus dem Viereck eine Schnittmaske so das es nur auf den Kreis angewand wird.

[Bild: 9ov5vwkm.png]

Diesem Viereck geben ich eine Ebenemaske und nehme die Übersetehenden Kanten weg. So sieht es aus als wenn der Schrim einen Schatten wirft.

[Bild: cwmgvh6n.png]

Und damit sind alle vier Icons fertig.

[Bild: 64d7fbbn.png]

>> Back to Others