Share
Ce que vous allez créerDans le tutoriel d'aujourd'hui, nous allons passer du temps de jeu de qualité ensemble et libérer notre enfant intérieur en apprenant à créer une version numérique de l'impressionnant Lego Batman. Woohoo! Nous allons faire tout cela dans Adobe Illustrator, en utilisant des formes géométriques simples que nous allons ajuster ici et là. Assez dit-prenez une tasse de café fraîche, et commençons!
Oh, et n'oubliez pas que vous pouvez toujours élargir votre univers en vous dirigeant vers GraphicRiver où vous trouverez une grande sélection d'actifs sur le thème de Lego..
En supposant que vous avez déjà Illustrator en marche en arrière-plan, affichez-le et configurons un Nouveau document (Fichier> Nouveau ou Contrôle-N) pour notre projet en utilisant les paramètres suivants:
Et de la Avancée languette:
Même si aujourd'hui nous ne travaillons pas sur des icônes, nous voudrons tout de même créer l'illustration à l'aide d'un flux de travail parfaitement pixelisé. Nous allons donc configurer une jolie petite grille pour pouvoir contrôler entièrement nos formes..
Aller au Édition> Préférences> Guides et grille sous-menu et réglez les paramètres suivants:
Conseil rapide: vous pouvez en apprendre plus sur les grilles en lisant cet article détaillé sur le fonctionnement du système de grilles d'Illustrator.
Une fois notre grille personnalisée configurée, tout ce que nous avons à faire pour nous assurer que nos formes ont une apparence nette est de permettre la Aligner sur la grille option trouvée sous Vue menu (si vous utilisez une ancienne version d'Illustrator).
Maintenant, si vous êtes novice dans l'ensemble du "flux de travail pixel-perfect", je vous recommande fortement de consulter mon tutoriel Comment créer des illustrations parfaitement pixelisées, qui vous aidera à élargir vos compétences techniques en un rien de temps.
Une fois que nous avons fini de configurer notre fichier de projet, il serait judicieux de structurer notre document en utilisant plusieurs couches, car cela nous permet de maintenir un flux de travail régulier en nous concentrant sur une section de l'illustration à la fois..
Cela étant dit, amenez le Couches panneau, et créer un total de deux couches, que nous renommerons comme suit:
Conseil rapide: J'ai coloré tous mes calques en utilisant la même valeur verte, car c'est la plus facile à afficher lorsqu'elle est utilisée pour mettre en surbrillance les formes sélectionnées (qu'elles soient des chemins fermés ou ouverts)..
Nous allons commencer en créant la partie inférieure du jouet, alors assurez-vous que vous êtes sur le bon calque (ce serait le premier), puis verrouillez l'autre pour pouvoir commencer..
Créez la forme principale du bas du corps de la figurine à l'aide d'un 100 x 16 px rectangle que nous colorierons avec # 53555E puis centrez le centre sur la planche d’art en le plaçant à une distance de 224 px de son bord inférieur.
Donner à la forme que nous venons de créer un contour en utilisant le Accident vasculaire cérébral méthode, en en créant une copie (Control-C), que nous allons coller devant (Contrôle-F) puis ajustez d'abord sa couleur en # 24252B puis en retournant son Remplir avec son Accident vasculaire cérébral (Shift-X). Définir le contour résultant Poids à 8 px et son Coin à Joindre rond, sélectionner et regrouper ensuite les deux formes à l’aide des touches Contrôle-G raccourci clavier.
Commencez à travailler sur la jambe gauche en créant sa partie supérieure à l'aide d'un 44 x 32 px rectangle (# 6D6F77) avec un 8 px contour épais (# 6D6F77), que nous regrouperons (Contrôle-G) puis positionnez-les sous la section précédente de manière à ce qu'elles se chevauchent, comme indiqué dans l'image de référence..
Créez la section centrale en utilisant un 44 x 36 px rectangle (# 53555E) avec un 8 px contour épais (# 24252B), que nous regrouperons (# 24252B) puis positionnez-vous sur la plus petite section.
Ajouter la section de pied en utilisant un 44 x 20 px rectangle (# 6D6F77) avec un 8 px contour épais (# 24252B), regroupement (Contrôle-G) puis positionnez les deux comme indiqué dans l’image de référence. Une fois que vous avez terminé, sélectionnez et groupez (Contrôle-G) toutes les sections de composition de l'étape en cours avant de passer à l'étape suivante.
Créez la jambe droite en utilisant une copie (Contrôle-C> Contrôle-F) de celui sur lequel nous venons de terminer, que nous positionnerons du côté opposé du bas du corps.
Ajoutez le séparateur qui tient les deux jambes ensemble en utilisant un 16 x 36 px rectangle (# 6D6F77) avec un 8 px contour épais (# 24252B), que nous regrouperons (Contrôle-G) puis positionnez-vous comme dans l'image de référence. Une fois que vous avez terminé, sélectionnez et groupez (Contrôle-G) toutes les sections en cours avant de passer à la suivante.
Une fois que nous avons terminé de travailler sur la partie inférieure du corps, nous pouvons avancer de quelques pixels et commencer à travailler sur la partie supérieure, en commençant par le torse..
Créez la partie inférieure du torse à l'aide d'un 108 x 12 px rectangle que nous colorierons avec # 6D6F77 puis positionnez-le sur la partie supérieure du bas du corps, comme indiqué sur l'image de référence.
Ajouter la partie supérieure en utilisant un 108 x 76 px rectangle que nous colorierons avec # 6D6F77 puis placez-vous sur la forme précédente.
Ajustez la forme du rectangle que nous venons de créer en sélectionnant individuellement ses points d’ancrage supérieurs à l’aide des touches Outil de sélection directe (A) puis les pousser à l'intérieur par 12 px en utilisant le Bouge toi outil (clic droit> Transformer> Déplacer> + / - 12 px en fonction de quel côté vous commencez).
Sélectionnez les deux formes de composition du torse et combinez-les en une seule plus grande en utilisant Éclaireurde Unir le mode forme.
Donner à la forme obtenue un 8 px contour épais (# 24252B), en les sélectionnant et en les regroupant ensuite à l'aide du Contrôle-G raccourci clavier.
Une fois que vous avez fini de construire le torse, nous pouvons passer aux côtés et commencer à travailler sur les mains du jouet.
Sélectionnez le Outil stylo (P) et, avec la couleur définie à # 53555E, dessiner progressivement le bras en utilisant l'image de référence comme guide principal.
Donner à la forme obtenue un 8 px contour épais (# 24252B) en utilisant le Accident vasculaire cérébral méthode.
Tracez le segment de droite en diagonale où le bras se plierait normalement, en utilisant un 8 px épais Accident vasculaire cérébral (# 24252B) avec un Casquette ronde, que nous allons positionner comme on le voit dans l’image de référence. Une fois que vous avez terminé, sélectionnez et groupez (Contrôle-G) les trois formes ensemble avant de passer à l'étape suivante.
Créer le poignet en utilisant un 20 x 16 px rectangle que nous colorierons avec # 53555E puis positionnez-vous sur le bras, à une distance de 12 px de son point d'ancrage en bas à droite.
Ajustez la forme que vous venez de créer en sélectionnant et en poussant ses points d’ancrage inférieurs vers la gauche. 2 px en utilisant le Bouge toi outil (clic droit> Transformer> Déplacer> Horizontal> -2 px).
Continuez à ajuster la forme actuelle en sélectionnant et en poussant son point d’ancrage inférieur gauche vers le haut en 2 px.
Donner à la forme obtenue un 8 px contour épais (# 24252B), regroupement (Contrôle-G) puis en plaçant les deux sous la grande main (clic droit> Organiser> Renvoyer).
Créez la forme principale de la main à l'aide d'un 36 x 36 px cercle que nous colorierons avec # 6D6F77 puis placez-vous au poignet, comme indiqué dans l'image de référence.
Ajustez le cercle que nous venons de créer en découpant un 12 x 30 px rectangle arrondi (surligné en rouge) avec un Rayon de coin 6 px de sa moitié inférieure.
Donner à la forme obtenue un 8 px contour épais (# 24252B), en sélectionnant et en regroupant les deux à l’aide des touches Contrôle-G raccourci clavier. Une fois que vous avez terminé, sélectionnez et groupez (Contrôle-G) toutes les sections composant le bras gauche en les plaçant sous le plus grand torse (clic droit> Organiser> Envoyer à l'arrière).
Créez le bras droit en utilisant une copie (Contrôle-C> Contrôle-F) de celui sur lequel nous venons de terminer, que nous refléterons verticalement (clic droit> Transformer> Reflect> Vertical) puis positionnez-vous du côté opposé du torse.
Puisque nous avons presque fini de travailler sur le corps de la figurine, nous pouvons nous concentrer sur sa tête et la construire progressivement, une section à la fois..
Lancez des choses en créant la section du cou en utilisant un 40 x 12 px rectangle (# DDA98C) avec un 8 px contour épais (# 24252B), que nous regrouperons (Contrôle-G) puis se positionner sur le plus grand torse.
Ajouter la tête réelle en utilisant un 76 x 64 px rectangle arrondi (# F9C9A9) avec un Rayon d'angle 16 px Et un 8 px contour épais (# 24252B), que nous regrouperons (Contrôle-G) puis positionnez-vous sur la partie supérieure du cou.
Terminez la figurine vierge en ajoutant la section du connecteur à sa tête à l'aide d'un 32 x 16 px rectangle (# DDA98C) avec un 8 px contour épais (# 24252B), regroupement (Contrôle-G) puis positionnez les deux comme indiqué dans l’image de référence. Une fois que vous avez terminé, sélectionnez et groupez (Contrôle-G) toutes les sections composant la tête avant de passer à l'étape suivante.
À ce stade, nous avons une version totalement vierge de notre figurine Lego, que nous transformons en justicier de la lutte contre la criminalité en ajoutant progressivement des détails à ses différentes sections, et nous le ferons en commençant par la tête..
Commencez à travailler sur les yeux en créant la forme principale pour celle de gauche en utilisant un 8 x 10 px ellipse, que nous colorierons avec # 24252B puis positionner à une distance de 20 px à partir du bord gauche de la tête et 16 px de son sommet.
Ajouter le petit point fort à l'aide d'un 2 x 2 px cercle que nous colorierons avec du blanc (#FFFFFF), puis centrer sur la forme précédente, en la positionnant à une distance de 2 px de son bord supérieur. Une fois que vous avez terminé, sélectionnez et groupez (Contrôle-G) les deux ensemble avant de passer à l'étape suivante.
Ajoutez l'oeil droit à l'aide d'une copie (Contrôle-C> Contrôle-F) de celui sur lequel nous venons de terminer, que nous allons positionner sur le côté opposé de la tête, en veillant à maintenir le même 20 px distance de son bord extérieur.
Dessine les sourcils avec deux 4 px épais Accident vasculaire cérébral lignes (# 24252B) avec un Casquette ronde et Joindre, en suivant l'image de référence comme guide principal.
Commencez à travailler sur la bouche en créant un 24 x 10 px rectangle que nous colorierons avec du blanc (#FFFFFF) puis centrer la tête sur la tête en la positionnant 12 px de son bord supérieur.
Ajustez la forme que vous venez de créer en repositionnant ses points d'ancrage supérieurs, comme indiqué dans l'image de référence. 4 px contour épais (# 24252B).
Ajoutez la ligne de détail horizontale sur le côté droit de la bouche en utilisant un 6 px large 2 px épais Accident vasculaire cérébral ligne (# 24252B). Une fois que vous avez terminé, sélectionnez et regroupez toutes les formes de composition de la section actuelle à l’aide des touches Contrôle-G raccourci clavier.
Comme nous l'avons fait avec les sourcils, prenez quelques instants et tracez les deux lignes de joue à l'aide d'un 4 px épais Accident vasculaire cérébral (# 24252B) avec un Casquette ronde et Joindre, que nous allons positionner comme on le voit dans l’image de référence. Prenez votre temps, et une fois que vous avez terminé, sélectionnez et groupez (Contrôle-G) toutes les formes composant le visage avant de passer à l'étape suivante.
Une fois que vous avez fini de travailler sur le visage, passez au torse et commençons à ajouter des détails au costume de Batman..
Commencez à travailler sur le patch avec le logo de la poitrine en créant un 44 x 28 px ellipse, que nous colorierons avec # FCCF4F puis centrez le centre sur le plus grand torse en le plaçant à une distance de 14 px de son bord supérieur.
Dessinez le logo de la chauve-souris (# 24252B) en utilisant l’image de référence comme guide principal. Prenez votre temps et une fois que vous avez terminé, sélectionnez les deux formes et regroupez-les à l’aide des touches Contrôle-G raccourci clavier.
Avec le patch en place, commencez à dessiner le reste de l’armure en commençant par la zone pectorale, en utilisant deux 4 px épais Accident vasculaire cérébral lignes (# 24252B) avec un Casquette ronde et Joindre.
Dessinez les abdominaux en utilisant le même processus, en vous assurant que tous les points d'ancrage sont positionnés de manière à ce qu'ils chevauchent les lignes à côté d'eux..
Terminez l’armure en traçant les lignes des côtes, en sélectionnant et en regroupant ensuite toutes les formes qui le composent à l’aide des touches suivantes. Contrôle-G raccourci clavier. De plus, comme nous avons presque fini de travailler sur la figurine, vous pouvez sélectionner et grouper (Contrôle-G) toutes les sections qui le composent, ainsi.
Suivant la liste des accessoires de notre costume est la cape du croisé, que nous allons créer dans les moments suivants.
Commencez par créer un 256 x 320 px ellipse, que nous colorierons avec # 393B42 puis centrer le centre sur le bord supérieur du torse.
Supprimez la moitié inférieure de la forme en sélectionnant son point d'ancrage inférieur à l'aide de la touche Outil de sélection directe (A) puis en appuyant sur Effacer, en vous assurant de fermer le chemin résultant à l'aide du Contrôle-j raccourci clavier.
Créer quatre 64 x 32 px ellipses (surlignés en rouge), que nous allons positionner comme dans l’image de référence, puis soustraire de la cape à l’aide de Éclaireurde Mode Minus Avant.
Donner à la forme obtenue un 8 px contour épais (# 24252B), regroupement (Contrôle-G) puis en plaçant les deux sous la figurine à l'aide du bouton Organiser outil (clic droit> Organiser> Envoyer à l'arrière).
Puisque nous devons protéger la véritable identité de Batman, nous devrons créer son masque. Assurez-vous donc que vous vous êtes positionné sur le deuxième calque et commençons.!
Créé un 84 x 92 px rectangle que nous colorierons avec # 53555E puis centrez le centre sur la tête en le positionnant sur le bord supérieur du contour du cou.
Met le Rayon des coins inférieurs de la forme à 8 px de l'intérieur Transformer du panneau Propriétés du rectangle.
Ajoutez les oreilles en utilisant deux 24 x 36 px des rectangles (# 53555E), que nous allons positionner sur la forme que nous venons d'ajuster.
Sélectionnez et unissez les trois formes en une seule plus grande en utilisant Éclaireurde Unir le mode forme, sélectionner et pousser le point d'ancrage supérieur-extérieur des oreilles vers l'intérieur en 16 px (clic droit> Transformer> Déplacer> Horizontal> + / - 16 px en fonction de quel côté vous commencez).
Continuez à ajuster la forme obtenue en sélectionnant et en poussant les points d’ancrage inférieurs de ses oreilles vers le bas. 24 px (clic droit> Transformer> Déplacer> Vertical> 24 px), puis en ajustant leur courbure comme indiqué dans l'image de référence.
Prenez quelques instants pour dessiner la petite découpe que nous retirerons du masque en utilisant l’image de référence comme guide principal..
Découpez la forme que nous venons de créer à partir de la surface du masque à l'aide de Éclaireurde Mode Minus Avant, donnant à la forme résultante un 8 px contour épais (# 24252B).
Ajouter les yeux en utilisant deux 20 x 14 px ellipses (#FFFFFF) avec un 8 px contour épais (# 24252B), que nous regrouperons individuellement (Contrôle-G) puis se positionner comme dans l'image de référence.
Ajoutez les lignes de détail aux oreilles du masque à l'aide de deux 8 px épais Accident vasculaire cérébral lignes (# 24252B) avec un Casquette ronde.
Terminez le masque et le projet lui-même en ajoutant les lignes de détail restantes à l’aide de deux 4 px épais Coups (# 24252B). Une fois que vous avez terminé, sélectionnez et groupez (Contrôle-G) toutes les formes composant la section en cours avant d'appuyer sur le bouton de sauvegarde.
Peu importe si vous êtes un fan du Batman original ou des réincarnations plus récentes, j'espère vraiment que vous vous êtes amusés à recréer ce petit garçon et que vous avez appris un nouveau tour ou deux en cours de route..
Puisque la beauté de Lego réside dans le fait que vous pouvez facilement créer de nouveaux mondes et personnages avec un interrupteur en quelques parties, je voulais vous montrer ce que vous pouvez réaliser en utilisant la version vierge de la figurine comme point de départ..
Si vous avez des questions, n'hésitez pas à les poster dans la zone de commentaires, et je vous répondrai avec une réponse dès que je le pourrai humainement.!
Accentsconagua