commit bf8e6312a1912012564a1a91159efb66b275a339 Author: Zhongwei Li Date: Sun Nov 30 08:27:33 2025 +0800 Initial commit diff --git a/.claude-plugin/plugin.json b/.claude-plugin/plugin.json new file mode 100644 index 0000000..3edd87d --- /dev/null +++ b/.claude-plugin/plugin.json @@ -0,0 +1,12 @@ +{ + "name": "leapmultix-skill-sprite-management", + "description": "Skill sprite-management from LeapMultix", + "version": "1.0.0", + "author": { + "name": "Julien LE SAUX", + "email": "contact@jls42.org" + }, + "skills": [ + "./skills" + ] +} \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..e88bfd3 --- /dev/null +++ b/README.md @@ -0,0 +1,3 @@ +# leapmultix-skill-sprite-management + +Skill sprite-management from LeapMultix diff --git a/plugin.lock.json b/plugin.lock.json new file mode 100644 index 0000000..0394da7 --- /dev/null +++ b/plugin.lock.json @@ -0,0 +1,45 @@ +{ + "$schema": "internal://schemas/plugin.lock.v1.json", + "pluginId": "gh:jls42/leapmultix:leapmultix-marketplace/skills/sprite-management", + "normalized": { + "repo": null, + "ref": "refs/tags/v20251128.0", + "commit": "597cf6b55e6aaa6d74e47184d336ed74c41740c9", + "treeHash": "1192652542c1fb642375e8180cb46801b6a1c944465dcb52e2f2348012a1e37f", + "generatedAt": "2025-11-28T10:19:14.962151Z", + "toolVersion": "publish_plugins.py@0.2.0" + }, + "origin": { + "remote": "git@github.com:zhongweili/42plugin-data.git", + "branch": "master", + "commit": "aa1497ed0949fd50e99e70d6324a29c5b34f9390", + "repoRoot": "/Users/zhongweili/projects/openmind/42plugin-data" + }, + "manifest": { + "name": "leapmultix-skill-sprite-management", + "description": "Skill sprite-management from LeapMultix", + "version": "1.0.0" + }, + "content": { + "files": [ + { + "path": "README.md", + "sha256": "d4dc1b2f253588e73e2b82c782a9b35b46a382d12fe55b3b78f96fa3cf935e66" + }, + { + "path": ".claude-plugin/plugin.json", + "sha256": "32c4fbc7140735d256593371dc38307f08ebba6e5e3ff00484e7747961798180" + }, + { + "path": "skills/sprite-management/SKILL.md", + "sha256": "66c69aa1d18a0bc94037ca07c5aa107a37de3b8603241a6c0b8b86258ad51b1c" + } + ], + "dirSha256": "1192652542c1fb642375e8180cb46801b6a1c944465dcb52e2f2348012a1e37f" + }, + "security": { + "scannedAt": null, + "scannerVersion": null, + "flags": [] + } +} \ No newline at end of file diff --git a/skills/sprite-management/SKILL.md b/skills/sprite-management/SKILL.md new file mode 100644 index 0000000..143070d --- /dev/null +++ b/skills/sprite-management/SKILL.md @@ -0,0 +1,212 @@ +--- +name: managing-sprites +description: Manages sprites, sprite sheets, sprite animations for arcade games (loading, rendering, collisions). Use when creating games or adding animated characters +allowed-tools: Read, Write, Grep, Glob, Bash +--- + +# Gestion des Sprites + +Guide la gestion des sprites et sprite sheets pour les jeux arcade. + +## Table des matières + +- [Quand utiliser](#quand-utiliser) +- [Sprites dans le projet](#sprites-dans-le-projet) +- [Types de sprites](#types-de-sprites) +- [Concepts clés](#concepts-clés) +- [Classes et structures recommandées](#classes-et-structures-recommandées) +- [Optimisations](#optimisations) +- [Workflow de création sprite](#workflow-de-création-sprite) +- [Checklist sprite](#checklist-sprite) +- [En cas de doute](#en-cas-de-doute) + +## Quand utiliser + +- Ajout de nouveaux personnages/ennemis +- Création de sprite sheets +- Animations de sprites +- Détection de collisions +- Optimisation rendu sprites + +## Sprites dans le projet + +Trouve dans le code : + +- Personnages joueurs +- Monstres et ennemis +- Power-ups et collectibles +- Sprite sheets existants + +**Formats :** + +- PNG avec transparence +- Sprite sheets (multiples frames) +- Résolutions multiples (@1x, @2x, @3x) + +Examine le répertoire assets/sprites. + +## Types de sprites + +### 1. Sprite simple + +Image statique, pas d'animation, position et taille fixes. + +### 2. Sprite Sheet + +**Multiple frames dans une image :** + +- Layout horizontal (frames en ligne) +- Layout grille (frames en grille) +- Permet animations fluides + +**Layouts courants :** + +- Horizontal : 8 frames × 64px = 512×64px +- Grille 4×4 : 16 frames de 64×64px = 256×256px +- Par row : Chaque ligne = animation différente + +Trouve les sprite sheets existants. + +### 3. Sprite animé + +**Animation frame par frame :** + +- FPS configurable +- Boucle automatique +- Delta time pour smoothness + +### 4. Sprite directionnel + +**Différentes animations par direction :** + +- Idle, Walk, Jump par direction +- Row dans sprite sheet par action +- State machine pour transitions + +## Concepts clés + +### Chargement d'images + +**Asynchrone :** + +- `Image.onload` pour savoir quand prêt +- Précharger avant utilisation +- Placeholder ou loading si nécessaire + +Trouve comment le projet gère le chargement. + +### Rendering + +**Canvas drawImage() :** + +- Source rectangle (quelle partie du sprite sheet) +- Destination rectangle (où dessiner) +- Scaling automatique si tailles différentes + +Examine les fonctions de rendu dans les jeux. + +### Collision Detection + +**Techniques disponibles :** + +- Bounding box (AABB) - Simple et rapide +- Collision circulaire - Pour objets ronds +- Pixel-perfect - Précis mais coûteux +- Hitbox personnalisée - Compromise + +Trouve les fonctions de collision utilisées. + +### Animation State Machine + +**États et transitions :** + +- IDLE → WALK → JUMP → FALL → IDLE +- Changement frame selon elapsed time +- Loop ou one-shot selon animation + +Examine les state machines dans les jeux arcade. + +## Classes et structures recommandées + +Trouve dans le code : + +- Classe Sprite de base +- Classe AnimatedSprite +- Manager de sprites (pool, loading) +- Helpers de collision + +Examine l'architecture existante. + +## Optimisations + +### Performance + +- **Sprite pooling** : Réutiliser instances au lieu de créer/détruire +- **Dirty flag** : Re-draw seulement si changement +- **Offscreen culling** : Pas de rendu si hors écran +- **Batch rendering** : Grouper draw calls + +### Mémoire + +- **Atlas textures** : Combiner sprites dans une texture +- **Lazy loading** : Charger sprites au besoin +- **Image scaling** : Charger résolution appropriée (@1x, @2x) +- **Cleanup** : Libérer sprites inutilisés + +Cherche les optimisations déjà en place. + +## Workflow de création sprite + +### 1. Design sprite sheet + +- Définir taille frame (64×64, 128×128, etc.) +- Organiser layout (horizontal, grille) +- Créer frames avec transparence PNG + +### 2. Intégration code + +- Charger sprite sheet +- Définir source rectangles par frame +- Setup animation (FPS, frames, loop) +- Render à chaque frame du jeu + +### 3. Collision setup + +- Définir hitbox pour collision +- Tester collisions avec autres sprites +- Ajuster hitbox si nécessaire + +### 4. Tests et debug + +- Afficher hitboxes en mode debug +- Vérifier timing animations +- Tester performance avec multiples sprites + +## Checklist sprite + +- [ ] Sprite sheet créé avec transparence PNG +- [ ] Layout défini (horizontal/grille) +- [ ] Frames chargées correctement +- [ ] Animations fluides (FPS approprié) +- [ ] Collisions détectées correctement +- [ ] Hitboxes ajustées +- [ ] Performance acceptable (60 FPS) +- [ ] Cleanup mémoire implémenté + +## En cas de doute + +**Source :** Jeux arcade existants + sprite utils + +**Règles absolues :** + +1. Toujours précharger sprites avant utilisation +2. Utiliser delta time pour animations fluides +3. Bounding box (AABB) pour la plupart des collisions +4. Sprite pooling si > 10 instances simultanées +5. Cleanup sprites inutilisés pour éviter memory leaks + +**Workflow minimal :** + +- Charger sprite sheet avec Image.onload +- drawImage() avec source/destination rectangles +- Collision AABB pour détection rapide