
Rendu par ce Skill
Graphique barres et courbe v1.0.0
Un graphique barres et courbe de style éditorial se construit mois par mois : les barres montent, une courbe se trace par-dessus et chaque valeur grimpe.
- Format
- Vidéo · 16:9
- Durée
- 0:15
Gratuit Gratuit avec un compte
Collez ceci dans votre agent. Il connecte la CLI si besoin, puis installe le Skill.
Un bloc HyperFrames gratuit pour 15 secondes de data storytelling façon presse. Le quadrillage et les mois apparaissent, les barres montent une à une avec leurs valeurs, puis une courbe se trace par-dessus avec ses propres pourcentages, sous un titre à empattements, un sous-titre, une légende et une ligne de source. Les mois, les deux séries de données, les échelles, les libellés et les titres se modifient dans le HTML.
Mis à jour le 3 nov. 2026
Ce que vous obtenez
- Un graphique 1920×1080 de 15 secondes sur fond transparent
- Des barres, une courbe et des valeurs qui se construisent dans l'ordre
- Un titre à empattements, une légende et une ligne de source
Idéal pour
- Résultats et histoires de croissance
- Points d'étape pour investisseurs et conseils d'administration
- Vidéos explicatives et rapports
Pas pour
- Plus de six périodes
- Les tableaux de bord chargés
À propos de ce Skill
/data-chart Fais un graphique barres et courbe : "Halden Solace: pairs sold vs. repeat buyers", de juin à novembre, paires vendues de 9 à 23 milliers et clients fidèles de 24% à 44%.
Deux chiffres qui évoluent ensemble racontent une histoire : ventes et clients fidèles, trafic et inscriptions, chiffre d'affaires et marge. Graphique barres et courbe montre les deux dans un graphique éditorial et posé qui se construit tout seul, pour que le public lise la tendance avant que la voix off ne l'explique.
Comment ça marche
- Demandez : donnez à votre agent six mois, les valeurs des barres et de la courbe, les unités et un titre.
- Remplissage : il inscrit vos textes et vos couleurs dans les variables du bloc, en gardant des textes proches de la longueur prévue par la mise en page.
- Rendu : il rend un brouillon avec
npx hyperframes render, vérifie quelques images et rend le MP4 final. - Réutilisation : les variables tiennent dans un petit fichier JSON ; la version suivante, c'est un rendu de plus.
Conseils
- Gardez l'échelle de la courbe au-dessus de celle des barres pour que ses libellés ne les chevauchent jamais.
- Indiquez les unités dans le sous-titre et la légende.
- Le fond est transparent : rendez-le avec un canal alpha et superposez-le à votre propre vidéo, à une photo ou à une couleur unie ; le SKILL.md donne les deux commandes.
- Il n'a pas de variables : votre agent modifie les textes et les chiffres directement dans le HTML, en suivant le SKILL.md.
Open source
C'est un bloc du registre HyperFrames, réalisé par HeyGen et les contributeurs de HyperFrames (heygen-com/hyperframes) et partagé sous Apache License 2.0. Le téléchargement contient le bloc, ses ressources et un SKILL.md rédigé par Reelity, pour que votre agent sache le remplir et le rendre ; HyperFrames lui-même s'exécute depuis npm.
Ce qu'il vous faut avant de commencer
- Vous fournissez
- Six périodes de données pour deux mesures, les unités et un titre.
- Dépendances
- Node.js 22 ou version ultérieure — requis · FFmpeg — requis
- Coûts externes
- Aucun. HyperFrames est gratuit et open source, et le rendu se fait sur votre propre machine.
- Dernier test
- v1.0.0 —
Avis des utilisateurs
Pas encore d'avis. Installez le Skill et soyez le premier à le noter.
FAQ
Puis-je utiliser d'autres périodes que des mois ?
Oui. Les libellés sont une liste dans le script ; trimestres, années ou semaines fonctionnent.
Comment éviter que les libellés se chevauchent ?
Réglez le maximum de la courbe plus bas que celui des barres pour que la courbe passe au-dessus ; c'est ce que fait notre exemple.
Pourquoi est-ce gratuit ?
C'est un bloc HyperFrames open source de HeyGen et des contributeurs de HyperFrames. Nous le proposons tel quel, avec un SKILL.md pour que votre agent puisse l'utiliser et un exemple réalisé avec l'une de nos marques maison, Halden Solace.






