Quelle marge a-t’on avec quelques pixels pour se démarquer des styles déjà existant ? La forme isométrique ou non, les patterns, et le nombre de couleurs (shading)? Le style d’animation, les formes, la taille, … ?
Décrire des styles, même s’il existe moultes façons de faire, je les décrirai par des exemples de jeux du point de vue historique :
Sans être précis de qui a fait quoi en premier, mais de ce qui reste accessible au détour d’une conversation à l’ombre d’un sapin, avec un arrière goût de nostalgie ou pas si on est millenial ou pas.
🏓Pong, 👾Space invader, ⍩⃝ Pac man, 🦍Donkey Kong, 🧩Tetris

Quelques titres :
- 2 couleurs noir et blanc — Pong [ taito, Arcade sport, 1972]
- 4 couleurs noir, blanc, vert, rouge — Space invader [ Atari inc., Arcade shoot ’em up, 1978 ]
- 8 couleurs noir, blanc, bleu 1, jaune, rouge, rose, bleu 2, orange — Pac man [ Namco , Arcade labyrinthe, 1980 ] Pac-Man is not in Unicode
- Retro gaming ! — Boom 1981! [ Donkey kong, 1981] [ Mario, Arcade plates-formes] [ 1942, Arcade scrolling shooter, 1984 ] [ Arkanoid, Arcade casse-briques, 1982] [ Tetris, Jeu de puzzle, 1984] etc…
- « indie game » — Beaucoup de couleurs ** Les jeux indépendants d’aujourd’hui !

🏓Pong, 👾Space invader, ⍩⃝ Pac man
Quand le boum s’est-il produit ? 1981 ? Quels sont les jeux les plus marquants ?
** Beaucoup de style, la courbe de progression a-t’elle atteint le plafond en 2022 ?

Approfondir ses connaissances ?
Il y a deux articles en fr et en, bien différents parlant de pixel art sur wikipedia :
https://fr.wikipedia.org/wiki/Pixel_art
https://en.wikipedia.org/wiki/Pixel_art
Et sur les Indies games :
https://fr.wikipedia.org/wiki/Jeu_vid%C3%A9o_ind%C3%A9pendant
https://en.wikipedia.org/wiki/Indie_game

Conclusion et notes
Le but de cet article était de dessiner un peu avec l’excellent soft aseprite :
https://www.aseprite.org/ une pépite, une usine à pixel avec d’incroyable outils !
D’utiliser l’astuce suivante sur les images pour les afficher en pixel perfect en affichant en 256×256 px des images qui ont un source de 32x32px, ajouter la classe pixelart :
.pixelart {
CSS
image-rendering: pixelated;
}
La valeur pixelated de la propriété image-rendering semble nécessaire, mais semble ne pas marcher sur smartphone.
