Tailles de pixel art expliquées : 16x16, 32x32, 64x64 et 128x128 (guide gratuit)

Le pixel art 16 par 16 est une grille de 256 cellules : 16 colonnes, 16 lignes, une couleur par cellule. Ce nombre est le cahier des charges. Chaque marque que vous posez est une soustraction sur un budget fixe, et ce budget est déterminé avant même que vous ne dessiniez quoi que ce soit.

La taille décide du niveau de détail avant même que vous ne dessiniez un pixel. Une grille 16x16 ne peut pas contenir un visage lisible. Une grille 64x64 ne peut pas contenir une foule. Ce guide couvre les quatre tailles qui représentent la majorité du travail sur les jeux, les icônes et les fonds d'écran - 16x16, 32x32, 64x64 et 128x128 - avec le nombre de cellules, l'usage typique, le mode d'échec et le budget de couleurs de chacune. Il couvre aussi les deux familles de grilles que les gens désignent habituellement par « grille de pixel art » : les constructions en blocs Minecraft, où l'unité est un bloc plutôt qu'un pixel, et les tableurs, où l'unité est une cellule.

Réponse rapide : taille = budget de détail

Une taille de grille est une limite sur le nombre de marques distinctes dont vous disposez. Le 16x16 vous donne 256 cellules. Le 32x32 vous en donne 1 024. Le 64x64 vous en donne 4 096. Le 128x128 vous en donne 16 384. C'est là tout le budget, et il est déjà dépensé au moment où vous avez esquissé une silhouette.

La conséquence, c'est que le détail n'est pas quelque chose que l'on ajoute à la fin : c'est quelque chose que la grille permet dès le départ. Un œil coûte 2 à 6 cellules en 16x16. Le même œil en 64x64 peut s'offrir une ligne de paupière, un iris, une pupille et un unique reflet spéculaire - 20 à 40 cellules. Même élément, coût différent, parce que la grille a changé le dénominateur.

Le remplissage est en concurrence avec tout le reste. Le corps d'un personnage en 16x16 engloutit 60 à 120 cellules de couleur unie. Il reste alors environ 130 cellules pour le contour, le visage, les mains, un objet tenu et d'éventuelles ombres internes. Trois formes internes distinctes n'y survivront pas. Deux y survivront, si elles se touchent.

16x16 : personnages et objets

Avec 256 cellules, le pixel art 16x16 est la plus petite taille qui se lit encore comme un personnage plutôt que comme un symbole. La contrainte, c'est la silhouette. Si le contour extérieur n'est pas identifiable en soi, rien de ce que vous ferez à l'intérieur de la grille ne le corrigera, car il n'y a pas de place intérieure pour expliquer ce qu'est la forme.

La méthode de travail consiste à tout dessiner d'abord en une seule couleur unie, puis à lire le contour. Si une plaque de poitrine et un bras fusionnent en une seule masse, c'est la pose qui est fausse, pas la palette. Corrigez-la pendant la passe en aplat, où une modification vous coûte huit cellules au lieu d'un redessin complet.

Le 16x16 s'associe aussi naturellement aux tuiles. Un jeu de tuiles se répète, si bien que l'œil cesse d'inspecter les cellules individuelles et se met à lire un motif et un rythme. C'est la seule situation où une grille aussi petite n'est pas un compromis.

Un objet, une pose, une idée par grille : une épée, une potion, une pièce, un tonneau, un slime, un poteau indicateur, une tuile de mur, une case d'inventaire. Les objets plats avec un contour marqué et une couleur d'accent sont le point d'équilibre idéal. Un bouclier fonctionne parce que la forme est une seule plaque arrondie ; dès que vous ajoutez une sangle, un umbo et un bord comme trois formes internes distinctes, il cesse d'être lisible.

Les visages et le texte. Un œil plus une bouche, cela fait 2 à 4 cellules avant toute ombre, et à cette taille une bouche se lit comme un pixel parasite plutôt que comme une expression. Tout élément comportant deux formes internes qui ne se touchent pas - une potion avec une ligne de verre et une ligne de liquide - s'effondre en une tache. Un texte de moins d'environ 5 cellules de haut est illisible ; utilisez plutôt une police d'interface séparée au lieu de dessiner des lettres dans la grille.

32x32 : sprites de jeu

Le 32x32, c'est 1 024 cellules, et c'est la taille à laquelle la plupart des sprites de jeu 2D sont dessinés, car elle tient une pose lisible sans exiger un portrait. Vous pouvez séparer la tête du torse, mettre une arme dans une main, montrer quelle jambe est en avant, et avoir encore des cellules pour une ombre à deux tons sur le corps.

Le nombre de couleurs qui l'accompagne : 12 à 16 couleurs au total, contour compris. Une répartition qui fonctionne : une couleur de contour, trois ou quatre rampes de trois paliers chacune (base, ombre, rehaut), un ou deux accents, et le transparent. Une ombre à deux tons signifie qu'une couleur de corps apparaît au moins deux fois - une fois éclairée, une fois ombrée. Si chaque couleur de la palette apparaît exactement une fois, vous avez dessiné du bruit, pas une forme.

