Dessin et ombrage rétro avec Adobe Illustrator

En illustrant sur des ordinateurs, il est toujours tentant d'utiliser toutes les couleurs vives et lumineuses qui apparaissent dans les palettes de couleurs par défaut. Parfois, cependant, moins de couleurs et des nuances légèrement plus douces donneront à votre travail une certaine chaleur et un charme qui laisseront les gens se demander s'il a été créé sur un ordinateur.!

Vous pouvez trouver les fichiers source de ce projet dans le répertoire intitulé "source" qui figure dans les fichiers que vous avez téléchargés. Vous voudrez peut-être les parcourir brièvement avant de commencer..


introduction

Avant de plonger dans les couleurs, voyons comment j'ai assemblé cette illustration de style rétro. J'ai inclus tous les raccourcis que j'ai pris et les points à surveiller lors du choix et du placement de votre couleur.

L'Illustration est une interprétation humoristique des enchères informatiques. L'accent est mis sur la lampe juste à droite du centre. J'ai un groupe d'enchérisseurs informatiques à gauche et le commissaire-priseur à droite. Les personnes sortant des ordinateurs semblent être les éléments les plus compliqués, nous allons y travailler en premier. J'aime faire les choses difficiles en premier, car le travail semble toujours plus facile une fois que c'est fait!

J'ai élaboré un croquis à suivre, il est très lâche et sert simplement de guide pour les positions, etc. Après l'avoir numérisé dans l'ordinateur, je le place sur un calque appelé "TRACE" et le verrouille pour que je ne le fasse pas. t aller accidentellement des choses plus tard.



Étape 1: Référence ancienne de Skool

J'ai cherché des références de photos pour mon ancien ordinateur d'école et j'ai pensé que celle-ci datant des années 1970 était un bon début. J'aime le clavier intégré en angle et ce moniteur oh, si petit et arrondi! Cette illustration sera un curieux mélange de culture des années 50, 70 et d'aujourd'hui!



Étape 2: Astuces de ligne

Commencez par dessiner la forme de l'ordinateur en noir et blanc. Je pensais que les bouches d'aération de la photo avaient l'air cool, alors j'utilisais les lignes pour décorer un peu le mien.

Le moyen le plus rapide d’exécuter des alignements nets sur le côté d’un panneau [1] consiste à copier la ligne la plus en haut et la ligne la plus en bas (uniquement) et à l’aide de l'outil BLEND TOOL (B) de la barre d’outils. Créez un tableau de lignes parallèles les unes aux autres. Développez la sélection Menu> Objet> Développer. Ensuite, copiez et collez devant une copie de toute la zone du panneau latéral et déplacez vos lignes pour que vous puissiez utiliser les deux éléments pour créer un masque..

J'ai utilisé le même processus pour faire les boutons [2]. En utilisant des marches spécifiées entre deux objets, l’espacement est net et uniforme. Une dernière ligne de décoration sur le dessus de l'ordinateur est une ligne courbe [3]. Le moyen le plus rapide consiste à tracer un ovale avec un trait et, à l'aide d'une copie de la forme supérieure de l'ordinateur, créez un autre masque pour perdre les parties non désirées..



Étape 3: Dumb Down the Color

Vous savez que nous allons copier et coller ces ordinateurs au lieu de tous les dessiner correctement! Nous allons d'abord laisser tomber de la couleur sur l'ordinateur afin que nous n'ayons pas à recolorier ces cinq fois sur la piste. Depuis le fond est doux et insipide, Donnons aux ordinateurs des couleurs fortes et plates pour qu'ils contrastent bien les uns avec les autres.

J'ai utilisé des tons gris chaud, turquoise avec des lignes cyan, je sais! Cela semble affreux quand vous le décrivez à quelqu'un, mais visuellement, ça a l'air OK, parfois, il est utile de garder une note des combinaisons de couleurs qui fonctionnent, vous ne savez jamais quand vous en aurez besoin.!

J'ai laissé tomber quelques boutons de couleurs étranges sur les boutons car je voulais les minimiser et les faire interférer avec les gens. J'essaie souvent de comprendre ce que je veux que les gens regardent dans une illustration et d'essayer d'atténuer tout ce qui peut être une distraction visuelle..

Remarque: le noir sur le côté correspond au gris du haut, mais avec le curseur noir enfoncé à 100% de la palette de couleurs CMJN, gardez-le en profondeur et riche..



Étape 4: Tous les jeunes mecs

Je commence avec le soumissionnaire à l'arrière, sa tête est juste un ovale avec une forme brute pour les cheveux et un triangle de base pour un nez. Il a l’air un peu fade [4] au début, mais avec quelques mélanges bien placés, nous devrions pouvoir le soigner. La première chose à faire est de lui donner de la profondeur en ajoutant de l'ombre.

