Éditeur de pixel art, gratuit

Le pixel art est né dans le matériel, puis a choisi d’y rester

Le pixel art n’a pas été, dans ses premières décennies, une esthétique, c’était une contrainte. L’Atari 2600 (Summer CES, 4 juin 1977) dessinait son image avec un Television Interface Adaptor qui exposait deux sprites « player » de 8 pixels de large et les réutilisait ligne par ligne ; les programmeurs apprirent à « courser le faisceau » pour obtenir plus de couleurs visibles à la fois. Le Commodore 64 (janvier 1982) offrait huit sprites matériels de 24×21 et une palette VIC-II de 16 couleurs qui devint la signature visuelle d’une décennie entière de jeux européens. La NES (1985) utilisait un PPU Ricoh 2C02 avec une palette maître d’environ 54 couleurs distinguables dont 25 pouvaient être à l’écran à la fois, réparties en une palette de fond de 13 couleurs et quatre sous-palettes de sprite à 3 couleurs, et la tuile de sprite 8×8 devint l’unité de design qu’on ressent encore dans le pixel art d’aujourd’hui. La Game Boy DMG-01 (1989) poussa la limite plus loin : quatre nuances d’une seule couleur sur un LCD réfléchissant de 160×144 qui apparaissait olive en plein jour. Aucune de ces palettes n’a été choisie pour sa beauté ; elles ont été choisies par ce que la puce pouvait faire pour quelques centimes.

Quelque part dans les années 1990, l’équation s’est inversée. Le matériel a rattrapé son retard ; le pré-rendu puis la 3D temps réel sont devenus la norme pour la production à gros budget. Le pixel art aurait pu mourir là. Au lieu de cela, il est devenu quelque chose de plus rare : un choix esthétique délibéré. Daisuke Amaya (qui signe ses œuvres simplement « Pixel ») a passé cinq ans entre la fac et un emploi à plein temps à assembler Cave Story, sorti en freeware le 20 décembre 2004. Markus « Notch » Persson a posté la première version de Minecraft sur TIGSource le 17 mai 2009, avec des textures de blocs par défaut de 16×16 pixels, toujours le format canonique des packs de ressources. Eric « ConcernedApe » Barone a livré Stardew Valley le 26 février 2016 après environ quatre ans et demi de développement en solo, dessinant chaque sprite lui-même dans Paint.NET. Heart Machine a publié Hyper Light Drifter (mars 2016) ; Maddy Thorson et Noel Berry ont publié Celeste (janvier 2018), à l’origine un prototype de quatre jours sur la console fantastique PICO-8 de Joseph White. Motion Twin a livré Dead Cells en août 2018, dont le « pixel art » est en réalité des modèles 3D rendus à basse résolution. Ensemble, ces jeux ont rendu impossible de défendre que le pixel art n’était que de la nostalgie, c’était un médium contemporain avec ses propres conventions, outils et superstars.

Pourquoi des grilles en puissances de deux et comment choisir la vôtre

Les tailles standard de canevas en pixel art (8×8, 16×16, 32×32, 64×64) remontent directement au matériel des consoles. La tuile 8×8 de la NES, le sprite 24×21 du C64, l’OBJ 8×8 de la Game Boy, des données bitmap qu’on pouvait adresser avec une arithmétique économique en puissances de deux et empaqueter efficacement en mémoire. Un sprite de personnage 16×16, c’est deux tuiles NES empilées ; un 32×32, c’est quatre. La convention a survécu à l’époque où l’adressage mémoire avait son importance, parce qu’à ce moment-là les artistes avaient intériorisé le rythme de travail « une tuile fait 8 ou 16 pixels et contient une seule forme lisible ». Usage pratique de chaque taille dans cet éditeur : 8×8 pour des icônes, des esquisses d’émoticônes Twitch et de tout petits éléments de tuile ; 16×16 pour le sprite de personnage de base, les icônes d’objets et le format canonique de texture Minecraft ; 32×32 pour les portraits détaillés ou les accessoires plus grands ; 48×48 pour des tilesets qui incluent des ombrages ; 64×64 pour des sprites à l’échelle d’un héros et de petites scènes. Commencez petit, le pixel art est défini par sa basse résolution, et la discipline de travailler en 16×16 ou 32×32 est ce qui produit des œuvres lisibles à la taille d’une vignette.

