Mixels

Ce que c’est

En pixel art, chaque pixel de l’image doit avoir la même taille à l’écran. Un mixel (pixel mélangé) brise cette règle : un sprite est dessiné avec de gros pixels de 4×4 pixels d’écran alors qu’un autre à côté utilise 2×2, ou un objet est tourné ou mis à l’échelle si bien que ses pixels deviennent irréguliers.

Causes fréquentes :

• Agrandir un sprite ×2 pour en faire une « grande » version.
• Mélanger des assets créés à des résolutions différentes, par exemple un tileset de 16 pixels avec des personnages de 32 pixels dessinés à la même taille dans le monde.
• Faire tourner des sprites dans le moteur selon des angles autres que 90°.
• Agrandir tout le jeu d’un facteur non entier, si bien que certains pixels de l’image deviennent deux pixels d’écran et d’autres trois.
• Tramage ou contours à une taille de pixel différente du reste du sprite.

Pourquoi les artistes l’évitent

La grille fait partie du look. Quand tout partage une même taille de pixel, l’œil accepte la basse résolution comme un style. Quand les tailles se mélangent, les parties grossières ont l’air bâclées et les parties fines semblent déplacées. On dirait plusieurs jeux de graphismes collés ensemble.

Erreurs courantes

• Agrandir un boss. Un grand ennemi obtenu en agrandissant un petit 3× a des pixels trois fois plus gros que tout le reste. Les grands sprites doivent être dessinés en grand.
• Zoomer la caméra en continu. Un zoom de 1.5× produit des pixels inégaux sur tout l’écran. Utilisez des échelles entières.
• Rotation libre. Faire tourner un sprite de 30° dans le moteur le rééchantillonne et casse la grille. Dessinez ou rendez plutôt des images tournées.
• Particules et interface à une autre échelle. Les effets dessinés sur une grille plus fine que celle des personnages détonnent.

Comment l’éviter à la main

1. Choisissez une seule résolution artistique pour le monde du jeu, par exemple une vue de 320×180 ou de 640×360.
2. Dessinez chaque asset pour cette résolution, à sa taille prévue à l’écran.
3. Affichez le jeu à des multiples entiers de cette résolution.
4. Quand vous avez besoin d’une version plus grande de quelque chose, redessinez-la à la taille supérieure avec la même taille de pixel.
5. Pour une rotation, dessinez des images séparées pour chaque angle.

Comment Pixor s’y prend

Donnez aux caméras d’un projet une valeur fixe de Pixels/m et Pixor rend tout à cette seule échelle (par défaut, chaque caméra ajuste plutôt son sprite à sa propre taille). Un chevalier de deux mètres et une caisse d’un mètre sortent à des tailles proportionnées l’une à l’autre, avec la même taille de pixel, si bien que les assets d’un même projet s’assemblent sans mixels. Un sprite plus grand est rendu plus grand, avec plus de détails, plutôt qu’agrandi. La rotation est gérée par les caméras : chaque côté est rendu comme ses propres images, donc rien n’a besoin d’être tourné dans le moteur. Le pivot est verrouillé sur un pixel dans chaque image et chaque côté, ce qui garde les sprites sur la grille pendant l’animation.

Voir aussi

• Tailles de sprites : choisir une échelle et agrandir par nombres entiers
• Animation sous-pixel
• Directions et le manuel des réglages