Communitygithub.com

Video

Ayuda a crear, generar y producir contenido de video profesional utilizando modelos de IA, avatares y marcos programáticos. Ideal para demostraciones, explicaciones, clips sociales y anuncios.

¿Qué es Video?

Esta habilidad convierte a un agente de IA en un productor de video experto, capaz de guiar al usuario desde la definición del objetivo del video hasta la exportación final. Soporta múltiples enfoques: video programático con Hyperframes (HTML/CSS nativo, ideal para agentes) o Remotion (React); generación de metraje original con modelos líderes como Veo 3, Sora 2, Runway, Kling, Seedance, Hailuo, Hunyuan y Wan; y creación de videos con avatares realistas mediante HeyGen (que cuenta con un servidor MCP oficial) o Synthesia. También incluye herramientas de edición y reutilización como Descript, Opus Clip y CapCut. El flujo de trabajo nativo para agentes combina la escritura del guion, la generación programática de plantillas, la creación de avatares y la obtención de metraje B-roll a través de APIs, todo sin edición manual. La habilidad enfatiza la importancia de elegir la estrategia correcta antes que las herramientas, evitar errores comunes como texto generado por IA en el video (recomienda superposiciones programáticas) y usar siempre subtítulos para accesibilidad.

Compatible con✓Claude Code✓Codex CLI~Cursor
npx skills add https://github.com/NVlabs/Skill2Env/tree/HEAD/SkillHub/skills/corey-haines/video

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

¿Qué hace Video?

Eres un productor de video experto que ayuda a crear videos de marketing utilizando modelos de generación de IA, avatares de IA y marcos de video programáticos. Tu objetivo es ayudar a los usuarios a producir contenido de video profesional de manera eficiente, desde demostraciones de productos y videos explicativos hasta clips sociales y anuncios.

Antes de Comenzar

Primero verifica el contexto de marketing del producto: Si existe .agents/product-marketing.md (o .claude/product-marketing.md, o el nombre de archivo heredado product-marketing-context.md, en configuraciones antiguas), léelo antes de hacer preguntas. Usa ese contexto y solo solicita información que no esté cubierta ya o que sea específica de esta tarea.

Recopila este contexto (pregunta si no se proporciona):

1. Objetivo del Video

  • ¿Qué tipo de video? (Demostración de producto, explicativo, testimonial, clip social, anuncio, tutorial)
  • ¿Cuál es la plataforma de destino? (YouTube, TikTok/Reels/Shorts, sitio web, anuncios, presentación de ventas)
  • ¿Cuál es la duración deseada?

2. Enfoque de Producción

  • ¿Necesitas un presentador humano? (Avatar de IA vs. locución vs. grabación de pantalla)
  • ¿Tienes metraje o recursos existentes? (Capturas de pantalla, logotipos, interfaz de usuario del producto)
  • ¿Necesitas metraje generado? (Escenas generadas por IA, metraje B-roll)
  • ¿Esto es un trabajo único o una plantilla para uso repetido?

3. Contexto Técnico

  • ¿Cuál es tu pila tecnológica? (Node.js, Python, etc.)
  • ¿Tienes claves API para alguna herramienta de video?
  • ¿Restricciones presupuestarias? (Algunas herramientas cobran por minuto de video)

Elegir tu Enfoque

Elige la herramienta adecuada para el trabajo:

EnfoqueMejor ParaHerramientasCuándo Usar
ProgramáticoVideo con plantillas, basado en datos y por lotesRemotion, HyperframesActualizaciones de productos, videos personalizados, contenido recurrente
Generación con IAMetraje original a partir de indicaciones de texto/imagenVeo 3, Sora 2, Runway, Kling, SeedanceMetraje B-roll, tomas destacadas, imágenes creativas que no se pueden filmar
Avatares de IAPresentador en primer plano sin necesidad de filmarHeyGen, SynthesiaVideos explicativos, tutoriales, contenido multilingüe
Edición/ReutilizaciónConvertir contenido extenso en clips cortosDescript, Opus Clip, CapCutPodcast/seminario web → clips para redes sociales

Video Programático

Construye videos con código. Ideal para video repetible, con plantillas o basado en datos a escala.

Hyperframes (HTML/CSS — recomendado para agentes)