Palettes, la discipline qui rend le pixel art lisible

Les limites de palette matérielles ont donné au pixel art son deuxième trait définitoire : une discipline de couleur imposée. La NES n’autorisait que quatre couleurs au plus par tuile de fond 8×8 (en comptant le fond universel) ; la Game Boy DMG ne pouvait exprimer que quatre nuances de vert-gris à la fois. Le matériel moderne n’impose rien de tout cela, n’importe quel artiste pixel en 2026 dispose de l’ensemble de l’espace couleur RGB 24 bits et de la pleine alpha 8 bits. Pourtant, la communauté choisit largement de travailler à l’intérieur de palettes de 16, 32 ou 64 couleurs, et pas par maniérisme rétro. Une petite palette force chaque décision de couleur à compter : elle impose une structure de valeurs cohérente, des teintes complémentaires choisies avec intention, des couleurs réutilisées entre plusieurs sprites pour qu’une scène se lise comme unifiée plutôt que chaotique. C’est pourquoi tant de pixel art moderne semble intentionnel d’une manière que l’art numérique amateur moyen ne semble pas. La palette est une discipline, comme la contrainte des 14 vers d’un sonnet.

Quatre palettes signées par des artistes dominent la scène moderne. PICO-8 (Joseph « zep » White, dévoilée le 9 mai 2014 au Pico Pico Cafe avec une sortie publique en 2015), seize couleurs dont White retrace la lignée jusqu’au Commodore 64, aux trackers de l’Amiga 500 et à « l’esthétique générale d’autres matériels des années 80 ». Le prototype de Celeste de 2015 a été écrit sur PICO-8 en quatre jours. DawnBringer DB16 et DB32 (Richard Fhager, 2007 et après), conçues pour un travail pixel peint à la main et expressif plutôt que pour imiter un matériel donné. Désormais livrées par défaut avec Aseprite et GIMP. Endesga 32 et 64 (Seth « ENDESGA »), construites pour un « pixel art et design matérialiste » avec un fort contraste et une forte saturation. Au regard du nombre brut de téléchargements (192 000+ pour Endesga 32, 91 000+ pour Endesga 64 sur Lospec), parmi les palettes d’artistes les plus utilisées sur Internet. Sweetie 16 (GrafxKid), est devenue la palette par défaut de la console fantastique TIC-80. Lospec.com elle-même, fondée en 2017 par un artiste qui se fait appeler skeddles, est le hub communautaire central : base de palettes, tutoriels, galerie (lancée en janvier 2023), tournois, et une archive téléchargeable de toutes les palettes matérielles en formats compatibles avec Aseprite, Photoshop, Paint.NET et GIMP.

Comment fonctionne réellement un éditeur pixel dans le navigateur

Un éditeur pixel art web doit lutter contre les défauts serviables du navigateur, chaque navigateur moderne applique une interpolation bilinéaire ou bicubique quand il met une image à l’échelle, ce qui convient aux photos mais ruine le pixel art (cela transforme des pixels nets en taches floues). La solution tient en deux réglages complémentaires appliqués à des couches différentes. CSS image-rendering: pixelated sur l’élément canvas force le compositeur du navigateur à utiliser un agrandissement par plus proche voisin lorsque le canevas est affiché à une taille différente de son backing store, quand un canevas 16×16 est étiré à 512×512 en CSS, chaque pixel d’origine devient un bloc 32×32 de pixels identiques aux bords nets. ctx.imageSmoothingEnabled = false sur le contexte de rendu 2D force les opérations de dessin elles-mêmes à utiliser le plus proche voisin lors de la mise à l’échelle des données d’entrée. Sans les deux, vous obtenez du flou. Le modèle de dessin : un tableau 2D en mémoire de valeurs de couleur, un canevas dont la taille CSS est bien plus grande que celle de son backing store, et des outils qui mutent le tableau et redessinent les cellules concernées avec ctx.fillRect. La superposition de la grille est posée par-dessus, sous forme de lignes d’un pixel de large, qu’on peut désactiver pour un aperçu sans obstruction. L’export PNG utilise canvas.toBlob(callback, 'image/png'): asynchrone, encodé hors du thread principal. Le PNG est le bon format pour deux raisons : sans perte (chaque pixel survit au bit près) et prend en charge l’alpha (fonds transparents pour des sprites de jeu). Le JPEG est mauvais, sa compression DCT bave sur les bords des blocs et introduit des artefacts d’oscillation.

