✦ Choix du studio
Aurelle · 9:16
Rendu par ce Skill
Carte En cours de lecture v1.0.0
Une carte « en cours de lecture » façon Spotify avec votre visuel, le titre du morceau et une barre de progression qui avance, prête à poser sur une vidéo verticale.
Pas encore de note 0 téléchargements
- Format
- Format court · 9:16
- Durée
- 0:05
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 une incrustation de 5 secondes en 9:16. Une carte musicale givrée apparaît avec un grand visuel carré, un titre de morceau, une ligne d'artiste et une barre de progression qui avance, puis s'efface. Le morceau, l'artiste et le visuel se modifient dans le HTML ; le fond est transparent pour la superposition.
Mis à jour le 3 nov. 2026
Ce que vous obtenez
- Une incrustation de carte 1080×1920 de 5 secondes sur fond transparent
- Visuel, titre, artiste et barre de progression animée
- Les instructions pour la superposer à vos images
Idéal pour
- Bandes-son de campagne et playlists
- Promos de podcasts et de musique
- Stories et Reels
Pas pour
- Les vidéos horizontales
- Les longs clips musicaux
À propos de ce Skill
Vous dites
/spotify-card Fais une carte en cours de lecture pour le morceau de campagne d'Aurelle, "Wear the Light", avec l'empilement de bracelets en visuel, sur notre plan des bracelets.
Une carte musicale dit « voici la bande-son » en un instant. Now Playing Card place le morceau de votre campagne, votre playlist ou votre épisode de podcast sur une carte animée épurée, avec votre visuel, pour qu'une vidéo verticale crédite ou mette en avant le son.
Comment ça marche
- Demandez : donnez à votre agent le titre du morceau, la ligne d'artiste, le visuel et le plan sur lequel la poser.
- 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
- Utilisez un visuel carré d'au moins 800 px de large.
- Limitez le titre à quelques mots ; il s'affiche en grand.
- La carte a un fond transparent : rendez-la avec un canal alpha et superposez-la à votre propre vidéo ou photo ; le SKILL.md donne les deux commandes.
- Notre exemple remplace le logo de la plateforme par une simple mention "Now playing".
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
- Un titre de morceau ou d'épisode, une ligne d'artiste, un visuel carré et le plan sur lequel la poser.
- 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 changer les couleurs ?
Oui. Les couleurs de la carte et du texte sont du simple CSS dans le HTML.
Affiche-t-il le logo de Spotify ?
Le package conserve le petit logo d'origine ; notre exemple le remplace par une mention "Now playing", et votre agent peut faire de même.
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, Aurelle.