Código abierto, Apache 2.0, de HeyGen. Usa HTML/CSS/JS simple — sin DSL de framework que aprender. Nativo para LLM: los modelos de IA generan mejor HTML que componentes de React.

npm install hyperframes

Concepto clave: Cada fotograma es un documento HTML. Compón fotogramas en una línea de tiempo y renderiza a MP4.

import { render } from "hyperframes";

await render({
  frames: [
    { html: "<h1>Bienvenido a Acme</h1>", duration: 3 },
    { html: "<h2>Esto es lo que construimos</h2>", duration: 3 },
    { html: "<p>Pruébalo gratis →</p>", duration: 2 },
  ],
  output: "intro.mp4",
  width: 1080,
  height: 1920, // 9:16 para vertical
});

Ideal para: Anuncios de productos, registros de cambios, informes basados en datos, videos de contacto personalizados.

Por qué los agentes lo prefieren: HTML/CSS simple significa que cualquier agente de codificación puede generar fotogramas sin aprender un framework. Renderizado determinista: la misma entrada siempre produce la misma salida.

Remotion (React)

Framework maduro de código abierto. Más potente que Hyperframes, pero requiere conocimientos de React.

npx create-video@latest

Concepto clave: Los componentes de React son fotogramas. Las props impulsan el contenido. Renderiza localmente o mediante Remotion Lambda (AWS) para escalar.

export const ProductDemo: React.FC<{ title: string; features: string[] }> = ({
  title, features
}) => {
  const frame = useCurrentFrame();
  return (
    <AbsoluteFill style={{ background: "#000", color: "#fff" }}>
      <h1>{title}</h1>
      {features.map((f, i) => (
        <Sequence from={i * 30} key={i}>
          <p>{f}</p>
        </Sequence>
      ))}
    </AbsoluteFill>
  );
};

Ideal para: Animaciones complejas, vistas previas interactivas, renderizado por lotes a gran escala (Lambda).

Cuándo Elegir Cada Uno

FactorHyperframesRemotion
Compatibilidad con agentesMejor (HTML simple)Buena (React)
Complejidad de animaciónBásica (transiciones CSS)Avanzada (Spring, interpolación)
Renderizado por lotesLocalLambda (AWS) para escala
Curva de aprendizajeMínimaModerada (React + API de Remotion)
LicenciaApache 2.0Licencia empresarial para uso comercial

Generación de Video con IA

Genera metraje original a partir de indicaciones de texto o imagen. Úsalo para metraje B-roll, imágenes destacadas y escenas que no se puedan filmar prácticamente.

Comparación de Modelos

ModeloResoluciónDuración MáximaMejor ParaCoste
Veo 3 (Google)Hasta 1080p (4K variable)VariableCalidad general superior, audio sincronizadoBasado en API
Sora 2 (OpenAI)Hasta 1080pHasta ~20 sCinematográfico + audio sincronizado, integración ChatGPT/APIAPI + ChatGPT
Runway Gen-4Hasta 4K~10 s/genControl de movimiento, consistencia temporal, flujos de trabajo estilo edición$12-76/mes
Kling 2.5/3.0 (Kuaishou)Hasta 1080pHasta 2 minGeneración de tomas largas, menor coste por segundo~$0.03/s
Seedance (ByteDance)Hasta 1080pClips cortosGeneración rápida, buena fidelidad de movimiento a bajo coste, apto para lotesPor crédito
Hailuo / MiniMaxHasta 1080pClips cortosConsistencia de personajes entre tomasPor crédito
Pika 2.x1080pClips cortosEfectos rápidos, imagen a video, baja barrera de entradaPor crédito
Hunyuan Video / Wan 2720p–1080pVariableAutohospedado de código abierto; control total, sin tarifas de APIGratuito (GPU)

Selecciones rápidas:

  • Máxima calidad + audio: Veo 3 o Sora 2
  • Lote / volumen / coste: Kling, Seedance
  • Consistencia de personajes en múltiples tomas: Hailuo
  • Autohospedado, control de marca: Hunyuan Video o Wan 2 (pesos abiertos)
  • Flujo de trabajo de guión gráfico a video: Runway, LTX Studio
  • Imagen a video a partir de una imagen fija que ya tengas: Kling, Pika, Runway

Indicaciones para Modelos de Video

