Cómo funciona
Salida en vivo del motor de render real — edita los ajustes y se actualiza al instante.
Insignias de pasos numeradas
tarjetas animadas de diseño
Insignias numeradas aparecen sobre tu captura, unidas por un trazo.
Ideal para: Un tutorial sobre una sola pantalla.
Ajustes
Fuente
Tema
Tamaño
Ánimo
Formatos que pasaron el control de imagen
1:1
Lo que escribes
titleHeadline over the shot, or empty to hide (≤56)· obligatorioitemsTwo to five steps, each with a caption and where its badge sits· obligatoriobadgeRound badges, map pins or rounded squarespathA marching dashed line joining the steps, or nonelayoutA framed card over its own blurred backdrop, or the picture filling the whole frame
Las imágenes (image) salen de la imagen de la escena o, si no hay, de un degradado con tus colores.
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": "Step badges",
"narration": "Write the sentence the voice says over this scene; its length is the scene's.",
"data": {
"rushie": {
"template": "step-badges",
"props": {
"image": "https://storage.googleapis.com/pagetovid-media/demo/pagetovid-demo-en-v2.jpg",
"title": "Three clicks to a film",
"items": [
{
"label": "Paste a link",
"x": 0.3,
"y": 0.35
},
{
"label": "Pick a format",
"x": 0.6,
"y": 0.5
},
{
"label": "Render",
"x": 0.45,
"y": 0.7
}
],
"badge": "circle",
"path": "dashed",
"layout": "framed"
}
}
}
}