Graphismes 2D pour les programmeurs

Ombrage de base – la balle

Apprenez à ombrer vos scènes.

3 commentaires

Article lu fois.

Les deux auteur et traducteur

Chris Hildenbrand

Traducteur : Alexandre Laurent

L'article

Publié le 12 mars 2015

Version PDF Version hors-ligne

ePub, Azw et Mobi

Liens sociaux

I. Ombrage de base▲

Ce tutoriel sur l'ombrage est l'un des plus demandés. Comment faites-vous ? Pourquoi le faites-vous ? Où dois-je ajouter des ombres et quelles couleurs dois-je utiliser ? L'éclairage est un domaine vaste et les possibilités sont quasi infinies. Dans ce tutoriel, j'ai essayé de couvrir les bases fondamentales avec l'une des formes les plus simples : la balle. Correctement utilisés, les lumières et ombrages donneront tout à votre scène et les objets sembleront plus spectaculaires, réels et visuellement attrayants.

Commençons avec un cercle. Je sais, cela doit être la centième fois que j'écris ces mots, mais c'est toujours l'objet de départ le plus facile à manipuler.

Commencez avec un cercle et remplissez-le avec une couleur. C'est un cercle plutôt plat.	Pour lui donner un peu de relief, ajoutez un duplicata plus clair ainsi qu'un second encore plus clair pour le reflet.	Pour le rendre encore plus sphérique, vous pouvez utiliser l'outil de dégradé et choisir un dégradé radial.
La modification de la position de la lumière doit entraîner le déplacement du centre du dégradé.	Ou encore, dans le cas d'une balle en cell-shading – le repositionnement des formes les plus claires.	Des lumières moins intenses donnent des reflets moins grands et plus d'ombre à la forme.
Vous pouvez utiliser les mêmes couleurs et juste altérer les positions des contrôleurs du dégradé.	Pour obtenir un effet encore plus brillant à la place d'une surface terne, dupliquez le cercle, rétrécissez-le et dupliquez-le encore une fois.	Utilisez le second cercle pour couper la forme blanche afin d'obtenir un croissant. Avec un peu de transparence et deux reflets, vous obtenez un éclat.
Pour rendre la scène plus intéressante, la plupart du temps, vous allez ajouter une seconde source lumineuse avec une autre couleur. Cela ajoute de l'intérêt et améliore la qualité réfléchissante de l'objet.

Le résultat n'est pas réaliste, mais n'est pas trop cartoon. Si vous recherchez le second, le cell-shading en utilisant deux à quatre couleurs donnera un résultat satisfaisant. Pour avoir une balle plus réaliste, les éléments de reflets nécessitent plus de travail – et une recherche d'images sur Google pour quelque chose comme les décorations de Noël.

Voyons les conséquences de la modification des lumières sur notre balle.

Tout comme pour les reflets, l'ombre change suivant la position de la lumière.	L'ombre « pose l'objet sur le sol ». C'est la connexion à la surface sur laquelle il est.	Sans l'ombre, l'objet semble flotter et être suspendu dans l'air.

Essayez différentes variations pour les reflets – par exemple une série de croissants.	Différentes intensités lumineuses peuvent provoquer des reflets plus clairs, mais aussi des ombres plus sombres.	Un effet lumineux populaire est l'effet de verre avec un dégradé doux de la transparence sur la forme (un duplicata plus petit du cercle avec une vague).

Si la balle se rapproche de la source lumineuse, l'effet de la lumière doit être plus fort – des reflets plus légers et des ombres plus sombres ainsi qu'un effet amoindri pour la source lumineuse secondaire.

Une question que l'on m'a souvent demandée est à propos du choix des couleurs. La configuration la plus basique sera composée d'une lumière blanche pour les reflets et noire pour les ombres. D'après moi, le résultat est souvent froid et morbide. Je préfère une lumière plus chaude et ma couleur favorite pour l'ombrage est le violet foncé ou le marron foncé (avec une transparence équilibrée). Vous obtenez de cette façon des tons plus chauds et des couleurs plus vivantes.

Encore une fois, la scène que vous essayez d'influencer détermine les couleurs de votre lumière et des ombres. Par exemple, une scène sous-marine serait très étrange avec des ombres marron ou rouges – vous opteriez plutôt pour une sélection de couleurs blanche/bleue/verte. Un après-midi d'été aura une lumière jaune/or/marron foncé ou une grande palette rougeâtre – alors qu'une journée d'hiver aura une lumière blanche/gris bleutée et noire.

Voici quelques exemples d'effets de couleurs sur l'ombrage d'un objet.

Une lumière blanche avec une ombre noire donne un résultat très froid.	En prenant une lumière avec un jaune très lumineux et une ombre rouge foncé, vous obtenez une scène beaucoup plus chaude.	Ici, le jaune est plus sombre et l'ombre est violette.
Une lumière brillante rend l'objet plus brillant et l'ombre devient plus sombre,	alors que l'atténuation de la lumière dans une scène sombre donne des couleurs plus proches.	La lumière peut aussi refléter la configuration (par exemple, une fin d'après-midi en automne grâce à une lumière orange).
Pour ajouter de la complexité à l'éclairage d'un objet, il y a une lumière indirecte – une lumière qui rebondit de la surface des autres objets – par exemple le dessus d'une table blanche.
L'utilisation de deux sources de lumière peut rendre l'objet bien plus intéressant,	mais plus vous rajoutez des sources lumineuses plus cela devient confus,	et finalement ce n'est plus « lisible ».

Pour finir, c'est une question d'expérimentations, trouver la bonne lumière pour donner le ressenti de votre scène et s'y tenir pour tous les objets de la scène. Amusez-vous avec ! Essayez de trouver quelque chose qui correspond à la sensation et à l'atmosphère que vous recherchez et ne soyez pas effrayé de tester des combinaisons de couleurs « étranges ».

Si vous créez des ressources pour un jeu, gardez à l'esprit les changements de scènes. Pour éviter de créer un éclairage dynamique - qui semble merveilleux, mais qui demande énormément de travail de programmation ainsi que de graphisme – je suggère de rester sur une configuration d'éclairage simple (par exemple de haut en bas – ainsi l'inversion horizontale du personnage n'entraîne pas la création de nouvelles ressources et garde la scène consistante). Il peut aussi être pratique de séparer les ombres des objets pour rendre cohérents les sauts et le parcours de surfaces non horizontales.

J'espère que cela vous a été utile. Je prévois d'ajouter des formes et objets plus avancés à ce tutoriel. Amusez-vous !

II. Remerciements▲

Cet article est une traduction autorisée de l'article paru sur 2D Game Art for programmers. Je remercie chaleureusement Chris Hildenbrand de nous avoir permis de le traduire.

III. Commenter▲

Vous pouvez commenter cet article ou présenter vos réalisations sur le forum.

Vous avez aimé ce tutoriel ? Alors partagez-le en cliquant sur les boutons suivants :

Les sources présentées sur cette page sont libres de droits et vous pouvez les utiliser à votre convenance. Par contre, la page de présentation constitue une œuvre intellectuelle protégée par les droits d'auteur. Copyright © 2014 Chris Hildenbrand. Aucune reproduction, même partielle, ne peut être faite de ce site ni de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.