Gratis
Maison Vey · 16:9
Renderizado con este Skill
Tarjeta de dato con progreso v1.0.0
Una gran estadística cuenta hacia arriba junto a una etiqueta, una fina barra de progreso se llena hasta el valor y aparece un pie de texto.
Sin valoraciones todavía 0 descargas
- Formato
- Vídeo · 16:9
- Duración
- 0:07
Gratis Gratis con una cuenta
Pega esto en tu agente. Conecta la CLI si hace falta y luego instala el Skill.
Un bloque gratuito de HyperFrames para un momento de dato de 7 segundos. Un número grande cuenta hasta tu valor con un sufijo como %, una etiqueta lo acompaña, una fina barra de acento se llena según el valor sobre el máximo y debajo aparece un pie de texto corto. El valor, el sufijo, el máximo, la etiqueta, el pie y los colores se definen en una pequeña configuración en el HTML; el fondo es transparente.
Actualizado el 3 nov 2026
Qué obtienes
- Un dato de 7 segundos a 1920×1080 con fondo transparente
- Un número que cuenta hacia arriba, una etiqueta, una barra de progreso y un pie de texto
- Un pequeño bloque de configuración para los valores
Ideal para
- Resultados de encuestas y reseñas
- Hitos y objetivos
- Argumentos de producto con una cifra
No es para
- Varias cifras a la vez
- Cifras sin contexto
Sobre este Skill
Tú dices
/mk-progress-stat Haz un dato con progreso: 94% "Would wear it again", pie de texto "Maison Vey Ambre Nuit, blind test of 200 people", sobre nuestro plano del perfume.
Una sola cifra potente puede sostener un anuncio entero. Tarjeta de dato con progreso la hace subir, muestra lo cerca que está del máximo y le da una etiqueta y un pie de texto, con un diseño lo bastante limpio para ir sobre un plano de producto.
Cómo funciona
- Pide: dile a tu agente la cifra, su sufijo y su máximo, una etiqueta corta y un pie de texto.
- Rellena: escribe tus textos y colores en las variables del bloque, con una longitud parecida a la que se pensó para el diseño.
- Renderiza: renderiza un borrador con
npx hyperframes render, revisa algunos fotogramas y renderiza el MP4 final. - Reutiliza: las variables viven en un pequeño archivo JSON, así que la siguiente versión es solo un renderizado más.
Consejos
- Elige una cifra con un significado claro, como un 94% que volvería a comprar.
- Deja la etiqueta en tres o cuatro palabras.
- El fondo es transparente, así que renderízalo con canal alfa y colócalo sobre tu propio vídeo, una foto o un color liso; el SKILL.md incluye los dos comandos.
- Usa cifras reales que puedas respaldar.
Código abierto
Es un bloque del registro de HyperFrames, creado por HeyGen y los colaboradores de HyperFrames (heygen-com/hyperframes) y compartido con la Apache License 2.0. La descarga es el bloque con sus recursos y un SKILL.md escrito por Reelity, para que tu agente sepa rellenarlo y renderizarlo; HyperFrames se ejecuta desde npm.
Qué necesitas antes de empezar
- Tú aportas
- Una cifra, su máximo, una etiqueta corta y un pie de texto.
- Dependencias
- Node.js 22 o posterior — obligatorio · FFmpeg — obligatorio
- Costes externos
- Ninguno. HyperFrames es gratuito y de código abierto, y renderiza en tu propio ordenador.
- Última prueba
- v1.0.0 —
Opiniones de usuarios
Aún no hay opiniones. Instala el Skill y sé el primero en valorarlo.
Preguntas frecuentes
¿La cifra puede ser algo distinto de un porcentaje?
Sí. Pon el sufijo en K, x o nada y ajusta el máximo en consecuencia.
¿Puede ir sobre un fondo liso?
Sí. Tiene estilos de texto claro y oscuro para fondos lisos o vídeo.
¿Por qué es gratis?
Es un bloque de código abierto de HyperFrames, obra de HeyGen y los colaboradores de HyperFrames. Lo listamos tal cual, con un SKILL.md para que tu agente pueda usarlo y una muestra hecha con una de nuestras marcas de la casa, Maison Vey.