L'erreur : quand un sprite 32x32 semble faux, la plupart des gens ajoutent une couleur. Cela ne corrige rien, car le défaut est presque toujours la silhouette - un membre qui ne se détache pas du torse, ou une tête exactement aussi large que les épaules. Redessinez le contour en noir uni et regardez-le. Si la forme noire n'est pas identifiable, aucune palette ne la sauvera.

64x64 : icônes et portraits

Le 64x64, c'est 4 096 cellules, et c'est la première taille de cette liste où un visage est un visage plutôt qu'un symbole. Un œil dispose maintenant de 8 à 20 cellules : un blanc de l'œil, un iris, une pupille, une ligne de paupière et un reflet spéculaire. Ce reflet est la raison pour laquelle les portraits en 64x64 fonctionnent et pas ceux en 32x32 - en 32x32, il n'y a aucune cellule à lui consacrer.

Ce qui change à cette taille, c'est la partie du dessin qui porte la lisibilité. En 16x16, c'est le contour. En 64x64, c'est l'ombrage. Vous dessinez désormais une forme, il vous faut donc des rampes : 3 à 5 paliers par matériau, et chaque matériau reste sur sa propre rampe. Une peau éclairée par la même lampe que l'acier ne paraîtra cohérente que si la rampe de l'acier a un contraste plus élevé que celle de la peau. Le métal se lit comme du métal à cause de l'écart de valeur, pas de la teinte.

Là où ça échoue : les foules. Le 64x64, c'est un seul sujet. Deux figures qui se partagent la grille obtiennent environ 2 000 cellules chacune, ce qui ramène aux problèmes du 32x32 avec une composition pire. Réservez le 64x64 à un sujet unique et dépensez les cellules restantes en arrière-plan à contraste délibérément faible, pour que le sujet se détache par la valeur plutôt que par la couleur.

128x128 : fonds d'écran et scènes

Le 128x128, c'est 16 384 cellules. À cette taille, un sprite isolé cesse d'être le sujet et devient un objet parmi d'autres dans une composition. Un personnage qui occupe un tiers du canevas fait environ 42x128 - à peu près 5 300 cellules - et tout le reste de la grille est du décor : sol, ciel, architecture, accessoires.

Le plus contre-intuitif, c'est qu'une grande grille a besoin de moins de couleurs par objet, pas plus. En 16x16, vous pouvez consacrer 12 couleurs à un seul personnage parce que toutes font un travail structurel. En 128x128, six objets à 12 couleurs chacun, cela fait 72 couleurs en concurrence, et l'œil ne distingue plus ce qui est au premier plan. Le travail de scène à cette taille garde généralement chaque objet sur une rampe de 4 à 6 couleurs et sépare les objets par bandes de valeur - premier plan sombre, plan moyen, ciel clair - plutôt que par la teinte.

Les réglages techniques comptent plus ici qu'aux petites tailles. Dessinez en 1x et zoomez à 2x ou 3x, jamais avec un zoom lissé. Lorsque vous exportez pour un fond d'écran, n'agrandissez que par des nombres entiers - 2x, 3x, 4x. Un agrandissement de 2,5x produit des pixels de largeur inégale et la grille cesse de paraître intentionnelle.

Nombre de couleurs par taille

La règle qui surprend : à mesure que la grille grandit, la palette se réduit généralement par élément. Les petites grilles imposent la réutilisation - une couleur qui sert de contour, d'ombre et de cheveux - et c'est précisément cette réutilisation qui rend le pixel art 16x16 cohérent. Les grandes grilles vous tentent avec une couleur unique pour chaque surface, et le résultat se lit comme une photographie dont on aurait baissé la résolution.

Le nombre qui compte n'est pas la taille totale de la palette, mais le nombre de couleurs par élément. Un sprite 32x32 avec 16 entrées de palette réparties sur 4 éléments est cohérent. Une scène 128x128 avec 24 entrées au total peut sembler riche si ces entrées sont attribuées par valeur - sombre, moyen, clair - et réutilisées d'un objet à l'autre.

La raison technique, c'est que le pixel art se lit par contraste de voisinage. Deux cellules voisines qui diffèrent en valeur créent un bord. Deux cellules voisines qui diffèrent en teinte mais se rejoignent en valeur créent de la bouillie. Ajouter une couleur sans ajouter de contraste de valeur dépense une case de palette sans acheter de forme lisible ; c'est pourquoi « ça a l'air plat » est généralement un problème de valeur, pas de teinte.

Pixel art et grilles Minecraft

Le pixel art Minecraft se mesure en blocs, pas en pixels. Un bloc est une cellule de l'image. Un sprite 16x16 devient un mur de 16x16 blocs : 256 blocs, une construction que l'on peut terminer en une soirée. Le même sprite en 64x64 fait 4 096 blocs, ce qui est un tout autre type de projet, avec un tout autre engagement.