Les six outils et ce qu’ils font réellement

• Crayon (D): écrit un pixel unique à la position du curseur. Pour éviter les trous quand le curseur bouge vite entre deux événements souris, l’outil dessine à chaque image une ligne de Bresenham depuis la position précédente du curseur vers la position actuelle.
• Gomme (E): structurellement identique au crayon mais écrit la couleur d’arrière-plan, ramenant les pixels à leur état par défaut.
• Pot de peinture (F): remplace chaque pixel connecté de la même couleur que la cible du clic. Utilise un remplissage par diffusion en 4-connexité (voisins nord/sud/est/ouest, pas de diagonales) afin qu’une fine ligne diagonale empêche le seau de fuir, la convention qui colle à l’intuition de l’utilisateur. Implémenté de manière itérative avec une pile plutôt que récursivement, parce qu’un flood fill récursif sur un grand canevas fait déborder la pile d’appels JavaScript.
• Pipette (I): lit la couleur du pixel sous le curseur et la définit comme couleur de dessin courante. L’un des outils les plus utilisés dans les flux de travail en pixel art une fois la palette établie.
• Ligne (L): utilise l’algorithme de tracé de ligne de Bresenham (Jack Bresenham chez IBM, 1965) (additions entières et décalages binaires uniquement, pas de division) pour avancer entre deux coordonnées de pixels entières en maintenant un accumulateur d’erreur. L’aspect intentionnellement crénelé de Bresenham est ici une qualité esthétique positive, pas un artefact à lisser.
• Rectangle (R): dessine le contour d’un rectangle aligné sur les axes. Deux clics : le premier fixe le coin, le second complète le coin opposé.
• Annuler (Ctrl+Z): historique complet pas à pas.

Où va le pixel art, tailles de sortie en pratique

• Sprites de jeu. Le cas d’usage originel et toujours premier, un ennemi 16×16, un personnage joueur 32×32, un boss 48×48, une tuile d’herbe 16×16, le tout assemblé en une feuille de sprites pour l’exécution. Toute l’économie indé en 2D repose sur ce flux.
• Émoticônes Twitch. Twitch exige chaque émoticône personnalisée en trois tailles exactes : 28×28 (utilisée dans le tchat standard), 56×56 (écrans haute densité, désormais la majorité des spectateurs), 112×112 (sélecteurs d’émoticônes). Émoticônes statiques sous 25 Ko par taille ; animées jusqu’à 1 Mo et 60 images. Le flux pixel art consiste à dessiner en 28×28 avec des formes dures et lisibles, puis à agrandir par multiples entiers sans perte avec un agrandissement par plus proche voisin.
• Émojis personnalisés Discord. La taille recommandée par Discord est 128×128 avec un plafond de 256 Ko ; les émojis sont affichés réduits à 32×32 dans les messages et 48×48 dans les réactions. Format carré requis ; PNG et GIF pris en charge.
• Favicons. Les favicons 16×16 / 32×32 / 48×48 que les navigateurs affichent dans les onglets et les marque-pages sont du pixel art, que le designer l’ait voulu ou non. Dessiner à la taille native dans cet éditeur et exporter en PNG produit des favicons qui se lisent proprement, sans halo d’anticrénelage.
• Réseaux sociaux. Le pixel art est désormais une forme d’art à part entière sur Instagram, TikTok et Tumblr. La retenue du médium passe bien à la taille d’une vignette, et une pièce bien faite est reconnaissable dans un fil dominé par la photographie et les rendus 3D. Beaucoup d’artistes publient quotidiennement de petites œuvres construites autour d’une palette fixe comme Endesga 32 ou DawnBringer 16.
• Ascendance des collections NFT. La collection CryptoPunks (Matt Hall et John Watkinson de Larva Labs, juin 2017) a établi le modèle : 10 000 personnages 24×24 générés algorithmiquement puisant dans le punk des années 80 et le cyberpunk des années 90. Des centaines de collections dérivées ont suivi entre 2017 et 2022, toutes appuyées sur le même modèle basse résolution + palette osée.

