Founding Member: $499/mes de por vida
Micare
Marketing

Editor de Video programático con Remotion

Agente que compone, edita y renderiza videos con Remotion (video programático en React). Recibe assets crudos y clips, elige un template, arma la composición con los componentes de tu marca, sincroniza subtítulos token-por-token desde una transcripción (por ejemplo con Whisper) y entrega un MP4 final optimizando el primer frame como pieza aparte. Trae un checklist pre-render, reglas de marca y de timing, y una regla de oro: el primer instante manda. No genera los assets ni publica: edita y monta. Menos videos al tanteo, más piezas que se ven dirigidas.

AgentePremiumMarketingdiseno y marca

🌱 Empieza aquí · Editor de Video programático con Remotion

¿Alguna vez terminaste de reunir las imágenes, el audio y los clips de un video y se te fue la tarde montándolos, peleando con los subtítulos para que peguen con la voz y cuidando que la marca no se saliera de lugar? Esta semilla te instala un editor que arma el video con Remotion (video hecho con código, en React): elige el template, sincroniza los subtítulos con la voz, cuida tu marca y renderiza el MP4 final — poniendo el mayor esfuerzo en lo que de verdad decide todo, el primer segundo.

Para ti (el humano)

Solo tienes que decir una frase. Abre esta carpeta con tu asistente (Claude Code o Cowork) y escríbele:

Dile a tu asistente: siembra esta semilla 🌱

¿Otras formas de pedirlo? "instala esta semilla", "haz el setup de esto", "ponme esto a funcionar". Te entiende igual. De aquí en adelante, tu asistente hace toda la parte técnica.

Un par de cosas que conviene que sepas antes:

  • Esto no genera las imágenes ni el audio, y tampoco publica. Es el editor que monta el video: recibe el material ya producido, lo compone, le pega los subtítulos y exporta el MP4. Producir los assets y subir a redes son otros trabajos.
  • Necesitas un proyecto de Remotion. Remotion es la herramienta (de terceros) que permite hacer video con código. El agente trabaja sobre un proyecto de Remotion tuyo, ya inicializado, con tus composiciones y tus componentes de marca. Si aún no lo tienes, tu asistente te puede orientar para crearlo, pero eso es un paso aparte de esta siembra.
  • Durante la siembra, tu asistente te va a hacer un par de preguntas fáciles: dónde vive tu proyecto de video y dónde guardas tus documentos de marca (colores, tipografías). Con eso, cada video sale con tu identidad.

Para el asistente que siembra 🤖

Eres el asistente que va a instalar esta semilla. Es un agente (un subagente al que se le delega la misión de editar y renderizar video). No es un hook (automatización que se dispara sola ante eventos): no hay que registrar nada en settings.json ni dar permisos de ejecución (chmod) — es un archivo de definición en texto, no un script. Sigue estos pasos tal cual.

Los placeholders entre <...> los resuelves tú según la plataforma y el contexto de la persona:

  • <TU-RUTA-DE-AGENTES> → carpeta donde viven las definiciones de agentes del asistente.
    • Claude Code (usuario): ~/.claude/agents/ (recomendado, el agente queda disponible en todas las sesiones).
    • Por proyecto: .claude/agents/ dentro del proyecto (si la persona solo lo quiere ahí).
    • Cowork: la carpeta de configuración equivalente (~/.claude/agents/ si comparte el mismo directorio de config).
  • <TU-REPO-DE-VIDEO> → la carpeta del proyecto de Remotion de la persona (con src/compositions/, src/components/, src/theme.ts, Root.tsx).
  • <TU-CONTEXTO-DE-MARCA> → la carpeta o documento con su paleta, tipografías y modos de color.
  • <TU-GUIA-DE-PLATAFORMAS> → el documento (si existe) con las reglas por red social (formato, relación de aspecto, duración óptima).
  • <TU-HANDLE> → el nombre de usuario o marca que debe quedar visible en el video (opcional).

Paso 1 · Copiar la definición del agente

Copia kernel/video-editor.md a <TU-RUTA-DE-AGENTES>. Crea la carpeta si no existe.

mkdir -p <TU-RUTA-DE-AGENTES>
cp kernel/video-editor.md <TU-RUTA-DE-AGENTES>/video-editor.md

Paso 2 · Personalizar el contexto

Abre el archivo que acabas de copiar y reemplaza los placeholders por las rutas y datos reales de la persona. Pregúntale, en lenguaje simple: "¿En qué carpeta vive tu proyecto de video (el de Remotion)?", "¿Dónde guardas tus documentos de marca —colores, tipografías—?" y, si aplica, "¿Cuál es el handle que quieres que aparezca en el video?".

  • Sustituye <TU-REPO-DE-VIDEO> por la ruta real del proyecto de Remotion.
  • Sustituye <TU-CONTEXTO-DE-MARCA> por la ruta real de esa carpeta o documento.
  • Sustituye <TU-GUIA-DE-PLATAFORMAS> por la ruta real de ese documento (o quita esa línea si no existe).
  • Sustituye <TU-HANDLE> por el handle real (o quita la mención si no aplica).

