Mascotte cartoon : créez un bébé dragon sur Illustrator

Mascotte cartoon : créez un bébé dragon sur Illustrator

Programme : Illustrator

Difficulté : Intermédiaire

Temps estimé : 2 heures + 15mn (croquis)

Télécharger les fichiers sources
Vous devez être logués ou enregistrés pour télécharger !

Tresadenn (Philippe Cam) présente comment créer une icône cartoon sur Illustrator en utilisant l’outil filet, les dégradés de couleurs et les dégradés de formes.

Ces trois outils combinés sont des moyens parfaits pour réaliser des formes avec des niveaux de détails plus ou moins poussés. Ils permettent de rendre un effet de volume doux, idéal pour ce style, tout en étant faciles à  mettre en oeuvre.

Nous allons voir dans cette vidéo que la meilleure façon d’aborder cette illustration est de la traiter par séquence. Chaque élément : tête, corps, bras, … est isolé sur un calque distinct. La rigueur de travail et le traitement par élément sont deux des clefs pour la réussite de ce travail.


Croquis préparatoire

croquis dragon

(Croquis scanné)


Vous pouvez partir du fichier jpeg mis à  disposition dans les sources de ce tutoriel, ou simplement créer votre propre croquis sur papier. Dans ce dernier cas, avant de commencer votre brouillon, prenez en compte la destination de votre réalisation : elle doit pouvoir faire office d’illustration cartoon et servir en tant qu’icône.

Conseil : ne partez pas dans des formes trop complexes, le style cartoon mais surtout les icônes ne s’accommodent pas de détails. Il est évident qu’à  petite échelle ils disparaîtront.



  • Si vous en ressentez le besoin, aidez-vous de photos ou d’illustrations de référence : dessins animés, documentaires, bandes dessinées…
  • Partez de formes simples : aidez-vous de cercles, de triangles ou de carrés pour monter la structure de votre illustration.
  • Profitez-en pour concevoir votre dragon par morceaux (tête, bras, corps, …), cela vous aidera lorsque vous réaliserez ces éléments sur Illustrator.

Dans cet exemple, j’ai choisi de faire un dragon plutôt jeune, presque bébé. Pour cela quelques caractéristiques suffisent pour évoquer cette idée : une tête quasi équivalente au volume du corps, de grands yeux, une position assise (spécifique de l’enfance), ainsi que des ailes naissantes.

Conseil : Ne mettez pas votre croquis au propre, car d’une part ce serait une perte de temps (le but n’étant pas de partir d’un line art), d’autre part avoir des zones uniquement évoquées vous permettra d’avoir une latitude plus grande sur Illustrator.


Étape 1 : la tête

La première étape sur Illustrator consiste à  réaliser l’oeil en utilisant l’outil cercle. Le crâne, la langue, et la mandibule inférieure, eux, sont traités de manière séparée, principalement à  l’aide de l’outil filet.


Étape 2 : le corps

Le ventre est créé à  partir d’un cercle que l’on déforme jusqu’à  obtenir une silhouette oblongue.


Étape 3 : les membres

Les pattes sont créées à  partir de formes en V auxquelles on applique un dégradé de formes. Les bras quant à  eux sont conçus à  partir d’ovales que l’on remplit avec des dégradés radiaux. Les jonctions (coude et épaule) sont gérées grâce à  des masques d’opacité.


Étape 4 : les ombres et textures

Pour appliquer une ombre sur un élément (une corne par exemple), on duplique la forme, en veillant à  la coller sur place. Il suffit ensuite de changer le fond de cette forme et lui appliquer un dégradé avec transparence [Noir opaque -> Noir transparent]. Enfin, il faut veiller à  passer cet élément en mode [produit] avant de changer son opacité si besoin est.

Les effets de textures tels que les zones de brillance sur les papilles ou le vieillissement des cornes et des plaques sur le poitrail nécessitent différentes techniques. Pour les papilles, de simples cercles blancs avec une opacité réduite font l’affaire. En ce qui concerne le vieillissement des parties en os, on adopte la même technique que pour les ombres à  quelques exceptions près : le dégradé n’est pas noir mais brun, et il est appliqué à  des formes triangulaires qui simulent des entailles dans l’os.



Illustration finale du dragon

(Résultat final du tutoriel)


Conclusion

Il est important de penser à  la structure de votre illustration dès la base : trop d’éléments nuiraient à  la simplicité de l’illustration et ne seraient pas visibles en petit ou de loin. Cette structure – ou squelette de construction – détermine les formes de base à  utiliser lorsque vous passez sur Illustrator : c’est un point qu’il faut impérativement prendre en compte.

Ce style d’illustration partage également beaucoup de points communs avec la 3D et le digital painting dans la façon d’aborder la « modélisation ». Ces étapes pourraient être séquencées comme tel : base – volume – couleur – textures. Même si ces séquences ne sont pas exactement les mêmes dans cette vidéo, gardez-les à  l’esprit afin de procéder étape par étape…