Cette correspondance est importante parce qu'un bloc n'est pas un pixel. Un pixel est une couleur unie que vous choisissez. Un bloc est une couleur unie avec une texture et un éclairage intégrés - la laine et le béton à la même couleur nominale ne se lisent pas de la même façon à distance, et les textures de blocs chargées ajoutent un bruit qu'un pixel n'aurait jamais. C'est pourquoi une photo exige un nombre de blocs plus élevé qu'un dessin : une photo porte des dégradés, et un dégradé coûte des cellules. En 32x32, un visage devient de la boue en blocs ; en 64x64 ou 128x128, les formes survivent au bruit de texture.

Grille de construction et grille d'art sont deux choses distinctes. Une grille d'art est plate par définition : une cellule, une couleur, aucune profondeur. Une grille de construction est tridimensionnelle - vous pouvez placer des blocs à n'importe quelle hauteur, et la grille n'apparaît que là où vous regardez un plan plat. Cela crée une décision qu'un éditeur matriciel ne pose jamais : que mettre derrière l'image. Un mur de fond dans un bloc à faible saturation fait ressortir le sujet ; laisser l'image flotter pour que le terrain apparaisse à travers les interstices se lit comme un dégât.

Pixel art sur tableur et Google Sheets

Dans un tableur, une cellule est un pixel. La grille est tout ce que la feuille permet et tout ce que vous êtes prêt à faire défiler. Une image 32x32 fait 1 024 cellules. Une image 64x64 en fait 4 096. Une image 128x128 en fait 16 384 cellules - affichable, mais fastidieuse à saisir à la main.

La mise en forme conditionnelle est la palette. Vous écrivez des règles qui colorent une cellule selon sa valeur, puis vous tapez une lettre ou un chiffre dans chaque cellule pour choisir une couleur. L'alternative est le remplissage manuel, plus simple à mettre en place, mais qui vous laisse sans moyen de recolorer toute l'œuvre en modifiant une seule règle. Si vous comptez retoucher l'image, utilisez des règles. S'il s'agit d'une pièce unique, les remplissages sont plus rapides.

La voie du tableur est véritablement le bon outil dans deux cas. La collaboration : les feuilles se partagent nativement, plusieurs personnes peuvent modifier en même temps, et il existe un historique des modifications - mieux que de s'envoyer un PNG par courriel. Les grilles pilotées par les données : une couleur de cellule peut être calculée à partir d'une formule, de sorte que la pièce peut réagir à un chiffre, ce qu'aucun éditeur matriciel ne fait. C'est le mauvais outil pour l'animation. Une feuille n'a ni images, ni pelure d'oignon, ni chronologie. Animer dans une feuille signifie dupliquer la grille et échanger des plages, et au bout d'environ deux images, c'est plus lent que n'importe quel éditeur dédié.

Outils gratuits pour chaque taille

Choisissez selon ce que vous avez déjà, pas selon une liste de fonctionnalités. Si vous avez une photo et qu'il vous faut une silhouette de départ, utilisez le convertisseur. Si vous avez une page blanche et une taille fixe, utilisez l'éditeur. Si vous n'avez aucune idée de quoi dessiner, utilisez le générateur. Tous produisent une grille que vous pouvez continuer à modifier ailleurs.

Chaque outil a sa propre page ; cette section n'est que le routage.

Voyez un monde 16x16 en 3D

Une tuile 16x16, c'est 256 cellules, et dans un monde 3D, elle devient une texture. Les textures de cette taille ne restent nettes que si vous les filtrez correctement. En termes Three.js : réglez magFilter et minFilter de la texture sur NearestFilter et désactivez les mipmaps pour les objets que vous voulez nets de près ; gardez les mipmaps activés pour le terrain lointain, sinon la grille du sol scintille lorsque la caméra bouge. C'est le compromis du bas de la gamme - le filtrage au plus proche garde les pixels lisibles à deux mètres et crée de l'aliasing à cinquante.

The Cyclops' Island fonctionne presque entièrement avec des tuiles en petite grille : arbres, rochers, rivage, accessoires et objets, chacun dessiné en 16x16 ou 32x32 et réutilisé dans toute la scène. Mini World utilise la même approche avec un encombrement plus réduit par objet. Les sprites sortent d'Agent Sprite Forge, sont empaquetés dans un atlas et placés comme objets par le constructeur de jeux 3D, là où une description écrite se transforme en une disposition jouable.

Le gain est arithmétique, pas esthétique. En 16x16, vous perdez la capacité de dessiner un visage précis et vous gagnez une tuile que vous pouvez vous permettre de répéter. 256 cellules multipliées par quelques dizaines de tuiles, c'est un lieu. 16 384 cellules multipliées par quelques dizaines de tuiles, c'est un projet que personne ne termine. Quand vous regardez la scène ci-dessous, regardez le sol et les accessoires plutôt que le ciel - c'est sur le sol que la grille est visible.

Entrez dans le monde auquel il appartient

Un sprite est un personnage qui n'a nulle part où se tenir. La dernière étape est celle que personne d'autre ne propose : prenez la feuille que vous venez de créer et placez-la dans un monde où quelqu'un peut se promener — une petite île, une planète, un coin de rue sous la pluie. Chaque monde de ce site a été créé à partir d'une seule description écrite et publié sous forme de page jouable.

FAQ