Share
Dans le didacticiel suivant, vous apprendrez à créer un jeu d’icônes émoticônes attractif. Découvrez un flux de travail facile à suivre pour créer chacun de ces petits visages émotionnels dans Adobe Illustrator..
Créez un document RVB de 60 px sur 60 px. Commencez par activer la grille (Affichage> Grille) et l’alignement sur la grille (Affichage> Aligner sur la grille). Ensuite, vous aurez besoin d'une grille toutes les 1px. Allez dans Edition> Préférences> Guides et grille, entrez 1 dans le quadrillage chaque case et 1 dans la zone Subdivisions..
Vous pouvez également ouvrir le panneau Info (Fenêtre> Info) pour un aperçu en direct avec la taille et la position de vos formes. N'oubliez pas de remplacer l'unité de mesure en pixels dans Edition> Préférences> Unité> Général. Toutes ces options augmenteront considérablement votre vitesse de travail.
Choisissez l'outil Ellipse (L), créez une forme de 40 x 40 pixels et remplissez-le avec R = 255, G = 222, B = 23..
Sélectionnez la forme créée à l'étape précédente et assurez-vous qu'elle est placée au centre de la planche. Activez les règles (Commande + R) et les guides (Affichage> Guides> Afficher les guides), puis faites glisser un guide vertical et un guide horizontal, comme indiqué dans l'image suivante. Désactiver les règles et garder les guides visibles. Cela vous aidera dans les étapes suivantes, en ajoutant de nouvelles formes.
Désactivez l'alignement sur la grille, puis sélectionnez Edition> Préférences> Général et entrez 0.5 dans la zone Incrément de clavier. Resélectionnez le cercle jaune et effectuez deux copies devant (Command + C> Command + F> Command + F). Sélectionnez la copie du haut et appuyez une fois sur la flèche du bas (pour la déplacer de 0,5 pixel vers le bas). Resélectionnez les deux copies et cliquez sur le bouton Moins avant du panneau Pathfinder. Remplir la forme obtenue avec du blanc.
Réactivez l'alignement sur la grille. Resélectionnez le cercle jaune et allez dans le panneau Apparence. Sélectionnez le remplissage existant et cliquez sur le bouton Dupliquer l'élément sélectionné situé au bas du panneau Apparence. Évidemment, cela créera une copie du remplissage sélectionné. Sélectionnez ce nouveau remplissage, diminuez son opacité à 75% et remplissez-le avec le dégradé linéaire montré dans l'image suivante.
Faites attention à l'image en dégradé. Le "0" jaune représente le pourcentage d'opacité. Cela signifie que vous devez sélectionner le curseur de dégradé et baisser son opacité à 0%. Continuez à vous concentrer sur ce cercle jaune. Resélectionnez-le et ajoutez un trait simple. Faites-le large, alignez-le à l'extérieur et réglez sa couleur sur R = 237, G = 147, B = 39..
Resélectionnez la forme modifiée à l'étape précédente. Accédez au panneau Apparence, sélectionnez le fond jaune et accédez à Effet Styliser> Inner Glow. Entrez les données indiquées ci-dessous, cliquez sur OK, puis sélectionnez Effet> Styliser> Ombre portée. Encore une fois, entrez les données indiquées ci-dessous et cliquez sur OK. A la fin, votre forme devrait ressembler à l'image suivante. Ce sera la forme du visage que vous utiliserez pour la plupart des émoticônes..
Ajoutons maintenant une humeur à ce visage. Tout d’abord, réactivez l’alignement sur la grille, puis sélectionnez l’outil Rectangle (M). Créez deux formes de 4 x 8 pixels et une forme de 12 x 8 pixels, puis placez-les comme indiqué..
L’alignement sur la grille et les guides faciliteront votre travail. Remplissez-les tous avec R = 96, G = 57, B = 19, puis sélectionnez Effet> Styliser> Coins arrondis. Entrez un rayon de 2 pixels, cliquez sur OK, puis sélectionnez Effet> Styliser> Ombre portée. Entrez les données ci-dessous et cliquez sur OK.
Choisissez l'outil Ellipse (L), créez une forme de 26 x 16 pixels et placez-le comme indiqué. Remplissez-le avec le dégradé linéaire indiqué ci-dessous, puis abaissez son opacité à 50%. Maintenant, organisons les formes existantes.
Accédez au panneau Calques, sélectionnez le calque existant, puis cliquez sur le bouton Créer un nouveau sous-calque situé en bas du panneau. Sélectionnez toutes les formes créées jusqu'à présent et déplacez-les dans cette nouvelle sous-couche. Double-cliquez sur cette sous-couche et nommez-la "Pas amusé". Maintenant votre premier émoticône est terminé.
Sélectionnez la sous-couche créée à l'étape précédente et effectuez une copie devant. Concentrez-vous sur cette nouvelle sous-couche, sélectionnez la forme de la bouche et accédez à Effet> Déformation> Arc. Entrez les données affichées sous l'image n ° 1 et cliquez sur OK.
Nommez cette deuxième sous-couche "Sad" et dupliquez-la. Sélectionnez la forme de la bouche dans cette nouvelle sous-couche, puis accédez au panneau Apparence et ouvrez l'effet de distorsion existant. Faites glisser le curseur Courbure vers -50%, puis cliquez sur OK. Nommez cette troisième sous-couche "Happy".
Sélectionnez la sous-couche "Happy" et faites une copie devant. Concentrons-nous sur cette sous-couche fraîche. Commencez par renommer "Grin", puis sélectionnez la forme de la bouche existante et supprimez-la. Choisissez l'outil Ellipse (L), créez une forme de 16 x 7 pixels et placez-le comme indiqué dans la première image. Remplissez-le avec R = 96, G = 57, B = 19. Ensuite, allez à Effet> Warp> Arch. Entrez les données indiquées ci-dessous, cliquez sur OK, puis sélectionnez Objet> Développer l’apparence..
Sélectionnez la forme obtenue et effectuez deux copies devant, puis désactivez l'alignement sur la grille. Sélectionnez la copie du haut et appuyez quatre fois sur la flèche vers le bas, puis resélectionnez les deux copies et cliquez sur le bouton Moins avant du panneau Pathfinder. Remplir la forme obtenue avec du blanc.
Réactivez l'alignement sur la grille. Choisissez l'outil Plume (P), tracez trois chemins verticaux et placez-les ensuite comme indiqué dans la première image. Ajouter un trait de 1 pt pour ces chemins et définir sa couleur à R = 39, G = 170, B = 225.
Regroupez-les (Commande + G). Sélectionnez la forme blanche créée à l'étape précédente, faites-en une copie et amenez-la au premier plan (Maj> Commande + touche Support droit). Sélectionnez cette forme blanche et fraîche avec le groupe de couleurs fraîches et accédez au panneau Transparence. Ouvrez le menu déroulant et cliquez sur Créer un masque d'opacité..
Resélectionnez la forme de la bouche et allez à Effet> Styliser> Ombre portée. Entrez les données indiquées ci-dessous, cliquez sur OK, puis ajoutez un trait d'un trait. Alignez-le sur l'extérieur et réglez sa couleur sur R = 237, G = 147, B = 39..
Sélectionnez la sous-couche "Grin" et faites une copie devant. Concentrons-nous sur cette sous-couche fraîche. Commencez par renommer «Winking», puis sélectionnez la forme de l’œil droit et supprimez-la. Choisissez l'outil Rectangle (M), créez une forme de 5 x 3 pixels et placez-le comme indiqué..
Remplissez-le avec R = 96, G = 57, B = 19. Ensuite, allez à Effet> Styliser> Coins arrondis. Entrez un rayon de 2 pixels, cliquez sur OK, puis sélectionnez Effet> Déformation> Arc. Entrez les données indiquées ci-dessous, cliquez sur OK, puis sélectionnez Effet> Styliser> Ombre portée. Encore une fois, entrez les données ci-dessous, puis cliquez sur OK.
Sélectionnez la sous-couche "Winking" et faites-en une copie devant. Concentrons-nous sur cette sous-couche fraîche. Commencez par le renommer "Weeping", puis sélectionnez les composants yeux et bouche et supprimez-les. Choisissez l'outil Rectangle (M), créez deux formes de 6 x 4 pixels et placez-les comme indiqué dans l'image suivante. Remplissez-les avec R = 96, G = 57, B = 19. Ensuite, allez à Effet> Styliser> Coins arrondis. Entrez un rayon de 2 pixels, cliquez sur OK, puis sélectionnez Effet> Déformation> Arc. Entrez les données indiquées ci-dessous, cliquez sur OK, puis sélectionnez Objet> Développer l'apparence..
Sélectionnez la forme de l'œil gauche et sélectionnez Objet> Transformer> Rotation. Entrez un angle de 45 degrés, puis cliquez sur OK. Sélectionnez la forme de l'œil droit et sélectionnez Objet> Transformer> Rotation. Entrez un angle de -45 degrés, puis cliquez sur OK. Resélectionnez les deux formes d'œil et accédez à Effet> Styliser> Ombre portée. Entrez les données affichées dans l'image finale, puis cliquez sur OK..
Continuez à vous concentrer sur la sous-couche "Weeping". Choisissez l'outil Ellipse (L), créez une forme de 16 x 7 pixels et placez-le comme indiqué. Remplissez-le avec R = 96, G = 57, B = 19 et allez à Effet> Warp> Arch. Entrez les données indiquées ci-dessous, cliquez sur OK, puis sélectionnez Objet> Développer l’apparence..
Sélectionnez la forme obtenue, faites deux copies devant et désactivez l'alignement sur la grille. Sélectionnez la copie du haut et appuyez sur la flèche vers le haut dix fois. Resélectionnez les deux copies et cliquez sur le bouton Intersection du panneau Pathfinder. Remplir la forme obtenue avec du blanc.
Réactivez l'alignement sur la grille. Choisissez l'outil Plume (P), tracez trois chemins verticaux et placez-les ensuite comme indiqué dans la première image. Ajoutez un trait d'un trait pour ces chemins et définissez sa couleur sur R = 39, G = 170, B = 225. Regroupez-les (Commande + G). Sélectionnez la forme blanche créée à l'étape précédente, faites-en une copie et amenez-la au premier plan (Maj> Commande + touche Support droit). Sélectionnez cette forme blanche et fraîche avec le groupe de couleurs fraîches et accédez au panneau Transparence. Ouvrez le menu déroulant et cliquez sur Créer un masque d'opacité..
Resélectionnez la forme de la bouche et allez à Effet> Styliser> Ombre portée. Entrez les données indiquées ci-dessous, cliquez sur OK, puis ajoutez un trait d'un trait. Alignez-le sur l'extérieur et réglez sa couleur sur R = 237, G = 147, B = 39..
Choisissez l'outil Ellipse (L), créez une forme de 4 x 4 pixels et remplissez-le avec R = 39, G = 170, B = 255. Choisissez l'outil Convertir le point d'ancrage (Maj + C) et cliquez sur le point d'ancrage inférieur. Cela fera ressembler votre cercle à la deuxième image. Choisissez l'outil de sélection directe (A), sélectionnez le point d'ancrage inférieur et déplacez-le de 2 pixels vers le bas. Maintenant, concentrez-vous sur les points d'ancrage gauche et droit. Utilisez le même outil pour faire glisser les poignées 1px vers le bas.
Sélectionnez la forme créée à l'étape précédente et accédez à Effet> Déformation> Arc. Entrez les données indiquées ci-dessous, cliquez sur OK, puis sélectionnez Objet> Développer l’apparence. Dupliquez la forme obtenue. Faites pivoter ces deux formes bleues et placez-les comme indiqué. Enfin, ajoutez un trait de 0,5 point pour ces deux formes. Alignez-le à l'intérieur et réglez sa couleur sur R = 28, G = 117, B = 188..
Sélectionnez la sous-couche "Heureuse", faites une copie et déplacez-la en haut du panneau Calque. Concentrons-nous sur cette sous-couche fraîche. Tout d’abord, renommez-le "Amour", puis sélectionnez des formes d’œil et supprimez-les. Accédez au panneau Symboles (Fenêtre> Symboles), ouvrez le menu déroulant, puis sélectionnez Ouvrir la bibliothèque de symboles> Icônes Web. Une fenêtre avec un ensemble de symboles devrait s'ouvrir.
Sélectionnez le symbole "Favori", faites-le glisser sur votre planche de travail, puis sélectionnez Objet> Développer. Concentrez-vous sur la forme obtenue. Tout d’abord, sélectionnez l’Outil de sélection directe (A), sélectionnez les points d’ancrage mis en surbrillance dans la deuxième image, puis cliquez sur le bouton Supprimer. Maintenant, le coeur devrait ressembler à la troisième image.
Ensuite, vous devez ajouter un effet d'arrondi discret pour le point d'ancrage inférieur. Vous aurez besoin du script Round Any Corner. Enregistrez-le sur votre disque dur, sélectionnez le point d'ancrage inférieur à l'aide de l'outil de sélection directe (A), puis sélectionnez Fichier> Scripts> Autre script. Ouvrez le script Round Any Corner, entrez un rayon de 7 px et cliquez sur OK. Remplissez la forme résultante avec R = 242, G = 41, B = 17. En fin de compte, il devrait ressembler à la quatrième image.
Sélectionnez la forme créée à l'étape précédente et dupliquez-la. Sélectionnez ces deux formes de cœur, redimensionnez-les et placez-les comme indiqué. Maintenant, allez à Effet> Styliser> Ombre portée. Entrez les données indiquées ci-dessous, cliquez sur OK, puis ajoutez un trait de 0,75 pt. Alignez-le à l'intérieur et réglez sa couleur sur R = 190, G = 30, B = 45..
Sélectionnez la sous-couche "Love" et faites-en une copie devant. Concentrons-nous sur cette sous-couche fraîche. Tout d’abord, renommez-le "Surprise", puis sélectionnez les composants pour les yeux et la bouche et supprimez-les. Choisissez l'outil Rectangle (M), créez une forme de 10 x 5 pixels et placez-le comme indiqué dans l'image suivante. Remplissez-le avec R = 96, G = 57, B = 19. Ensuite, allez à Effet> Styliser> Coins arrondis. Entrez un rayon de 3 pixels, cliquez sur OK, puis sélectionnez Effet> Styliser> Ombre portée. Entrez les données ci-dessous et cliquez sur OK.
Choisissez l'outil Ellipse (L), créez deux formes de 8 x 8 pixels et placez-les comme indiqué dans la première image. Remplissez-les avec R = 241, G = 242, B = 242 et ajoutez un trait d'un trait. Alignez-le sur l'extérieur et réglez sa couleur sur R = 237, G = 147, B = 39..
Resélectionnez les deux cercles et allez à Effet> Styliser> Ombre portée. Entrez les données affichées dans la première image et cliquez sur OK. Là encore, sélectionnez l’outil Ellipse (L) et créez deux formes de 2 par 2 pixels. Remplissez-les avec R = 96, G = 57, B = 19 et placez-les comme indiqué dans la deuxième image..
Choisissez l'outil Plume (P), tracez deux chemins verticaux (6 pixels de haut) et placez-les comme indiqué dans l'image suivante. Ajoutez un trait d'un trait pour ces deux chemins, définissez la couleur sur R = 237, G = 147, B = 39 et accédez au panneau Contour (Fenêtre> Contour)..
Cliquez sur le bouton Round Cap, puis sélectionnez Effet> Styliser> Ombre portée. Entrez les données indiquées ci-dessous, cliquez sur OK, puis sélectionnez uniquement le chemin de gauche. Allez à Effet> Déformation> Arc, entrez les données indiquées ci-dessous, cliquez sur OK, puis sélectionnez le bon chemin. Encore une fois, allez à Effet> Déformation> Arc, entrez les données ci-dessous, puis cliquez sur OK..
Sélectionnez la sous-couche "Amour", effectuez une copie et déplacez-la en haut du panneau Calques. Concentrons-nous sur cette sous-couche fraîche. Commencez par renommer "Blushing", puis sélectionnez les composants pour les yeux et supprimez-les. Choisissez l'outil Rectangle (M), créez deux formes de 4 x 6 pixels et placez-les comme indiqué dans l'image suivante. Remplissez-les avec R = 96, G = 57, B = 19, puis sélectionnez Effet> Styliser> Coins arrondis. Entrez un rayon de 2 pixels, cliquez sur OK, puis sélectionnez Effet> Styliser> Ombre portée. Entrez les données ci-dessous et cliquez sur OK.
Choisissez l'outil Plume (P), tracez deux chemins horizontaux (4 pixels de long) et placez-les comme indiqué dans l'image suivante. Ajoutez un trait d'un trait pour ces deux chemins, définissez la couleur sur R = 96, G = 57, B = 19 et accédez au panneau Contour. Cliquez sur le bouton Round Cap, puis sélectionnez Effet> Styliser> Ombre portée. Entrez les données indiquées ci-dessous, cliquez sur OK, puis sélectionnez Effet> Déformation> Arc. Encore une fois, entrez les données ci-dessous et cliquez sur OK.
Choisissez l'outil Ellipse (L), créez deux formes de 5 x 5 pixels et placez-les comme indiqué. Remplissez-les avec R = 237, G = 28, B = 36 et accédez à Effet> Flou> Flou gaussien. Entrez un rayon de 2px et cliquez sur OK.
Sélectionnez la sous-couche "Blushing" et faites une copie devant. Concentrons-nous sur cette sous-couche fraîche. Tout d’abord, renommez-le "Malade", puis supprimez les composants yeux et bouche. Maintenant, vous devez changer la couleur de tout le visage.
Accédez au panneau Apparence et concentrez-vous sur le premier remplissage. Remplacez le jaune par R = 171, G = 223, B = 35, puis ouvrez l’effet Inner Glow et remplacez la couleur existante par celle illustrée ci-dessous. Passez au deuxième remplissage et remplacez le dégradé existant par celui indiqué. Enfin, sélectionnez le trait et remplacez la couleur existante par R = 57, G = 181, B = 74.
Continuons avec les yeux. Choisissez l'outil Rectangle (M), créez deux formes de 4 x 8 pixels et placez-le comme indiqué dans l'image suivante. Remplissez-les avec R = 0, G = 104, B = 56, puis sélectionnez Effet> Styliser> Coins arrondis. Entrez un rayon de 2 pixels, cliquez sur OK, puis sélectionnez Effet> Styliser> Ombre portée. Entrez les données ci-dessous et cliquez sur OK.
Choisissez l'outil Plume (P), tracez deux chemins verticaux (6 pixels de haut) et placez-les comme indiqué dans l'image suivante. Ajoutez un trait d'un trait pour ces deux chemins, définissez la couleur sur R = 0, G = 104, B = 56 et accédez au panneau Contour (Fenêtre> Contour). Cliquez sur le bouton Round Cap, puis sélectionnez Effet> Styliser> Ombre portée. Entrez les données indiquées ci-dessous, cliquez sur OK, puis sélectionnez uniquement le chemin de gauche. Allez à Effet> Déformation> Arc, entrez les données indiquées ci-dessous, cliquez sur OK, puis sélectionnez le bon chemin. Encore une fois, allez à Effet> Déformation> Arc, entrez les données ci-dessous et cliquez sur OK..
Choisissez l'outil Rectangle (M), créez une forme de 6 x 4 pixels et placez-le comme indiqué dans l'image suivante. Remplissez-le avec R = 0, G = 104, B = 56, puis sélectionnez Effet> Styliser> Coins arrondis. Entrez un rayon de 2 pixels, cliquez sur OK, puis sélectionnez Effet> Styliser> Ombre portée. Entrez les données ci-dessous et cliquez sur OK.
Une fois encore, sélectionnez l'outil Crayon (P), tracez deux chemins verticaux (6 pixels de haut) et placez-les comme indiqué. Ajoutez un trait d'un trait pour ces deux chemins, définissez la couleur sur R = 0, G = 104, B = 56 et accédez au panneau Contour (Fenêtre> Contour). Cliquez sur le bouton Round Cap, puis sélectionnez Effet> Styliser> Ombre portée..
Entrez les données indiquées ci-dessous, cliquez sur OK, puis sélectionnez uniquement le chemin de gauche. Allez à Effet> Déformation> Arc, entrez les données indiquées ci-dessous, cliquez sur OK. Maintenant, sélectionnez le bon chemin. Encore une fois, allez à Effet> Déformation> Arc, entrez les données ci-dessous et cliquez sur OK..
Sélectionnez la sous-couche "Malade" et faites-en une copie devant. Concentrons-nous sur cette sous-couche fraîche. Tout d’abord, renommez-le "Angry", puis supprimez les composants yeux et bouche. Encore une fois, vous devez changer la couleur de tout le visage. En bas, vous avez toutes les informations dont vous avez besoin.
Choisissez l'outil Rectangle (M), créez une forme de 12 x 4 pixels et placez-le comme indiqué dans l'image suivante. Remplissez-le avec R = 60, G = 36, B = 21, puis sélectionnez Effet> Styliser> Coins arrondis. Entrez un rayon de 2 pixels, cliquez sur OK, puis sélectionnez Effet> Styliser> Ombre portée. Entrez les données ci-dessous et cliquez sur OK.
Continuons avec les yeux. Choisissez l'outil Rectangle (M), créez deux formes de 4 x 8 pixels et placez-le comme indiqué dans l'image suivante. Remplissez-les avec R = 60, G = 36, B = 21, puis sélectionnez Effet> Styliser> Coins arrondis. Entrez un rayon de 2 pixels, cliquez sur OK, puis sélectionnez Effet> Styliser> Ombre portée. Entrez les données ci-dessous et cliquez sur OK.
Choisissez l'outil Plume (P), tracez les deux chemins illustrés ci-dessous et placez-les comme indiqué dans l'image suivante. Ajoutez un trait d'un trait pour ces deux chemins, définissez la couleur sur R = 0, G = 104, B = 56 et accédez au panneau Contour (Fenêtre> Contour). Cliquez sur le bouton Round Cap, puis sélectionnez Effet> Styliser> Ombre portée. Entrez les données ci-dessous et cliquez sur OK.
Choisissez l'outil Rectangle (M), créez une forme de 2 x 5 pixels et remplissez-le avec R = 0, G = 104, B = 56. Choisissez l'outil de sélection directe (A), sélectionnez les points d'ancrage inférieurs et sélectionnez Objet> Chemin> Moyenne. Cochez les deux et cliquez sur OK. Cela transformera votre rectangle en un joli triangle. Sélectionnez-le et allez à Effet> Styliser> Coins arrondis. Entrez un rayon de 1 px, cliquez sur OK, puis effectuez trois copies. Faites-les pivoter et placez-les comme indiqué dans l'image finale.
Le dernier jeu d'icônes d'émoticônes est ci-dessous.
Accentsconagua