à€ vous maintenant de réaliser votre propre dragon ou votre mascotte cartoon… et n’hésitez pas à  laisser vos commentaires et vos questions !


Coming soon…

Après avoir abordé la création d’icône cartoon sur Illustrator, voici un coup d’oeil à  mes prochaines contributions sur Living Tuts :

  • Illustrator : Maitrisez   l’outil 3D et créez des schémas didactiques en 3D isométrique. Ce tutoriel sera coupé en 2 : une partie d’explication de l’outil, suivie de la mise en application avec une illustration de chantier
  • Digital Painting : Réalisez 3 illustrations aux ambiances différentes, à  partir d’un même thème
  • WIP « Pandore«  : zoom sur quelques techniques de digital painting
  • Digital Painting : trouvez l’inspiration au quotidien

à€ bientôt sur LT !

22 Comments to “Mascotte cartoon : créez un bébé dragon sur Illustrator”

  • résultat très classe et tuto bien expliqué , encore du bon travail de l’équipe

    bravo :D

  • Merci beaucoup pour ce tutoriel, très bien expliqué. bravo !

  • [...] Visionner le tutoriel sur Living Tuts. [...]

  • Tutoriel bien complet et fignolé comme il faut mon cher Philippe ! Du bon. :)

  • Merci ! Content que ça vous plaise et vous aide :)

  • Trop nice ! Merci beaucoup pour ce tuto ;)

  • Merci !!!

    Je vais essayé de faire sa avec un lapin cartoon que j’ai déssiner , si le résultat est satisfaisant , je le post ;)

  • Impatient de voir ce que ça donnera… :)

  • Il a plus de classe sur papier ^^

  • Très beau rendu !! je vais dessuite essayé ^^

  • Merci pour le tutoriel, tout est bien expliqué. Les couleurs du dragon sont magnifiques. J’adore !!! :-))

  • Mec tes tuto c’est du miel ! Continue comme ca c’est vraiment super

    • Thanks ! Je suis en train d’en préparer un autre aux petits oignons

  • hm vraiment un tres bon tuto. Bien expliquer et tous.J’est vraiment apricier t sa ma bien instruit.
    Continue comme sa ^_^. Good job.

  • Trés bon tuto, j’ai utilisé Illustrator pour la première fois, en recopiant assez fidelement l’original, j’ai refais un dessin a main levé, scanné, et changer les couleurs, et j’ai vraiment appris beaucoup de chose. Merci pour ce tuto trés complet.

  • Bonjour,

    Je n’ai pas suivi le tuto, mais j’ai regardé de prêt le fichier source, on voit tout le travail réalisé, c’est vraiment très impressionnant. Bon travail !

    Juste une p’tite remarque, peut-être enlever la video du fichier source, ça alourdi considérablement le téléchargement !

    A quand le suivant ? :D

    • Le suivant sortira lorsque mon travail me laissera plus de temps pour Living Tuts, j’espère donc dans pas longtemps ! :)

      Quant au poids des fichiers mis à disposition : Living Tuts est spécialisé dans la formation. La vidéo est donc l’élément essentiel du pack de téléchargement puisqu’il garantit à chaque utilisateur le bon visionnage du tuto (avec ou sans connexion web et/ou accès au service de Vimeo).

      Il se peut que dans une future mouture du site, l’équipe propose deux types de téléchargement : avec et sans vidéo.

      A bientôt !

  • Super tuto :)
    Très bien expliqué et en plus t’as une voix qui passe bien ^^

    J’aurais une petite question, comment tu fais l’ombre du crane sur la mandibule inferieure ?

    Vu que ce sont deux formes maillées (outil filet), impossible d’utiliser une transparence produit.

    Merci d’avance ^^

    • Hello Baldurz,
      En fait il suffit de dupliquer l’objet mandibule, le repasser en objet classique (objet>tracé>décalage), tu obtiens une forme dupliquée de ton objet mais sans le maillage. Tu peux ensuite appliquer un dégradé (opaque > transparent) en mode produit.
      En espérant que ça te soit utile.

  • Super tuto, je n’ai pu m’empêcher de constater la ressemblance avec « Pitchon le Dragon », une des armes de l’application PhoneFight. Avez-vous participé au développement de cette appli’?
    Constatez :
    –> http://i50.tinypic.com/t7fhvc.png

    • Bonjour Louise, merci pour le commentaire :)
      En fait je n’ai pas participé au dév de l’appli ni été contacté par l’éditeur… ce qui aurait été la moindre des choses en fait :D L’illustration que j’ai créée pour le tuto est antérieure d’au moins deux ans à la sortie de l’appli, donc pas de doute sur qui a « copié » sur qui ;)

  • Très instructif ;)
    Merci

Laisser un commentaire