Comparación
Salida en vivo del motor de render real — edita los ajustes y se actualiza al instante.
Métricas antes y después
tarjetas animadas de diseño
Las métricas clave con su valor antes y después, la nueva al final.
Ideal para: Los resultados de un cliente en el tiempo.
Ajustes
Fuente
Tema
Tamaño
Ánimo
Formatos que pasaron el control de imagen


Lo que escribes
titleHeadline (≤52)· obligatorioitemsMetrics with their before and after values (2 to 4)· obligatoriokickerSmall label above the title, or empty to hide (≤28)subtitleLine under the title, or empty to hide (≤80)beforeLabelHeading over the old numbers (≤14)afterLabelHeading over the new numbers (≤14)layoutA table of rows, or a card per metriccompareNumbers with an arrow, or two bars shrinking or growing
Una plantilla en código: gratis en todos los planes, sin créditos de IA.
Úsala en un vídeo
Lo que puedes cambiar:
rushie.props.titlerushie.props.itemsrushie.props (others)Para desarrolladores (MCP y JSON)
Esta es la escena exacta para enviar a create_animation (MCP): mantén la estructura, cambia las palabras y escribe la narración — la voz fija cuánto dura la escena. Pégala en update_storyboard con set_data para cambiar un vídeo que ya hiciste.
{
"visual": "rushie",
"heading": "Metrics before and after",
"narration": "Write the sentence the voice says over this scene; its length is the scene's.",
"data": {
"rushie": {
"template": "metrics-before-after",
"props": {
"kicker": "Customer results",
"title": "Six months on PageToVid",
"subtitle": "Median across 340 finance teams",
"beforeLabel": "Before",
"afterLabel": "After",
"items": [
{
"label": "Hours per launch film",
"before": 16,
"after": 1,
"unit": "h",
"better": "lower"
},
{
"label": "Films per month",
"before": 1,
"after": 12,
"unit": "",
"better": "higher"
}
],
"layout": "rows",
"compare": "numbers"
}
}
}
}