Si la persona todavía no tiene proyecto de Remotion o documentos de marca, no bloquees la siembra: deja los placeholders o pon una nota corta. El agente ya está preparado para avisar y trabajar con el contexto disponible, sin inventar la identidad de la marca.

Nota sobre las dependencias. Para renderizar de verdad, la persona necesita un proyecto de Remotion inicializado (con Node.js), y una herramienta de transcripción con marcas de tiempo si sus videos llevan voz hablada (por ejemplo un modelo de reconocimiento de voz como Whisper). Recuérdaselo, pero no es parte de la siembra: es un requisito del día que quiera renderizar. Remotion tiene su propia licencia; que revise sus términos si su uso es comercial.

Nota sobre la ruta de aprendizajes. El agente guarda lo que aprende en ~/.claude/agents/learnings/ (sección Mejora continua, al final de video-editor.md). Esa ruta está escrita para una siembra de usuario en ~/.claude/. Si sembraste en otro lado (por proyecto en .claude/agents/, o un Cowork con un directorio de config distinto), abre el archivo copiado y actualiza las tres menciones de ~/.claude/agents/learnings/ (dos en el punto Al iniciar, una en Al completar) para que apunten a la carpeta de config real; de lo contrario el agente no encontrará ni podrá guardar sus aprendizajes.

Paso 3 · VERIFICACIÓN post-siembra (obligatoria)

Primero confirma que el archivo quedó en su lugar y que su encabezado se lee bien:

ls -la <TU-RUTA-DE-AGENTES>/video-editor.md && head -6 <TU-RUTA-DE-AGENTES>/video-editor.md

Salida esperada — el archivo existe y su encabezado empieza así:

---
name: video-editor
description: "Compone, edita y renderiza videos con Remotion ..."
tools: Read, Write, Bash, Glob, Grep
model: sonnet

Luego haz una prueba funcional real que no gaste tiempo de render: pídele al agente que te proponga la composición de un video corto (sin renderizarlo todavía) y verifica que aplique la regla del primer instante y el checklist. Desde tu propia conversación, delega:

Usa el agente video-editor para proponerme cómo montarías un reel vertical de ~45 segundos con [una idea pequeña de la persona]: qué template usarías, cómo tratarías el primer frame y cómo pondrías los subtítulos. Solo el plan, no lo renderices.

Qué esperar: un plan de composición que elige un template, trata el primer instante como pieza aparte (hook directo, sin intro de marca), propone subtítulos sincronizados como overlay global, y menciona el checklist pre-render. Si el plan trae esos elementos, el agente quedó vivo. ✅

  • Si el agente no aparece / no se puede invocar: confirma que copiaste el archivo a <TU-RUTA-DE-AGENTES> correcto para la plataforma (usuario vs. proyecto) y que el encabezado del Paso 3 se lee completo.
  • Si el plan sale incompleto: recuérdale que la regla del primer instante y el checklist pre-render son obligatorios.

Cuando las dos verificaciones den lo esperado, la siembra está completa. Reporta a la persona en una línea, sin tecnicismos.


¿Cómo sé que funcionó? (para el humano)

Fácil: la próxima vez que tengas listos los assets de un video, pídele a tu asistente que "use el video-editor" para montarlo. Verás dos cosas nuevas. Primero, te va a mostrar la composición antes de renderizar (no exporta a ciegas) y va a cuidar que el arranque enganche desde el primer segundo. Segundo, los subtítulos van a quedar pegados a la voz y la marca consistente, sin que tengas que corregirlo a mano. Si notas que armar un video dejó de ser una tarde entera y que las piezas salen más dirigidas, ya quedó. 🌱

Inspiración y crédito

Fuentes y patrones abiertos que inspiraron esta semilla. Nos gusta reconocer de dónde vienen las buenas ideas.

  • El agente opera sobre Remotion, un framework de terceros para hacer video de forma programática con React. Remotion tiene su propia licencia (gratuita para individuos y equipos pequeños, comercial para empresas más grandes): revisa sus términos antes de usarlo comercialmente. La semilla NO incluye ni instala su código; solo describe el método para componer, subtitular y renderizar sobre un proyecto de Remotion que tú ya tengas.
  • La sincronización de subtítulos token-por-token parte de una transcripción con marcas de tiempo, que puede generarse con un modelo de reconocimiento de voz de código abierto como Whisper (OpenAI, licencia MIT). La semilla no incluye el modelo ni sus pesos; solo asume una transcripción con timestamps como insumo.

¿Quieres implementarla con acompañamiento?

Agenda una asesoría directa con JP y aterrízala en tu caso · desde $600 MXN.

Agendar una asesoría