Share
Avec des formes simples et des dégradés, ce tutoriel simple vous montrera comment créer une icône de réveil. Nous utiliserons Illustrator CS4 pour ce didacticiel, mais ceux d'entre vous qui possèdent une version plus ancienne devraient également pouvoir suivre. Passons à ce didacticiel, que les illustrateurs débutants trouveront particulièrement utile!
Vous trouverez ci-dessous la dernière icône sur laquelle nous allons travailler. Vous voulez accéder à l'intégralité des fichiers Vector Source et aux copies téléchargeables de chaque didacticiel, y compris celui-ci? Rejoignez Vector Plus pour seulement 9 $ par mois.
Notre éditeur, Sean Hodge, a créé ce didacticiel vidéo pour compléter ce didacticiel texte + image..
Créez un nouveau document et utilisez l'outil Ellipse (L) pour créer une ellipse de 280 px par 280 px..
Dans le panneau Dégradé, remplissez l'ellipse avec un dégradé linéaire sans trait. Changez le premier Color Stop du dégradé en gris et le second Color Stop en gris foncé. À l'aide de l'outil Dégradé (G), cliquez en haut de l'ellipse et faites glisser vers le bas pour créer la couleur grise en haut de l'ellipse..
Sélectionnez votre ellipse et choisissez Objet> Chemin> Décalage. Dans la boîte de dialogue Décalage, réglez le décalage sur -5 px..
Sélectionnez l'ellipse de décalage et ajoutez quatre arrêts de couleur au dégradé linéaire dans le panneau Dégradé. Pour ce faire, cliquez entre les deux palettes de couleurs, juste en dessous du curseur de dégradé. Changez le premier Color Stop en blanc, le second en gris clair, le troisième en gris foncé, le quatrième en gris et le dernier en gris foncé plus clair que le troisième en gris foncé.
L'ellipse des quatre couleurs d'arrêt étant toujours sélectionnée, choisissez Objet> Chemin> Décalage et dans la boîte de dialogue Décalage, réglez le décalage sur -15 px..
Remplissez la nouvelle ellipse avec un dégradé linéaire à deux couleurs, le premier étant blanc et le second gris..
Sélectionnez la dernière ellipse et choisissez Objet> Chemin> Décalage. Dans la boîte de dialogue Décalage, réglez le décalage sur -5 px. Changez le premier Color Stop du dégradé en gris foncé et le second en gris encore plus foncé.
Là encore, sélectionnez la dernière ellipse et choisissez Objet> Chemin> Décalage, puis dans la boîte de dialogue Décalage, réglez le décalage sur -5 px. Changez le remplissage en dégradé radial depuis le panneau de dégradé, et faites en sorte que la première couleur s'arrête en blanc et la seconde en gris. Ensuite, dans le champ Emplacement du panneau Dégradé, définissez la valeur sur 87%..
Avec l'outil Segment de ligne, créez une ligne haute de 15 px au milieu et vers le haut de la dernière ellipse excentrée. Dans le panneau Contour, cliquez sur l'icône Cercle arrondi pour arrondir les extrémités de la ligne. Avec l'outil de sélection (V), maintenez les touches Maj + Alt enfoncées et faites glisser une copie de la ligne vers la moitié inférieure de l'ellipse. Sélectionnez les deux lignes et regroupez-les (Commande + G).
Sélectionnez les lignes groupées et choisissez Effet> Déformer et transformer> Transformer pour afficher la boîte de dialogue Effet de transformation. Dans la boîte de dialogue, définissez le nombre de copies sur 5, modifiez l’angle de rotation sur 30 et appuyez sur OK. Ensuite, choisissez Objet> Développer l'apparence..
Commencez par changer les lignes Couleur du trait en gris clair, puis choisissez Objet> Un groupe (Commande + Maj + G). Ensuite, sélectionnez la ligne médiane en haut (elle sélectionnera également la ligne médiane en bas) et la ligne médiane à gauche (elle sélectionnera également la ligne médiane à droite) et supprimez-les..
Avec l'outil Texte, créez quatre zones de texte distinctes numérotées 12, 3, 6 et 9 et placez-les à leur emplacement respectif sur l'horloge, à l'emplacement où se trouvaient les lignes. J'ai utilisé Myriad Pro Black pour ma police, mais vous pouvez utiliser celle de votre choix.
Sélectionnez la plus petite ellipse en deux étapes et choisissez Objet> Chemin> Décalage puis, dans la boîte de dialogue Décalage, réglez le décalage sur -105 px..
À ce stade, j'aime bien activer les guides intelligents en choisissant Affichage> Guides intelligents. Avec les guides intelligents activés, il est plus facile de tracer des lignes pour les aiguilles de l'horloge qui commencent au centre de la dernière ellipse offset. Une fois les guides intelligents activés, tracez la première aiguille en partant du centre de la plus petite ellipse. Ensuite, changez le poids du trait en 7 pt et appuyez sur l’icône Cap rond dans le panneau Contour. La ligne étant toujours sélectionnée, envoyez-la derrière la petite ellipse en choisissant Objet> Organiser> Renvoyer.
Tracez une autre ligne plus courte que l'aiguille des minutes, formant ainsi une aiguille des heures. Changez le poids du trait en 12 pt et changez la couleur du trait en une couleur grise. Ensuite, envoyez-la derrière la petite ellipse en choisissant Objet> Organiser> Envoyer en arrière.
Créez une ligne de plus, mais cette fois rendez la couleur du trait rouge, modifiez l’épaisseur du trait en 3 points, positionnez le point d’ancrage le plus proche de la petite ellipse et faites-la ressortir un peu. Envoyez la nouvelle ligne derrière la ligne précédente et la petite ellipse.
Sélectionnez les trois lignes, Copier (Commande + C) et Coller devant (Commande + B). Les lignes copiées étant toujours sélectionnées, sélectionnez Objet> Chemin> Contour du contour. Ensuite, avec les touches fléchées, déplacez les copies soulignées vers le bas et changez la couleur en gris clair - créant une simple ombre portée.
Sélectionnez l'ellipse blanche dans l'horloge, Copier (Commande + C) et Coller devant (Commande + F). Ensuite, tracez une ellipse oblongue sur toute l’horloge et placez la partie inférieure de la nouvelle ellipse au centre de l’horloge. Sélectionnez l'ellipse oblongue et l'ellipse blanche copiée et appuyez sur le bouton Moins avant du panneau Pathfinder..
Modifiez le remplissage de la nouvelle forme en un dégradé linéaire à partir du panneau Dégradé et ajustez le dégradé de bas en haut. Ensuite, définissez la forme sur Multiplier à partir du panneau Transparence..
Maintenant que le chronomètre est terminé, nous pouvons regarder les boules sur lesquelles le chronomètre se trouve. Commencez par créer une ellipse de 55 px sur 55 px. Remplissez l'ellipse avec un dégradé radial. Ajoutez deux arrêts de couleur au dégradé radial pour obtenir un total de quatre arrêts de couleur. Changez le premier arrêt en blanc, le second en gris, le troisième en gris plus foncé et le quatrième en gris de la même couleur que le second. À l'aide de l'outil Dégradé, cliquez près du coin supérieur gauche de l'ellipse et faites-le glisser à un angle de 45 degrés..
Placez la nouvelle ellipse de sorte qu’elle s’aligne avec les côtés gauche et inférieur de l’horloge. Ensuite, choisissez Option> Organiser> Envoyer à l’arrière (Commande + Maj + touche Support gauche) pour placer l’ellipse derrière la montre..
Sélectionnez la petite ellipse, puis Copiez (Commande + C) et Coller devant (Command + F). Ensuite, sélectionnez la plus grande ellipse de l’horloge, maintenez les touches Maj + Alt enfoncées et faites glisser une copie légèrement vers le bas et vers la gauche. Sélectionnez les deux copies et appuyez sur le bouton Intersection du panneau Pathfinder. Remplissez la nouvelle forme avec une couleur grise et définissez-la sur Multiplier dans le panneau Transparence. Choisissez Objet> Organiser> Envoyer à l'arrière-plan (Commande + Maj + touche de support gauche), puis choisissez Option> Organiser, puis Suivant, pour placer la forme d'ombre derrière toutes les formes d'horloge, mais devant la petite ellipse..
Sélectionnez la petite boule et l'ombre, Copier (Commande + C) et Coller devant (Commande + F). Ensuite, allez à Objet> Transformer> Refléter et choisissez Vertical dans la boîte de dialogue Refléter. Déplacez la copie sur le côté droit de l'horloge.
Avec l’outil Rectangle (M), créez un rectangle de 10 px de large sur 50 px de hauteur. Remplissez le rectangle avec un dégradé linéaire de quatre couleurs Stop, le premier étant en gris clair, le second en gris, le troisième en gris foncé et le quatrième, en gris identique au second..
Créez un autre rectangle de 15 px de large par 20 px de hauteur sur le premier. Ensuite, choisissez Effet> Styliser> Coins arrondis et dans la boîte de dialogue Coins arrondis, réglez le rayon sur 10 px. Remplissez-le avec le même dégradé de quatre paliers de couleur que le rectangle précédent et ajustez le dégradé avec l'outil Dégradé de haut en bas..
Placez le deuxième rectangle sur la partie centrale supérieure du premier rectangle. Sélectionnez les deux rectangles et placez-les sur la partie centrale supérieure de l'horloge. Avec les deux rectangles toujours sélectionnés, choisissez Objet> Organiser> Envoyer à l'arrière-plan (Commande + Maj + touche de support gauche)..
Créez un rectangle de 110 px de large sur 80 px de haut. Ensuite, allez à Effet> Styliser> Coins arrondis et modifiez le rayon à 30 px. Développez l'apparence du rectangle en allant dans Objet> Développer l'apparence. Créez un autre rectangle au-dessus du rectangle actuel, un peu plus à mi-parcours du rectangle actuel. Sélectionnez les deux rectangles et appuyez sur l'icône Moins avant du panneau Pathfinder. Remplissez la nouvelle forme avec le même dégradé linéaire que les rectangles précédents et ajustez le dégradé de haut en bas..
Copiez (commande + C) la nouvelle forme de cloche et coller devant (commande + F). Avec l'outil de sélection (V), réduisez la copie horizontalement en un format plus petit que la forme d'origine. Laissez plus de place sur le côté droit de la cloche que sur la gauche pour obtenir un écart de largeur. Copiez (Commande + C) la forme de la cloche écrasée, Coller devant (Commande + F), et écrasez cette copie de la même façon que vous avez créé la forme précédente. Sélectionnez les deux formes et appuyez sur le bouton Moins avant dans le panneau Pathfinder. Changez le remplissage de la nouvelle forme en blanc et changez l'opacité à 15% à partir du panneau Transparence..
Sélectionnez la forme principale de la cloche, puis à nouveau Copier (Commande + C) et Coller devant (Commande + F). Réduisez la nouvelle copie horizontalement à environ un seizième de la taille originale. Remplissez-le d'un gris clair et réglez-le sur Multiplier dans le panneau Transparence..
Créez une ellipse de 20 px sur 20 px, remplissez-la avec le même dégradé que la forme de la cloche et ajustez le dégradé de haut en bas. Ensuite, placez l'ellipse derrière la partie centrale supérieure de la forme de la cloche.
Créez un rectangle de 8 px de large sur 45 px de hauteur, remplissez-le avec le même dégradé linéaire que les étapes précédentes, ajustez le dégradé et placez-le derrière la partie centrale inférieure de la forme en cloche..
Sélectionnez toutes les formes de cloche et faites pivoter de 30 degrés dans le panneau Transformer. Ensuite, placez les formes de la cloche derrière la pendule en haut à gauche..
Copiez (Commande + C) les formes de la cloche, Coller devant (Commande + F), choisissez Objet> Transformer> Refléter, puis choisissez Vertical dans la boîte de dialogue Refléter. Déplacez la forme copiée sur le côté opposé de l'horloge.
Presque terminé, mais ajoutons quelques touches finales. Créez une ellipse de 200 px par 200 px. Remplissez l'ellipse avec un dégradé radial avec la première couleur Stop gris foncé et la seconde stop blanc. Définissez l’ellipse sur Multiplier dans le panneau Transparence. Ensuite, réduisez l’ellipse verticalement de moitié par rapport à sa taille originale et placez-la sous le réveil pour créer une ombre portée.
Copiez (Commande + C) l’ombre portée et Coller devant (Commande + F). Réduisez la copie et placez-la sous la petite balle à gauche. Répétez cette opération pour une ombre portée à droite.
Créez un rectangle de la taille de votre document, remplissez-le avec un dégradé radial avec le premier couleur Stop blanc et le second un gris clair. Terminé!
C'était facile n'est-ce pas? En utilisant simplement des formes et des dégradés de base, il est facile de créer de superbes icônes. Ci-dessous est à nouveau l'image finale.
Abonnez-vous au fil RSS Vectortuts + pour rester au courant des derniers tutoriels et articles sur les vecteurs.
Accentsconagua