# Template HyperFrames : explicatif étape par étape 1:1

Copié le 29/09/2026 sur la manière de la vidéo 3 du carrousel instagram.com/p/Ddy2jrzDjFL.
Page : https://tools.inocom.io/motion/styles/explicatif-etapes.html

```
cd "03 - Ressources/Skills/creation-motion-design/templates-hf"
python3 rendre_template.py explicatif-etapes vars.json film.mp4 [--voix son.wav]
```

| id | défaut | rôle |
|---|---|---|
| `titre`, `sous_titre` | Onboarding, une activité · une page · une campagne | l'en-tête |
| `etapes` | vide = 4 étapes | JSON : `[{"valeur": "1 page", "label": "Landing page", "note": "…", "objet": "PAGE"}]` ; `objet` = l'étiquette du flacon (2 à 5 lettres) |
| `final` | Résultat, 1:1:1, page · campagne · tracking | JSON : `{"kicker", "valeur", "label"}` |
| `duree` | 18 | intro 13 %, fin 17 %, le reste en parts égales par étape |
| `papier`, `encre`, `accent`, `verre` | #FBF6EC, #3A2A2E, #E0566B, #DCEFF5 | fond, contours, titre et étapes faites, récipient |
| `couches` | #F6C9CF,#EE9AA7,#DE6A7E,#C24560 | une couleur par étape, séparées par des virgules |

De 2 à 6 étapes tiennent dans la frise. Les textes trop longs se réduisent seuls dans la fiche.
Polices embarquées : Titan One, Outfit, Caveat (aucune bannie). `lint` 0/0 avant de livrer.