Périmètre honnête face aux outils dédiés

Trois outils dédiés dominent l’espace pixel art. Aseprite est de fait le choix professionnel, débuté comme projet de loisir par David Capello en 1998 (première sortie en 2001 sous le nom d’Allegro Sprite Editor), désormais développé par Igara Studio S.A. dirigée par David, Gaspar et Martín Capello, vendu sur Steam à 19,99 $US (gratuit sous GPLv2 jusqu’en août 2016, lorsque la licence est passée en propriétaire bien que le code source reste visible sur GitHub). Calques, frames, timeline, tilemaps, export d’animation, scripting Lua, outils en ligne de commande, meilleur outil payant selon le consensus de la communauté. Piskel est le principal concurrent gratuit, un éditeur web open source créé par Julian Descottes avec une version hébergée à piskelapp.com et des builds desktop téléchargeables. Forces : timeline d’animation image par image, aperçu en direct, export GIF et feuille de sprites. Pixilart est un éditeur en ligne gratuit avec une forte couche sociale/communautaire, plus d’un million d’utilisateurs, galeries publiques, commentaires, abonnements. Le périmètre honnête de cet éditeur est plus étroit qu’aucun de ces trois : un outil monoframe, uniquement navigateur, pour un sprite rapide, une icône, un avatar. Six outils de base (crayon, gomme, pot de peinture, pipette, ligne, rectangle), sélecteur de couleur, palette, annulation, superposition de grille optionnelle, et export PNG à la taille native du canevas. Pas de calques, pas de frames, pas de timeline d’animation, pas de pelure d’oignon, pas de mode tilemap, pas de scripting. Pour dessiner votre premier sprite, esquisser une émoticône Twitch, ou improviser un portrait 32×32, c’est le bon niveau de friction : zéro installation, zéro compte, zéro courbe d’apprentissage. Pour la valeur complète d’un jeu en sprites animés avec effets en couches, installez Aseprite ou ouvrez Piskel.

Confidentialité : pourquoi l’exécution uniquement dans le navigateur compte ici

Le pixel art est souvent du travail en cours pour des projets de jeu indé non annoncés, des commandes sous contrat, ou du design de personnage de marque encore non public. Les éditeurs côté serveur téléversent chaque coup de pinceau vers un service tiers où il reste dans des journaux et peut être inspecté par toute personne ayant accès au backend. Cet éditeur tourne entièrement dans votre navigateur via JavaScript : chaque pixel posé, chaque annulation, chaque prélèvement de couleur reste sur votre appareil. Vérifiez dans l’onglet Réseau des DevTools, aucune requête ne part pendant que vous dessinez. L’export PNG utilise l’API intégrée du navigateur canvas.toBlob et une URL blob ; aucune étape de téléversement. Mettez la page hors ligne (mode avion) après son chargement et l’éditeur continue à fonctionner. Sûr pour des projets non annoncés, des travaux sous NDA, du design d’assets de marque ou tout sprite que vous ne voudriez pas voir copié sur le disque dur d’un inconnu.

Outils associés