Je trouve une petite ombre derrière l'oreille et une sous le nez apporte vraiment un visage. Ajouter une peau plus sombre et en faire un dégradé donnera également vie à la peau. Le dégradé est très subtil et devient légèrement plus foncé à une extrémité lors de son utilisation. Dans ce cas, il fait un peu plus sombre en montant sur son front, un peu plus sombre sur le bout de son oreille et le même sur l’arête du nez..

La combinaison est verte uniquement parce que je pensais que le bleu ou le gris se perdraient contre l'ordinateur. Remarquez comment j'ai ajouté un dégradé assez sombre au bas de son costume? C'est pour donner l'impression qu'il se trouve vraiment à l'intérieur de cet écran d'ordinateur et que sa partie inférieure va dans l'ombre..

Pour vous aider à placer le gars dans le téléviseur, prenez une copie de l'écran et déployez le coin supérieur droit pour couvrir les endroits où sa tête et son bras peuvent aller [5]. Encore une fois, utilisez cette forme comme masque et recadrez le corps. Découvrez comment la duplication de formes, le collage devant et le masque sont un excellent moyen de réduire votre temps de travail. Vous pouvez diviser les formes et les découper proprement, etc., mais si elles ne s’impriment pas, pourquoi s’embêter! Alors, placez l'homme masqué sur l'écran de l'ordinateur et il devrait avoir l'air vraiment debout!



Étape 5: Variations sur un thème

Maintenant, nous avons un homme et un ordinateur tous colorés. Reproduisons-le trois fois et apportons de légères modifications aux nouvelles versions. Il suffit de quelques ajustements pour donner une nouvelle apparence à un dessin existant. Le gars qui est au milieu du dos, [6] tournons un peu le bras en avant et glissons aussi ses yeux en avant pour… peut-être changer la couleur de ses lèvres en blanc et tendre la voûte inférieure pour faire sourire. Tout à coup, nous avons un soumissionnaire qui est excité et désespéré de faire une offre.

De même, avec les autres gars, de petits changements mais perceptibles! Je les ai agrandis pour les aider avec la perspective et j'ai changé la bouche en un sourire narquois et demi.

Ce n’est qu’un petit détail, mais j’ai créé des boutons multicolores sur les ordinateurs et mélangé les motifs de chacun. Je ne sais pas pourquoi j'ai fait ça exactement? Mais je peux vous dire que cela semblait juste à l'époque.


Même affaire avec la femme. Dessinez une version, dupliquez-la et apportez quelques modifications mineures. Dans ce cas, il s'agissait de la couleur des cheveux et de la forme du visage. Pour que son bras droit [7] soit complètement à l'extérieur de l'écran. Je l'ai collé devant tout pour le placer en haut de la pile (en m'assurant que le bras ne débordait pas dans la zone du col et bloquant les pièces)

Le symbole dollar BTW correspond uniquement au texte mis à l'échelle horizontalement à 80% avec l'outil Echelle (S) et légèrement incliné verticalement à l'aide de l'outil Cisaillement (W), puis pivoté de quelques degrés. Souvent, avec ces enfants, vous pouvez les ajuster manuellement jusqu'à ce que cela semble correspondre à ce que vous essayez d'accomplir, sans que vous ne deviez être sorcier..


Étape 6: Illumination de l'ombrage décalé

La lampe est l'élément principal de l'illustration, mais je veux qu'elle reste légère et non surchargée comme avec les ordinateurs. Alors que j'essaie de transmettre l'idée de quelque chose de légèrement arrondi, un peu de lumière et de l'ombre peut être utile!


Je trouvais que plus les formes étaient irrégulières et les angles d’ombrage décalés, plus l’illustration devenait intéressante..

Le point culminant de la lampe aux enchères était un mélange réalisé avec l’outil de mélange (B) entre un ovale rose et un ovale rouge. En outre, une faible luminosité [8] était une vignette entre un rouge et un brun foncé à l’aide de l’outil Dégradé (G). Je voulais aussi projeter une ombre sur le cou de la lampe [9] et j'ai trouvé le moyen le plus rapide de le faire:

  • Dessinez approximativement une forme ovale derrière le vase.
  • Sélectionnez le col du vase et copiez, alors qu'il est toujours sélectionné appuyez sur Coller devant (qui le maintient sur lui-même mais PAS sur l'abat-jour jaune).
  • Puis déplacez Sélectionnez la forme ovale - de sorte que vous les ayez tous les deux en surbrillance.
  • Maintenant, dans votre palette Pathfinder, sélectionnez Intersect

Cela vous laissera avec votre forme d'ombre, un léger dégradé du rouge au brun lui donnera une belle ombre de gauche à droite.