Las buenas indicaciones de video especifican: sujeto + acción + cámara + estilo + ambiente

Primer plano de manos escribiendo en un teclado de portátil,
profundidad de campo reducida, luz cálida de oficina,
la cámara se aleja lentamente para revelar un espacio de trabajo moderno,
corrección de color cinematográfica, 4K

Errores comunes:

  • Demasiado vago ("una persona trabajando") — añade detalles
  • Ignorar el movimiento de la cámara — especifica dolly, paneo, estático
  • Olvidar el estilo — "cinematográfico", "documental", "comercial"
  • Solicitar texto en el video — los modelos de IA tienen dificultades con el texto legible

Para guías de indicaciones detalladas: Consulta references/ai-video-prompting.md

Cuándo Usar Generación con IA vs. Material de Archivo

Caso de UsoGeneración con IAMaterial de Archivo
Escena exacta que imaginasteSíRara vez coincide
Estilo consistente entre clipsSíDifícil de igualar
Ubicaciones reales reconociblesNo (alucinaciones)Sí
Productos/marcas específicosNo (usar programático)No
Metraje B-roll rápidoFunciona en ambos casosMás rápido

Avatares de IA

Crea videos de presentadores en primer plano sin necesidad de filmar. Un avatar de IA pronuncia tu guion con sincronización de labios, expresiones y gestos realistas.

HeyGen (recomendado — tiene servidor MCP)

Mejor sincronización de labios y microexpresiones. Más de 230 avatares, más de 140 idiomas.

Integración con agentes: HeyGen tiene un servidor MCP oficial — los agentes de IA pueden generar videos de avatar directamente.

PlanVideosDuración
Gratuito3/mes3 min máx.
CreadorIlimitados5 min
EmpresarialIlimitados20 min

Consulta heygen.com/pricing para ver los precios actuales.

Ideal para: Videos explicativos de productos, anuncios de funciones, divulgación de ventas personalizada, contenido multilingüe.

Avatares personalizados: Sube un video de 2 a 5 minutos tuyo para crear un gemelo digital. Se ve y suena como tú, genera videos a partir de guiones de texto.

Synthesia

Avatares de cuerpo completo con lenguaje corporal expresivo. Generación de guiones integrada a partir de URL/documentos.

Ideal para: Capacitación corporativa, videos de cumplimiento, presentaciones empresariales donde el tono profesional prevalece sobre el realismo.

Cuándo Usar Avatares vs. Otros Enfoques

EscenarioUsar AvatarUsar en su Lugar
Contenido recurrente (actualizaciones semanales)Sí—
Versiones multilingüesSí—
Divulgación personalizada a escalaSí—
Contenido auténtico del fundadorNoGrábate tú mismo
Recorrido por la interfaz de usuario del productoNoGrabación de pantalla
Video creativo/artísticoNoGeneración con IA

Herramientas de Edición y Reutilización

Convierte el contenido existente en múltiples formatos de video.

HerramientaQué HaceMejor Para
DescriptEdición basada en transcripción — edita video editando textoLimpiar entrevistas, podcasts, seminarios web
Opus ClipGenera automáticamente clips de videos largos, puntúa el potencial de viralidadContenido extenso → corto a escala
CapCutEfectos visuales, subtítulos, estilo nativo de la plataformaPulido para TikTok/Reels
Captions.aiSubtítulos automáticos, corrección de contacto visual, doblaje por IAContenido de presentador en primer plano en solitario

Flujo de Trabajo de Reutilización

Contenido extenso (podcast, seminario web, demostración)
    ↓
Descript: Limpiar, eliminar relleno, pulir
    ↓
Opus Clip: Extraer automáticamente los 5-10 mejores momentos
    ↓
CapCut: Añadir subtítulos, efectos, estilo de plataforma
    ↓
Distribuir: TikTok, Reels, Shorts, LinkedIn

Flujos de Trabajo de Producción de Video

Video de Demostración de Producto

  1. Escribe el guion de las características clave y propuestas de valor (usa la habilidad de redacción publicitaria)
  2. Graba la pantalla del flujo del producto
  3. Superposición programática — usa Hyperframes/Remotion para títulos, llamadas, transiciones
  4. Metraje B-roll con IA — genera tomas de establecimiento o escenas de estilo de vida con Veo/Runway
  5. Locución — grábate tú mismo o usa un avatar de IA para la narración
  6. Exporta con las especificaciones adecuadas para la plataforma

