Animation sous-pixel : une respiration plus petite qu’un pixel
Une respiration discrète sur un petit sprite soit ne se voit pas du tout, soit saute d’un pixel entier d’un coup. Les pixel artists dessinent l’intermédiaire avec un pixel de bord plus sombre. Le Mouvement sous-pixel de Pixor fait de même, uniquement là où un bord bouge vraiment.
Projet d’exemple
Mouvement sous-pixel, un coffre qui respire de moins d’un pixel : le projet .pixor et son modèle de la bibliothèque (CC0). La planche de gauche est ce qu’il rend.


Débutant · environ 5 minutes · ou regardez-le en 92 secondes
1. Un petit sprite
Ouvrez un modèle : le tutoriel utilise le modèle coffre de la bibliothèque CC0 gratuite. Dans l’étape Scène, cliquez sur la caméra Sud, réglez la vue Jeu sur RPG en vue de dessus et la largeur et la hauteur sur 32. Le mouvement sous-pixel compte surtout sur les petits sprites, où un pixel est un grand pas.
2. Une respiration
Cliquez sur le coffre dans l’Arborescence pour que le mouvement l’anime, puis dans l’étape Action choisissez Ajouter une action › Pulsation. Dans le graphe d’action, réglez la Quantité du nœud Pulsation sur 0.025 : le coffre grandit et rétrécit de 2.5 %, moins d’un pixel à 32 pixels.
3. Désactivé : il saute
Dans l’étape Style, zoomez dans la Vue 2D et activez la Grille de pixels (Shift+G). Les bords restent immobiles quelques images, puis sautent d’un pixel entier.
4. Mouvement sous-pixel
Sélectionnez le nœud Nettoyage dans le graphe de style et, dans la section Nettoyage de l’Inspecteur, cochez Mouvement sous-pixel. Sélectionnez à nouveau le nœud Sortie pour voir le sprite fini.
5. Activé : il respire
Tant que le modèle ne couvre qu’une partie d’un pixel de bord (moins des sept huitièmes), ce pixel prend la couleur plus sombre suivante de sa propre rampe, et revient quand le modèle le couvre à nouveau. Le coffre respire désormais par nuances au lieu de sauter.
6. Seulement les bords
Ce qui a changé (D) marque les pixels qui diffèrent de l’image précédente : seulement ceux que traversent les bords en mouvement. La part de scintillement d’un rendu augmente un peu avec ce réglage activé, puisque ces pixels changent exprès.
7. Exporter
Exporter écrit la planche comme d’habitude ; les pixels intermédiaires y sont, dans les couleurs de la palette.
En ligne de commande
pxr render chest.glb --size 32 --clip none --motion pulse:8:0.3 --subpixel
pxr project set game.pixor --subpixel
--no-subpixel le désactive pour un projet.
Suivant
- L’animation sous-pixel expliquée : d’où vient la technique.
- Anticipation et continuité du mouvement : le problème inverse, un mouvement qui a besoin de plus de poids.
Questions
Le mouvement sous-pixel change-t-il la silhouette ou le contour ?
Non. Seuls changent les pixels de bord que la surface en mouvement couvre en partie, et seulement vers la couleur plus sombre suivante de leur propre rampe. Le contour, la silhouette et tous les autres pixels restent exactement tels quels.
Les couleurs intermédiaires sont-elles de nouvelles couleurs ?
Non. Chacune est le cran suivant vers le bas sur la rampe où l’ombrage avait déjà placé le pixel, donc chaque couleur appartient à la palette.
Quels mouvements en profitent ?
Tout ce qui bouge de moins d’un pixel par image : respirations au repos, flottement, lent balancement, pulsation. Un mouvement rapide n’est pas touché ; il se lit déjà.
Quelle différence avec le nœud Mouvement sous-pixel ?
Le nœud du graphe de style travaille une image à la fois et peut laisser une partie déborder sur des pixels vides. Ce réglage considère le clip entier et ne change jamais la silhouette.
À lire ensuite
- Anticipation et continuité du mouvement : donner du poids à un saut
- Effets de mort : éclatement, dissolution et apparition
- Un personnage qui marche dans 8 directions
- Votre premier sprite en cinq minutes
- Variantes d’éclairage : nuit, torche, sous l’eau, poison
- Un personnage Mixamo en huit directions
- Une pièce qui tourne
Essayez-le sur votre propre modèle, gratuitement dans votre navigateur, ou procurez-vous la version complète.
Essayer dans le navigateur Obtenir Pixor