Blog / Tutoriels

Créez PNG circulaire, calculez 4:5 et vérifiez chaque photo avant téléchargement.

Choisissez un logo transparent, vérifiez clair/sombre, placement relatif et exceptions avant ZIP.

Distinguez les erreurs de format, de taille de fichier et de dimensions ; convertissez les photos HEIC par lots et vérifiez les copies téléchargées avant de les partager.

Comprenez le développement RAW, distinguez un rendu d’une vignette et choisissez JPG ou PNG sans jeter le DNG.

Comparez correction, pixels ténus et rognage séparément, puis PNG sur clair/sombre.

Examinez une grille mesurée de 4 × 3, distinguez les bordures des espaces entre cellules et conservez les positions après avoir ignoré ou dédupliqué des tuiles.

Diagnostiquez origines et ordre avant FPS ; gardez l'ancrage et le mouvement intentionnel.

Pourquoi les rectangles de mise à jour d’un GIF peuvent laisser des traînées, comment obtenir des images PNG complètes et quand conserver les délais d’origine plutôt que d’exporter uniquement une grille.

Utilisez frame, spriteSourceSize et sourceSize d’un export Aseprite correspondant pour reconstruire des PNG de taille complète correctement alignés, plutôt que des poses rognées qui sautillent.

Partez de pixels propres, filtrez les couleurs de bord peu visibles et transformez les comptes exacts en rampes d’ombre, de base et de lumière choisies.

Composez page par page, insérez une photo, retirez les feuilles inutiles et vérifiez avant partage.

Calculez les cases, vérifiez ordre et alignement, choisissez vitesse et comprenez couleur/alpha GIF.

Instagram adapte votre photo à l’un des quelques ratios pris en charge et coupe l’excédent depuis le centre, ce qui explique pourquoi le haut du cliché disparaît. Ce guide présente les ratios préservés, le piège des carrousels, les zones de sécurité des Stories et pourquoi un import 4K ne vous apporte rien.

La suppression par couleur, la segmentation par IA et la sélection manuelle répondent à des problèmes différents. Choisir la mauvaise méthode explique souvent un halo ou un trou dans votre détourage. Ce guide explique leur fonctionnement réel et comment choisir celle dont votre image a besoin.

HTTP/2 a supprimé l’argument du nombre de requêtes qui avait motivé les sprites CSS ; la plupart des guides défendent donc une solution à un problème que vous n’avez plus. Celui-ci présente les raisons encore valables d’utiliser un sprite, les calculs de background-position et de background-size pour les écrans Retina, et les situations où un sprite SVG est préférable.

Les générateurs d’images IA placent rarement les sprites sur une grille régulière : une simple découpe par lignes et colonnes coupe donc des têtes et des pieds. Ce guide explique les variations d’espacement, la correction par détection du contenu et l’importation d’images propres dans Unity ou Godot.

Une publication en neuf tuiles transforme une image en bannière sur votre profil. Ce guide présente la taille de la source, sa découpe en neuf tuiles identiques et l’ordre inverse d’importation qui évite de désorganiser l’image.

Le fin halo blanc autour d’un détourage est presque jamais un défaut du détourage lui-même. Ce guide explique comment les pixels anticrénelés prennent une mauvaise couleur, quels formats conservent l’alpha et comment supprimer une frange déjà incorporée.

Texture Type, Sprite Mode, Pixels Per Unit, Filter Mode et la compression ont des réglages par défaut inadaptés aux images 2D. Ce guide explique chaque réglage, le découpage dans Sprite Editor et les cas où un découpage préalable vaut mieux que l’automatisme Unity.

Godot 4 lit les planches de sprites de trois façons : AnimatedSprite2D avec SpriteFrames, régions AtlasTexture et hframes/vframes sur Sprite2D. Ce guide explique le choix, les filtres pour le pixel art et pourquoi une planche irrégulière compromet les trois.

La plupart des planches de sprites IA présentent des grilles irrégulières, des fonds intégrés et des étiquettes textuelles illisibles. Ce guide fournit les formulations précises qui corrigent chaque problème, deux exemples complets de prompts et la procédure à suivre après génération.

« Utilisez WebP pour tout » est suffisamment souvent faux pour compter. Ce guide explique compression, canal alpha et le cas courant où WebP avec perte dépasse un PNG à palette.

Trois leviers contrôlent la taille : dimensions, format et qualité. Ce guide les applique par priorité, avec les bons niveaux de qualité, la quantification de palette, la suppression des métadonnées et des méthodes pour les cibles courantes.

Le redimensionnement standard transforme le pixel art en bouillie parce qu’il mélange des couleurs qui ne devaient pas se toucher. Ce guide couvre l’agrandissement au plus proche, l’importance d’un facteur entier et le rôle réel du rendu CSS pixelated, des filtres ponctuels des moteurs et des algorithmes de type hqx.

Les atlas réduisent les appels de dessin en regroupant de nombreux sprites dans une texture, mais les empaqueter bord à bord fait déborder les couleurs voisines aux raccords. Ce guide présente l’empaquetage en rectangles, les marges et l’extrusion, l’utilité actuelle des dimensions en puissances de deux et l’effet du rognage sur les pivots.

Un aperçu de lien vide vient presque toujours de quelques causes précises : mauvaises dimensions, format non pris en charge, URL relative ou cache ancien. Ce guide présente la norme 1200x630, le recadrage des zones de sécurité, les raisons d’éviter le WebP ici et la façon de forcer chaque plateforme à relire la page.

Un jeu de tuiles est plus exigeant qu’une planche de sprites, car les raccords doivent s’aligner entre les tuiles voisines. Ce guide présente le choix de la taille, la recherche du décalage de grille lorsque le dessin ne commence pas au pixel zéro, le débordement sans espacement et l’importation dans Unity ou Godot.

Le nombre d’images et la vitesse de lecture sont deux choix distincts. Les confondre explique pourquoi des animations deviennent trop lentes ou coûteuses à dessiner. Ce guide présente le rendu réel de 8, 12 et 24fps, les fréquences adaptées aux types d’action, les images maintenues et la manière de garder les FPS d’animation indépendants des FPS du jeu.

Les favicons sont restés compliqués longtemps après la simplification du reste du Web, et la plupart des guides préconisent bien plus de fichiers que nécessaire. Ce guide présente l’ensemble minimal réellement utile, ce que chaque plateforme demande, site.webmanifest, la conception d’un symbole lisible à 16 pixels et la façon de contourner le cache.

Demandez deux fois le même personnage à un modèle : l’armure change de couleur, la cape apparaît et les proportions varient. Ce guide explique le verrouillage de graine et ses limites, la fixation des couleurs et matières dans le prompt, l’image-vers-image avec référence et la correction ultérieure des écarts.