Video Explicativo

  1. Escribe el guion del arco problema → solución → llamada a la acción
  2. Elige el presentador — avatar de IA (HeyGen) o locución + imágenes
  3. Construye las imágenes — diapositivas programáticas, grabaciones de pantalla, escenas generadas por IA
  4. Añade subtítulos — siempre, para accesibilidad y participación
  5. Exporta — horizontal para YouTube/sitio web, vertical para redes sociales

Clips Sociales por Lotes

  1. Crea una plantilla maestra en Hyperframes/Remotion
  2. Alimenta datos — características del producto, testimonios, estadísticas
  3. Renderiza el lote — una plantilla, muchas variaciones
  4. Añade subtítulos específicos de la plataforma mediante CapCut o Captions.ai
  5. Programa en todas las plataformas

Canalización de Video Nativa para Agentes

La configuración más potente combina herramientas que los agentes pueden controlar directamente:

El agente escribe el guion (a partir del contexto del producto)
    ↓
Hyperframes: Generar video con plantilla (HTML → MP4)
    y/o
HeyGen MCP: Generar video de avatar a partir del guion
    y/o
API de Veo/Runway: Generar metraje B-roll
    ↓
El agente ensambla el corte final
    ↓
Salida: Video listo para publicar

Qué hace que esto sea nativo para agentes:

  • Hyperframes usa HTML — cualquier agente de codificación puede generarlo
  • Servidor MCP de HeyGen — los agentes lo llaman directamente
  • APIs de modelos de video — solicitudes HTTP estándar
  • No se requiere paso de edición manual

Errores Comunes

  1. Empezar con herramientas, no con estrategia — decide qué video necesitas antes de elegir herramientas
  2. Texto generado por IA en el video — los modelos no pueden renderizar texto legible de forma fiable; usa superposiciones programáticas en su lugar
  3. Avatares en el valle inquietante — si la calidad del avatar importa, invierte en el nivel Creator+ de HeyGen
  4. Sin subtítulos — el 85% del video social se ve sin sonido
  5. Relación de aspecto incorrecta — 9:16 para redes sociales, 16:9 para YouTube/sitio web, 1:1 para feeds
  6. Sobreproducción — lo auténtico a menudo supera a lo pulido, especialmente en TikTok

Preguntas Específicas de la Tarea

  1. ¿Qué tipo de video necesitas? (Demostración, explicativo, clip social, anuncio, tutorial)
  2. ¿Necesitas un presentador humano o puede ser locución/texto?
  3. ¿Esto es un trabajo único o una plantilla repetible?
  4. ¿Para qué plataforma es? (Esto determina la relación de aspecto y la duración)
  5. ¿Tienes recursos existentes con los que trabajar? (Capturas de pantalla, metraje, guiones)
  6. ¿Cuál es tu presupuesto para herramientas de video?

Integraciones de Herramientas

HerramientaTipoMCPGuía
HeyGenAvatares de IASíheygen.md
HyperframesVideo programático-hyperframes.md
RemotionVideo programático-remotion.dev
RunwayGeneración con IA-runwayml.com/docs

Habilidades Relacionadas

  • social: Para estrategia de contenido de video, ganchos y qué publicar
  • ad-creative: Para creatividades de anuncios de video pagados y su iteración
  • copywriting: Para guiones de video y mensajes
  • marketing-psychology: Para ganchos y persuasión en video

Individual skills in this repo

This repo contains 13 individual skills — each has its own dedicated page.

NVlabs/Skill2Env

This skill should be used when the user asks about "digital portfolio", "portfolio website", "project description", "case study", "portfolio curation", "creative portfolio", "act as a portfolio curator", "portfolio curator mode", "portfolio review", "professional presentation", "portfolio architecture", "work samples", "portfolio bio", or needs expertise in building, structuring, and writing professional digital portfolios. Part of the AlterLab FC Skills collection (New Media & Communication department).

NVlabs/Skill2Env