Si vous n'avez pas votre palette Pathfinder (et il n'y a aucune raison de ne pas le faire! C'est un outil pratique), vous pouvez la trouver dans Menu> Fenêtre> Pathfinder (Maj + Commande + F9).

Pour donner à la lampe le sentiment d’être un produit électrique, je lui ai donné un bouchon [10] et fait de la flex une Course de 2 points avec un tiret de 2 et un écart de 2 en marron clair. J'ai collé une copie du flex derrière elle dans un marron foncé pour donner un beau contraste.


Étape 7: Faites une foule

À l'aide d'une autre copie de l'un des hommes que nous avons dessinés précédemment, faites-le pivoter verticalement à l'aide de l'outil de réflexion (O), puis placez-le derrière un podium. Le podium utilise les mêmes couleurs que l'ordinateur, sans les lignes latérales. Pour que le nouveau commissaire-priseur soit un peu plus différent du Joe habituel, je lui ai donné de jolies lunettes rondes et un nœud papillon (un type chic!). La même technique d'ombrage, bas sur sa veste, fonctionne pour le podium, tout comme pour l'intérieur de l'écran de télévision.


Non, nous avons tous nos gens et éléments, il est temps de commencer à les regrouper! Pour éviter tout problème de sélection, il est préférable de copier / coller devant et grouper OBJEC / GROUPE (G) chaque enchérisseur afin que nous puissions déplacer les personnes et les ordinateurs ensemble simplement en utilisant l'outil de sélection (V).


Étape 8: N'allez pas les noix!

Maintenant que vous avez travaillé d'arrache-pied pour créer des hommes et deux femmes légèrement différents, il peut être tentant de les dupliquer pour créer un armée orque comme dans "Le Seigneur des Anneaux" et faites vraiment une démonstration de tout votre travail. Mais pour être honnête, tout ce que vous faites est de diluer ce que vous avez fait, pas de l’améliorer. Pourquoi utiliser six cents personnes pour donner une idée quand six fera l'affaire. Au moins avec six, les gens pourraient voir certains des détails les plus fins que vous avez mis dans.



Étape 9: Répartissez l'action autour de vous

Lors de l'organisation des personnes, il n'y a pas de règles strictes. Les choses que je cherche généralement sont:

  • Répandre l’intérêt - dans ce cas, les femmes sont entrecoupées d’hommes, ce qui donne un sentiment naïf de groupe mixte..
  • Assurez-vous que les éléments qui vous intéressent ne sont pas masqués - pour que les têtes ne cachent pas les autres têtes derrière elles, et que les chauves-souris des enchères soient clairement visibles entre les personnes et les ordinateurs..


Étape 10: Contexte

Si nous lâchons un fond bleu et plat derrière l'illustration, cela aura l'air un peu terne, même si nous ajoutons une étoile éclatée derrière la lampe..


Ce qui serait bien de lui donner cette impression de cyberespace serait de laisser les ordinateurs flotter dans les airs et peut-être quelques étoiles scientifiques mystiques dispersées et des ombres douces. Commençons par ce fond. Plutôt que d'introduire une nouvelle couleur, il peut être intéressant d'introduire une nuance plus douce d'une couleur déjà présente dans l'illustration..

Je pense qu'une nuance plus douce du gris chaud au-dessus des ordinateurs ferait bien l'affaire. Et pour placer le focus au centre, ajoutons un dégradé du gris en haut de l'ordinateur à notre nouvelle couleur d'arrière-plan. Les formes ne doivent être que des triangles bruts, car elles se détacheront du bord de l'illustration..


Pour faire ressortir certains des éléments de l'illustration, tels que le marteau et certaines palettes de commandes, un dégradé circulaire allant de la couleur d'arrière-plan à un blanc cassé attirera, espérons-le, le regard! J'en ai aussi placé une derrière l'étoile de la lampe, juste pour la ramollir un peu. Le dégradé circulaire du type à l'arrière passe en réalité sous le dégradé éclaté de l'étoile. Je pourrais résoudre ce problème en redessinant les cercles et en utilisant certaines options de transparence, mais je pense que ce n'est qu'un petit point, je vais laisser tomber… cette fois!


Donc, presque là maintenant! Je pense que certaines ombres de fond solides qui sont vraiment évidentes (plutôt que ces halos blancs vaporeux) et permettront aux gens de savoir que ces personnes flottent vraiment là-bas et que certaines étoiles en épi composées de lignes à 2 points vont vraiment ajouter au mélange. Essayez de rendre les étoiles un peu déséquilibrées, pas trop symétriques et utilisez certaines des couleurs déjà illustrées..



Conclusion

Facile, hein! Gardez-le maigre, gardez-le moyen. Ayez quelques couleurs bien choisies et réutilisez-les chaque fois que vous le pouvez, et utilisez aussi souvent que possible la fonction Copier et coller avant. À votre santé.