Share
Was Sie erstellen werdenIn diesem Lernprogramm erstellen wir eine Reihe von flachen Symbolen für Apple Watch, die standardmäßig im Originalmenü der Apple Watch-Startseite angezeigt werden. Wir verwenden grundlegende Formen und Warp-Effekte sowie einige kompliziertere Methoden, um ein modernes Benutzeroberflächen-Design zu erstellen. Lass uns anfangen!
Apple Watch-Symbole sind in einem trendigen flachen Stil gestaltet, der den iOS-Symbolen sehr ähnlich ist, die in den neuesten iOS-Geräten auf iPhone, iPad oder anderen Apple-Geräten zu finden sind. Es gibt jedoch eine auffällige Besonderheit: Die Symbole sind rund. In diesem Lernprogramm verwenden wir ein rundes Raster, um eine einzelne Basis für jedes Symbol zu erstellen. Sie können eine sehr schöne Symbolvorlage in vector herunterladen, um die Arbeit mit ihnen zu erleichtern.
Wenn Sie sich für eine eingehendere Theorie über die Erstellung von Symbolen für die Apple Watch interessieren, würde ich Ihnen dringend empfehlen, die offiziellen Richtlinien und Spezifikationen der Apple Watch Human Interface zu lesen.
Lesen Sie auch diese sehr hilfreichen und beschreibenden Artikel "Erstellen von Symbolen für die Apple Watch" und "Symbole für Apple Watch - The Definitive Guide", in denen die Benutzer ihre kostenlosen Vorlagen und ihr Wissen zum Erstellen benutzerdefinierter Symbole teilen.
Jetzt ist es an der Zeit, die Apple Watch-Symbole zu erstellen! Wenn Sie möchten, dass Ihre Symbole pixelgenauer und lebensechter sind, wie die ursprünglichen Apple Watch-Symbole, finden Sie in Google Images ein Beispielbild des Apple Watch-Startbildschirms. Datei> Platzieren Verwenden Sie es als Vorlage auf Ihrem Artboard, zeichnen Sie Ihre Symbole darüber und behalten Sie die gewünschten Größen und Proportionen. Ansonsten folgen Sie einfach diesem Tutorial als inspirierende Anleitung, nicht als strikte Anweisung zum Erstellen exakter Kopien der Originalsymbole.
Öffnen Sie zunächst eine der Symbolvorlagen (für dieses Tutorial verwenden wir die 80 x 80 px Symbolvorlage für 38 mm sehen). Gehe zu Ansicht> Raster ausblenden das Gitter unsichtbar machen, wenn es Sie ablenkt, aber stellen Sie sicher, dass Sie das Raster haben Smart Guides und Schnappen aktiviert (Sie können sie im selben Menü finden), um die Arbeit mit ihnen zu erleichtern.
Beginnen wir mit dem Erstellen unseres ersten Symbols für die Zeit-App, indem Sie ein 4 x 4 px Kreis sogar in der Mitte der Vorlage. Doppelklicken Sie auf das Ellipsenwerkzeug (L) Um das Popup-Optionsfenster aufzurufen, gehen Sie zum Fenster Ausrichten um den Kreis horizontal und vertikal auf der Zeichenfläche auszurichten. Fülle den Kreis mit Orange (# FF9506).
Verwenden Sie die Rechteckwerkzeug (M) ein erstellen 2 x 40 px Sekundenzeiger unserer Uhr, gefüllt mit derselben orange Farbe, und platzieren Sie sie entlang der zentralen Hilfslinie, wie im Screenshot gezeigt.
Sie können ausrichten die Hand zum Schlüsselobjekt, Klicken Sie bei gedrückter Taste auf den Kreis Alt Schlüssel.
Kopieren Sie den Sekundenzeiger, verkürzen Sie ihn und drehen Sie ihn auf -60 Grad, Platzieren Sie es entlang der Anleitung, wie unten gezeigt.
Jetzt bilden wir den Körper des Minutenzeigers. Machen Sie ein Schwarzes 4 x 30 px Rechteck und verwenden Sie die Live-Ecken Feature, um beide Enden abzurunden, indem Sie die kleinen Kreismarkierungen mit der Direktauswahl-Tool (A) zu ihrem Maximum (2 px Eckradius in unserem Fall).
Legen Sie die Hand entlang der Hilfslinie an die richtige Stelle (Sie können sie etwas kleiner machen, sodass sie in den inneren Kreis der Symbolbasis passt)..
Erstellen Sie ein weiteres Rechteck von 4 x 20 px Größe für den Stundenzeiger. Machen Sie es abgerundet, drehen Sie zu 60 Grad und legen Sie es auf die gegenüberliegende Seite des Minutenzeigers.
Erstellen Sie schließlich eine 80 x 80 px weiße Ellipse mit der Ellipsenwerkzeug (L) für die Symbolbasis und platzieren Sie sie unter allen anderen Objekten. Großartig! Unser erstes Icon ist fertig. Lass uns zum nächsten gehen.
Jetzt erstellen wir das Mail-Symbol. Beginnen Sie mit dem Bilden des Umschlags, indem Sie a 50 x 33 px Rechteck einer beliebigen Farbe.
Fügen Sie ein Dreieck mit hinzu 2 pt Schlaganfall entweder mit einem Polygon-Werkzeug mit 3 Seiten Wert oder mit dem Stiftwerkzeug (P). Objekt> Erweitern das Dreieck, um daraus Kurven zu machen.
Fügen Sie ein weiteres Dreieck auf der oberen Seite der Umschlagbasis hinzu, machen Sie die untere Ecke abgerundet und erweitern Sie die Form. Sie können den oberen und unteren Teil der Rechtecke mit der Taste löschen Radiergummi-Werkzeug (Umschalttaste-E), da wir sie nicht brauchen werden.
Löschen Sie den oberen Teil des unteren Dreiecks mit der Taste Radiergummi-Werkzeug (Umschalttaste-E) und Vereinen beide Teile der Dreiecke in Pfadfinder. Erstellen Sie abschließend eine Kopie der grundlegenden Umschlagform (Control-C> Control-F), Wählen Sie sowohl das Rechteck als auch die obere Form aus und verwenden Sie die Sich schneiden Die Funktion von Pfadfinder die Teile außerhalb des Umschlags abschneiden.
Wählen Sie das Rechteck und die Streifen erneut aus und wenden Sie das an Minus Front Die Funktion von Pfadfinder die Linien ausschneiden. Ändern Sie die Farbe des Umschlags in Weiß und fügen Sie eine Kreisbasis für unser Symbol hinzu.# 2066F0) oben zu hellblau (# 1DD4FD) im unteren.
Unser nächstes Symbol ist für die Musik-App, die aus dem einzigen Element besteht: einem Musiknotenzeichen. Beginnen Sie mit dem Erstellen der Notiz mit einem 27 x 11 px Rechteck. Wählen Sie die Ankerpunkte auf der linken Seite der Form mit Direktauswahl-Tool (A) und ziehen Sie sie nach unten, um die Form zu verzerren.
Verwenden Sie die Rechteckwerkzeug (M) um zwei weitere Formen zu erstellen und das "Bein" der Note zu formen.
Wählen Sie drei Ankerpunkte des unteren Quadrats mit Direktauswahl-Tool (A) und machen sie rund. Dann Vereinen die Formen in Pfadfinder und machen Sie die Ecke zwischen den Formen auch abgerundet Live-Ecken Merkmal.
Fügen Sie den zweiten Teil der Notiz hinzu und machen Sie die Gesamtform glatter und runder. Beenden Sie das Symbol, indem Sie die Basis mit einem linearen Farbverlauf von Orange (# FA5D3B) zu pink (# FF2968).
Jetzt bewegen wir uns zu einer Reihe von Symbolen, die mit der Zeit verbunden sind und alle in einem einzigen Stil erstellt wurden. Beginnen Sie mit der Bildung einer 48 x 48 px sogar Kreis und innen einen kleineren Kreis. Verwenden Sie die Minus Front Die Funktion von Pfadfinder einen Ring erstellen.
Erstellen Sie einen kleineren elliptischen Ring in der ersten Form und fügen Sie zwei gekreuzte Linien hinzu, die in der Mitte ausgerichtet sind.
Fügen Sie im oberen Teil der Form eine horizontale Linie hinzu und biegen Sie sie mit Hilfe von Effekt> Warp> Bogen. Stellen Sie das ein Horizontale Biegung Wert zu -35%.
Fügen Sie eine weitere gebogene Linie im unteren Teil unseres Globus hinzu und beenden Sie dieses Symbol, indem Sie die Globusform erweitern und eine Farbverlaufsbasis mit dunkelorangeem Boden bilden (# ff7632) und hellorangees Oberteil (# ff9408). Fügen Sie einen kleineren Kreis mit dunklerer orange Farbe hinzu (# e45221) und verstecken Sie es hinter der Kugelform, um es kontrastreicher zu gestalten.
Für unser nächstes Symbol - die Stoppuhr - verwenden wir die Basis des World Clock-Symbols, das wir zuvor erstellt haben. Bilden Sie die Mitte der Stoppuhr, indem Sie a 8 x 8 px Ellipse, ausgerichtet mit a 2 x 25 px Rechteck für den Sekundenzeiger der Uhr.
Verwenden Sie die Rechteckwerkzeug (M) um kleine Details zu unserer Stoppuhr hinzuzufügen. Machen Sie die Schaltfläche der Stoppuhr runder, verwenden Sie die Live-Ecken und stellen Sie den Eckenradius auf 1,4 px.
Gehen wir weiter zum Timer-Symbol - es hat dieselbe Basis wie das Stoppuhr-Symbol. Form a 2,5 x 13 px Streifen im mittleren oberen Teil des Rings mit der Rechteckwerkzeug (M). Dann schnapp dir das Polygon-Werkzeug, einstellen der Seiten Menge zu 3, oder benutze die Stiftwerkzeug (P) ein Dreieck bilden. Platziere es so, wie auf einem Screenshot gezeigt, als wäre es ein Stück Kuchen.
Wählen Sie sowohl den weißen Grundring als auch die Form des Dreiecks und verwenden Sie die Minus Front Funktion, um den linken Teil des Rings auszuschneiden. Fügen Sie ein kleines hinzu 6 x 6 px Kreis in der Mitte unseres Symbols.
Drehen Sie den Kreis schließlich so, dass sich der obere Ankerpunkt in etwa befindet 45 Grad nach links. Ziehen Sie den Ankerpunkt mit Direktauswahl-Tool (A), die Form erweitern. Wandelt den ausgewählten Ankerpunkt in eine Ecke um entweder mit hilfe des Konvertieren Schaltfläche im oberen Bedienfeld oder durch Klicken mit der Taste Ankerpunktwerkzeug (Umschalttaste-C), So wird unsere Form zur Uhr einer Uhr.
Unser letztes Symbol in diesem Set ist der Alarm. Es hat die gleiche Basis mit dem weißen Ring wie die vorherigen orangefarbenen Symbole. Die Zeiger der Uhr sind mit zwei schmalen Streifen geformt, die aus der Uhr bestehen Rechteckwerkzeug (M).
Lassen Sie uns den oberen Teil des Weckers bilden, indem Sie mit dem geraden Kreis einen gleichmäßigen Kreis bilden Ellipsenwerkzeug (L) und teilen Sie es in zwei gleiche Teile, indem Sie die seitlichen Ankerpunkte mit der Scherenwerkzeug (C). Platzieren Sie die Hälften oben auf dem Alarm und fügen Sie unten zwei kleine "Beine" hinzu, um das Symbol zu beenden.
Das Maps-Symbol ist ziemlich einfach und enthält nicht so viele Elemente. Beginnen Sie mit der Bildung einer Mitte mit einem 40 x 40 px Kreis eines Blaus (# 087eff) Farbe. Bilden Sie einen Kompasspfeil aus a 17 x 25 px Dreieck nach oben.
Beige hinzufügen (# e5decb) Symbolbasis. Gehe zu Objekt> Pfad> Ankerpunkte hinzufügen undWählen Sie den Ankerpunkt in der Mitte der Unterseite aus und ziehen Sie ihn etwas nach oben, um die Pfeilspitze zu bilden.
Platzieren Sie einen breiten vertikalen Streifen mit einem 26 x 83,5 px Rechteck über das Symbol, und vereinen Sie es mit einem anderen breiten Streifen, indem Sie es senkrecht positionieren. Verstecken Sie die gekreuzte Form hinter dem blauen Kreis mit dem Pfeil. Wählen Sie sowohl die Basis des Symbols als auch die gekreuzten Streifen aus und verwenden Sie die Teilen Die Funktion von Pfadfinder um die Form in drei Teile zu teilen.
Füllen Sie die Teile der Symbolbasis mit grün (# 78c73d) und hellrosa (# fbc7d2) Farben.
Gehen wir zum Wetter-Symbol. Füllen Sie die Grundform des Himmels mit einem linearen Verlauf von dunklerem Blau (# 2066f0) oben zu hellblau (# 1dd4fd) im unteren. Fügen Sie ein Gelb hinzu (linearer Verlauf von # ffc505 zu # fee403) Kreisen Sie die Sonne im linken Teil des Symbols ein. Beginnen Sie, die Wolken mit zwei Kreisen zu bilden: a 25,5 x 25,5 px Kreis in der Mitte der Vorlage und a 21 x 21 px Kreis näher am rechten Teil des Symbols.
Ein ... kreieren 43 x 16 px Rechteck und machen die Ecken mit abgerundet 8 px Eckenradius. Richten Sie das Rechteck an den Kreisen und aus Vereinen alle drei formen in Pfadfinder eine glatte, runde Wolke bilden.
Füllen Sie die Wolke mit weißer Farbe und machen Sie sie halbtransparent Opazität zu 90%.
Gehen wir weiter zum Kamerasymbol. Machen Sie einen grauen Grundkreis, gefüllt mit einem linearen Farbverlauf aus dunkelgrau (# 8e9196) in der Unterseite zu hellgrauem (#dadcdd) und beginnen, die Kamera-Silhouette aus einem dunkelgrauen (# 3c3c3c) Rechteck mit abgerundeten Ecken.
Fügen Sie einen kleineren hinzu 30 x 17 px Rechteck oben und machen die obere linke Ecke mit abgerundet 7 px Eckenradius. Vereinen die Formen und machen die Ecke zwischen den Formen auch abgerundet.
Fügen Sie einen schmalen Streifen im oberen Teil der Kamera hinzu und verwenden Sie die Minus Front Funktion, um es auszuschalten.
Bilden Sie das Auslösersymbol aus einem 9 x 4 px Rechteck und platzieren Sie es in der Mitte unserer Vorlage. Verwenden Sie die Stiftwerkzeug (P) um einen nach unten auf den Auslöser gerichteten Pfeil hinzuzufügen. Stellen Sie das ein Schlaganfallgewicht zu 4 pt und machen die Kappen und die Ecke der Linie im Schlaganfall Panel.
Fügen Sie der Kamera die letzten Details hinzu: bilden Sie ein hellgelbes (# fac81b) Anzeige von a 6 x 6 px Größe. Erstellen Sie weiter einen großen Kreis mit 4 pt Hubgewicht. Platzieren Sie den Kreis in der rechten unteren Ecke der Kamera, wie im Screenshot gezeigt.
Objekt> Erweitern der große Kreis, der ihn zum Ring macht. Wählen Sie sowohl den Ring als auch die Kamera aus und wenden Sie an Minus Front den Ring ausschneiden und das Objektglas formen. Wählen Sie dann alle dunkelgrauen Bereiche unserer Kamera aus und machen Sie sie durch Drücken in eine einzige zusammengesetzte Form Steuerung-8.
Verwenden Sie schließlich die Form-Builder-Werkzeug (Umschalttaste-M) oder der Sich schneiden Die Funktion von Pfadfinder die nicht benötigten Teile der Kamera außerhalb der Basis unseres Symbols abzuschneiden.
Lassen Sie uns ein Handset für das Telefonsymbol erstellen. Erstelle ein 8 x 40 px Rechteck und verwenden Sie ein Arc Warp-Effekt mit 27% Vertikale Biegung Wert, um das Rechteck nach links zu biegen. Addiere zwei 17 x 20 px Rechtecke im oberen und unteren Teil des Mobilteils. Die Ecken werden abgerundet, sodass die Formen glatt sind. Vereinen alle Teile des Mobilteils ein Pfadfinder.
Glätten Sie die linke Seite des Mobilteils, indem Sie die nicht benötigten Ankerpunkte mit löschen Ankerpunktwerkzeug löschen (-) und die inneren Ecken mit der Live-Ecken Merkmal. Drehen Sie schließlich das Telefon auf 45 Grad und platziere es über der Symbolbasis, gefüllt mit einem linearen Farbverlauf von hellem Grün (# 86fb71) zu dunklerem Grün (# 0fd51c).
Bilden wir das Nachrichtensymbol auf derselben grünen Basis, die wir zuvor verwendet haben. Mach ein 40 x 40 px weißen Kreis und erweitern Sie es ein wenig zu den Seiten, so dass die Form zusammengedrückt wird 48 x 40 px. Fügen Sie ein kleines Dreieck unter der weißen Form hinzu und bilden Sie eine Sprechblase. Machen Sie die untere Ecke des Dreiecks leicht abgerundet. Verwenden Sie die Arc Warp-Effekt mit -36% vertikale Biegung Wert, um das Dreieck leicht gewölbt zu machen.
So sieht das fertige Symbol aus.
Unser nächstes Symbol ist das Remote-App-Symbol, das ebenfalls sehr einfach ist und aus einem einzigen Element besteht. Bilden Sie zunächst eine Farbverlaufsbasis (aus dunkelblau) # 2066f0 in der Unterseite zu hellem Blau # 1dd4fd) oben drauf. Fügen Sie weißen Strich mit hinzu 5,3 pt Hubgewicht und Ausrichten es nach innen. Platzieren Sie eine 30 x 30 px weißes Dreieck in der Mitte unseres Symbols.
Zum Schluss machen Sie die Ecken des Dreiecks mit a 2,5 Eckenradius. Großartig! Das Symbol ist fertig, also machen wir weiter.
Das Workout-Symbol zeigt eine stilisierte Silhouette eines laufenden Mannes. Erstellen Sie eine helle Symbolbasis, die mit einem linearen Farbverlauf von gelblich-grün (# c2ec38) oben bis grün unten (# a3fc3f).
Nehmen Sie die Stiftwerkzeug (P) und erstellen Sie separate Linien für die gebogenen Arme, Beine und Rumpf mit 3 pt Hubgewicht und abgerundete Kappen und Ecken. Erhöhen Sie die Dicke des Schlaganfallgewicht der Torso-Linie zu 6 pt und fügen Sie ein 9 x 9 px Kreis für den Kopf.
Objekt> Erweitern die Linien und füllen Sie die Formen mit schwarzer Farbe.
Das Einstellungssymbol besteht aus einem Zahnrad. Bilden Sie die Zahnbasis aus a 48 x 48 px Kreis mit einem ausgeschnittenen Mittelpunkt, so dass ein Ring entsteht. Fügen Sie drei Zeilen mit hinzu 3 pt Hubgewicht, verbunden in der Mitte der Symbolvorlage.
Jetzt müssen wir die Wellen in unser Zahnrad einbauen. Form a 5 x 9 px Rechteck und machen den oberen Teil etwas schmaler. Machen Sie die oberen Ecken mit abgerundet 1.6 Eckenradius. Platzieren Sie die Wellen auf dem oberen und unteren Teil der Zahnbasis.
Lass uns die verwenden Werkzeug drehen (R) um weitere Elemente hinzuzufügen. Wählen Sie beide Wellen aus, und doppelklicken Sie auf Werkzeug drehen (R) um das Popup-Optionsfenster aufzurufen, und legen Sie das fest Drehen Wert zu 360/18. Auf diese Weise berechnet Adobe Illustrator automatisch den richtigen Wert für 18 Formen. Drücken Sie die Kopieren Taste.
Drücken Sie Steuerung-D mehrmals, um unsere letzte Aktion zu wiederholen und weitere Elemente hinzuzufügen. Wählen Sie zum Abschluss dieses Symbols alle Wellen aus, und ändern Sie die Füllfarbe auf Weiß und Drehen sie alle zusammen durch -10 Grad.
Unser nächstes Symbol ist eine stilisierte Blume für die Foto-App. Beginnen Sie damit, das Blütenblatt aus a zu formen 20 x 30 px Rechteck und machen die Ecken mit abgerundet 10 px Eckenradius. Duplizieren Sie das Blütenblatt und platzieren Sie seine Kopie im unteren Teil der Symbolvorlage, wie in der Abbildung unten gezeigt. Wählen Sie beide Blütenblätter aus und verwenden Sie die Werkzeug drehen (R) acht weitere Kopien der Blütenblätter zu machen, indem Sie die 360/8 Winkel Wert und Drücken der Kopieren Taste.
Drücken Sie Steuerung-D mehrmals, um die Blume mit acht Blütenblättern zu bilden. Wechseln Sie die Blütenblätter auf Multiplizieren Sie den Mischmodus und senken Sie die Opazität zu 80%. Wenden wir die entsprechende Farbe auf jedes Blütenblatt an, beginnend mit dem oberen mittleren und im Uhrzeigersinn bewegend: orange (# fa9700), Gelb (# f0e22c), Grün (# b5d558), türkis (# 6ec19d), Blau (# 71b5e1), violett (# 8f60c3), Rosa (# d782a4) und Rot (# ff2c2c).
Legen Sie die Blume auf die weiße Symbolbasis.
Das Aktiensymbol besteht aus einem minimalistischen Diagramm. Beginnen Sie mit der Formung des Diagramms, indem Sie ein hellblaues (# 02a6f5) vertikale Linie von 3 pt Größe mit der Linienwerkzeug (\). Platziere es in der Mitte unserer Vorlage auf einem dunklen (# 3f3f3f) Symbolbasis.
Fügen Sie einen kleinen blauen Kreis über der Mitte der Vorlage hinzu und wenden Sie einen dunkelgrauen (# 3f3f3f) 1 Punkt Schlaganfall um es visuell von der Linie zu trennen. Fügen Sie auf beiden Seiten des Symbols vier weitere Zeilen hinzu, mit einem helleren Grau (# 555555) 3 pt Schlaganfall.
Objekt> Erweitern die Linien und schneiden Sie die nicht benötigten Teile außerhalb der Symbolbasis ab, entweder mit der Form-Builder-Werkzeug (Umschalttaste-M) oder mit hilfe der Pfadfinder.
Beenden Sie das Symbol, indem Sie eine mit Zickzack versehene Linie mit einfügen 1,5 pt Hub für die Grafik mit der Stiftwerkzeug (P). Erweitern Sie die Linie und passen Sie sie an die Symbolbasis an.
Das Aktivitätssymbol ist komplizierter und interessanter zu gestalten. Es besteht aus drei bunten Farbverläufen. Um einen solchen Kreis zu bilden, müssen wir zuerst eine Mischgruppe bilden.
Machen Sie zwei gleich 6 x 7 px Rechtecke aus Rosa (# ff2b91) und Rot (# f1281e) Farben. Wählen Sie die Rechtecke aus und gehen Sie zu Objekt> Überblenden> Erstellen. Sie können die Einstellungen in bearbeiten Objekt> Überblenden> Überblendoptionen, bewirbt sich Glatte farbe eine schöne nahtlose Mischung machen. Ziehen Sie die erstellte Mischgruppe auf die Bürsten Panel und erstellen Sie ein neues Kunstpinsel mit Standardeinstellungen.
Erstellen Sie ein Dunkelgrau (# 393839) Kreisbasis für unser Symbol und platzieren Sie einen weiteren Kreis darauf, indem Sie unseren Pinsel als Schlaganfall. Passen Sie die Größe des Kreises an, damit er an die äußere Kante der Symbolvorlage passt. Stellen Sie das ein Schlaganfallgewicht zu 1 Punkt und Objekt> Darstellung erweitern den Pinselstrich in a verwandelngestalten. Drehen oder drehen Sie die Form mit der Taste Werkzeug reflektieren (O) horizontal, falls erforderlich, so dass wir links die rosa Seite des Kreises und rechts die rote Seite haben.
Erstellen Sie ein kleines Rosa (# ff2b91) einkreisen und im oberen mittleren Bereich des Farbrings platzieren, so dass er sich der Höhe der Form anpasst und die Verbindung der beiden Farben verdeckt.
Jetzt müssen wir dem Ring eine Dimension hinzufügen, indem wir einen subtilen Schatten bilden. Wie Sie vielleicht bemerken, wurde der Ring nach dem Ausbau in mehrere Teile aufgeteilt. Genau das brauchen wir! Wähle das obere rote Stück des Rings aus, Kopieren es und Einfügen vor (Control-C> Control-F). Füllen Sie die Kopie mit einem linearen Farbverlauf von Dunkelrot (# a11b17) auf weiß und wechseln zu Multiplizieren Sie den Mischmodus, Dadurch wird die weiße Spitze des Farbverlaufs unsichtbar.
Verwenden Sie die gleiche Technik, um zwei weitere bunte Ringe in der ersten Form zu erstellen. Erstellen Sie die Kunstpinsel aus einem gelben (# d8ff06) und Grün (# 86e402) Mischgruppe und aus einem Türkis (# 06ffaa) und Blau (# 06e3f9) mischen. Beenden Sie das Symbol, indem Sie Kreise hinzufügen und sanfte Schatten anwenden.
Das nächste ist das Sparbuch-Symbol, das aus vier kleinen Piktogrammen besteht: einer Kreditkarte, einem Flugzeug, einer Filmkamera und einer Kaffeetasse. Diese Piktogramme sind minimalistisch und bestehen aus Grundformen mit Hilfe von Pfadfinder und Live-Ecken Merkmal. Unten sehen Sie einen Schritt-für-Schritt-Screenshot, der zeigt, wie die Formen für jedes Piktogramm kombiniert werden.
Die Basis des Symbols besteht aus vier Streifen unterschiedlicher Farbe: Rot (# ff4e46), Blau (# 439eca), Grün (# 3dca36) und orange (# ffa02b), jeder von 20 px Höhe. Erstellen Sie einen Standard 80 x 80 px Kreisbasis für unser Symbol und löschen Sie nicht benötigte Streifen mit Hilfe des Symbols Form-Builder-Werkzeug (Umschalttaste-M) Wählen Sie alle Objekte aus und klicken Sie bei gedrückter Taste auf die unerwünschten Teile Alt Schlüssel.
Bilden Sie einen Abend 3,5 x 3,5 px kreisen Sie, kreuzen Sie die Oberseite des orangefarbenen Streifens und kopieren Sie ihn nach rechts, indem Sie beide gedrückt halten Alt und Verschiebung und ziehen Sie die Form. Drücken Sie Steuerung-D mehrmals, um weitere Kopien des Kreises zu erstellen. Wählen Sie dann alle Kopien aus und verwandeln Sie sie in eine Zusammengesetzter Pfad durch Drücken Steuerung-8. Wähle ausKreise und den orangefarbenen Streifen und wenden Sie die Minus Front Funktion zum Ausschneiden der Löcher, wodurch der Streifen perforiert wird.
Platzieren Sie zum Schluss die zuvor erstellten Piktogramme und richten Sie sie auf die Mitte unseres Symbols aus.
Das letzte Symbol unseres Sets ist das Kalendersymbol. Es besteht aus Text, der mit Helvetica Neue Schrift und einer einfachen weißen Symbolbasis erstellt wurde.
Dies war eine lange, aber aufregende Suche! Wir haben insgesamt 20 Home-Screen-App-Icons erstellt, die grundlegende Formen, Warp-Effekte sowie einige Tricks und Effekte verwenden. Ich hoffe, es hat Ihnen Spaß gemacht, diesen Leitfaden zu befolgen und einige nützliche Techniken zu finden. Viel Glück bei deinen Designs!
Accentsconagua