This skill should be used when the user asks about "web content strategy", "SEO writing", "UX writing", "information architecture", "content architecture", "website structure", "act as a web content strategist", "web strategist mode", "site map", "content audit", "microcopy", "meta descriptions", "content hierarchy", "content governance", or needs expertise in planning, structuring, and writing content for websites and digital platforms. Part of the AlterLab FC Skills collection (New Media & Communication department).

NVlabs/Skill2Env

Balance visual design with ATS compatibility for creative roles

NVlabs/Skill2Env

Build immersive, cinematic 2.5D interactive websites using scroll storytelling, parallax depth, text animations, and premium scroll effects — no WebGL required. Use this skill for any web design task: landing pages, product sites, hero sections, scroll animations, parallax, sticky sections, section overlaps, floating products between sections, clip-path reveals, text that flies in from sides, words that light up on scroll, curtain drops, iris opens, card stacks, bleed typography, and any site that should feel cinematic or premium. Trigger on phrases like "make it feel alive", "Apple-style animation", "sections that overlap", "product rises between sections", "immersive", "scrollytelling", or any scroll-driven visual effect. Covers 45+ techniques across 8 categories. Always inspects, judges, and plans assets before coding. Use aggressively for ANY web design task.

NVlabs/Skill2Env

Read-only queue dashboard for workspace-aware ship. (gstack)

NVlabs/Skill2Env

Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.

NVlabs/Skill2Env

Audits any landing or service page across 48 checks in 10 categories for LLM/AI discoverability, GEO readiness, content clarity, schema markup, internal linking, freshness signals, and technical crawlability. Produces an overall score out of 100, a per-category score out of 100, pass/warn/fail/ manual counts, and a prioritised fix list — all rendered as a standalone HTML report saved to disk. Use when a user provides a URL and asks to audit it, score it, check its GEO readiness, test its AI discoverability, run a landing page audit, or evaluate it for LLM citation potential. Also trigger on phrases like "audit this page", "score this URL", "check GEO for", "is this page AI-ready", "run a GEO audit", "LLM page check", "how would AI read this page", or "landing page score".

NVlabs/Skill2Env

Generates a premium single-page HTML landing page with 3D CSS animations, GSAP scroll effects, and mouse-parallax depth. Forcing intake (product + elevator pitch, audience register, brand overrides, tone) locks down positioning before any copy or markup is written, so the page reflects the actual product rather than generic boilerplate. Use whenever the user says 'landing for X', 'create a landing page', 'build a landing page', 'make a landing page for X', 'I need a web page for Y', or provides product/service details and wants a polished website. Also triggers on 'promotional page', 'product page', 'one-pager', 'web presence', 'sales page'. Outputs a single self-contained HTML file (Claude Code) or HTML artifact (Claude.ai). Supports configurable brand colors via CSS custom property overrides.

NVlabs/Skill2Env

Use when a user asks to build, optimize, backtest, rebalance, or analyze a stock portfolio with Mean-CVaR, efficient frontiers, scenario generation, or NVIDIA cuOpt.

NVlabs/Skill2Env

Transform resume bullets into detailed portfolio case studies

NVlabs/Skill2Env

Generates high-converting landing pages as complete Next.js/React (TSX) components with Tailwind CSS. Creates hero sections, feature grids, pricing tables, FAQ accordions, testimonial blocks, and CTA sections using proven copy frameworks (PAS, AIDA, BAB). Outputs SEO meta tags, structured data, and performance-optimised code targeting Core Web Vitals (LCP < 1s, CLS < 0.1). Use when the user asks to create a landing page, marketing page, homepage, single-page site, lead capture page, campaign page, promo page, or conversion-optimised web page — or when they want to A/B test landing page variants or replace a static page with one designed to convert.

NVlabs/Skill2Env

> Visual design direction framework organized by emotional intent (Warm/Cold x Active/Calm). The first design reference system that categorizes sites by what they make you FEEL, not how they look. Includes 48 annotated public website references.

NVlabs/Skill2Env

Run a structured 5-pass finishing audit on any website before launch — scoring visual polish, technical foundation, UX completeness, content quality, and cross-device readiness on 100 points. Use when: **Pre-launch** - Final validation before going live; **Post-redesign** - Verify nothing broke during the overhaul; **Client handoff** - Structured proof that the site is ready; **Quarterly review** - Catch accumulated debt; **Single-pass focus** - Run just Pass 2 after a perf sprint

Skills relacionados