Pixel art isométrique

Ce que c’est

Les jeux isométriques montrent le monde d’en haut et de côté, selon une diagonale, sans perspective : les lignes parallèles restent parallèles et les objets lointains ne sont pas plus petits. Les sols deviennent des losanges, et les murs partent selon deux pentes symétriques.

En vraie projection isométrique, ces pentes font 30° par rapport à l’horizontale. Le pixel art utilise presque toujours une pente un peu plus douce, où chaque ligne avance de deux pixels et monte d’un pixel. Cette pente fait environ 26.6°, et on l’appelle généralement isométrie 2:1 (à strictement parler, c’est une projection dimétrique).

Pourquoi 2:1

Sur une grille de pixels, une ligne n’a l’air nette que si ses marches se répètent régulièrement. Une ligne 2:1 est un escalier parfait : deux pixels, une marche, deux pixels, une marche. Une ligne à 30° n’a pas de motif aussi simple et donne des suites irrégulières d’un et de deux pixels, ce qui paraît crénelé.

2:1 simplifie aussi les tuiles. Une tuile de sol est un losange deux fois plus large que haut, par exemple 32×16 ou 64×32, et les tuiles s’assemblent sans espace.

Les angles de caméra

Si vous rendez depuis la 3D, la caméra doit être orthographique (sans perspective), tournée de 45° autour du modèle pour regarder le long d’une diagonale, et inclinée vers le bas de 30°. Avec cette inclinaison, une tuile de sol carrée se projette en un losange exactement deux fois plus large que haut, si bien que les bords du sol tombent sur des lignes 2:1 nettes. Une inclinaison plus forte ou plus faible donne d’autres rapports qui ne s’alignent pas aussi proprement.

Erreurs courantes

• Pixels doublés sur les lignes. Une ligne 2:1 doit faire exactement deux pixels par marche. Des suites de trois, ou des pixels empilés à la marche, rendent les bords épais.
• Mélanger les angles. Un bâtiment en 2:1 et un autre avec une pente plus raide cassent la grille.
• Oublier la hauteur. Les arêtes verticales restent verticales. La hauteur sur une grille 2:1 se mesure en pixels entiers ; choisissez combien de pixels de haut fait un mètre et tenez-vous-y.
• Caméras en perspective. Le rendu en perspective fait converger les lignes, et les tuiles ne s’emboîtent plus.

Comment le dessiner à la main

1. Dessinez un losange de tuile sur des lignes 2:1, par exemple 32×16.
2. Construisez les objets comme des blocs sur cette grille : dessus en losange, côtés verticaux.
3. Ombrez différemment les deux côtés visibles : l’un éclairé, l’autre dans l’ombre.
4. Gardez chaque bord oblique sur l’escalier 2:1.
5. Dessinez d’abord les personnages dans les quatre directions diagonales ; ajoutez les quatre autres si besoin.

Comment Pixor s’y prend

Dans Pixor, chaque côté est une caméra. La vue isométrique utilise un réglage 2:1, et vous pouvez aussi choisir une vue de côté, de trois quarts ou de dessus, ou régler n’importe quelle inclinaison. Des anneaux de 4, 8 ou 16 caméras donnent chaque direction. Avec une seule valeur fixe de Pixels/m sur les caméras, bâtiments, accessoires et personnages sont rendus en proportion sur la même grille.

Voir aussi

• Tailles de sprites : tuiles et personnages
• Contours
• Directions et le manuel de la scène