graphic-overlays

HyperFrames CLI dev loop — `npx hyperframes` for scaffolding (init), validation (lint, inspect), preview, render, and environment troubleshooting (doctor, browser, info, upgrade). Use when running any of these commands or troubleshooting the HyperFrames build/render environment. For asset preprocessing commands (`tts`, `transcribe`, `remove-background`), invoke the `hyperframes-media` skill instead.

Todo el conocimiento de animación para HyperFrames: reglas de movimiento atómico, planos de escenas multifásicas, transiciones de escenas, técnicas más amplias de diseño de movimiento Y los siete adaptadores de tiempo de ejecución (GSAP predeterminado, más Lottie, Three.js, Anime.js, keyframes CSS, Web Animations API, TypeGPU). Úselo para cualquier tarea de movimiento o animación: elija de 2 a 4 reglas y componga, o cargue un plano, o consulte la API específica del tiempo de ejecución (por ejemplo, suavizados de GSAP / reproductor de Lottie / mezclador de Three.js). Nativo de HyperFrames: línea de tiempo única en pausa, seguro de búsqueda,...

Contrato de composición HTML de HyperFrames. Úsalo para estructura de composición, atributos de datos, clips, pistas, subcomposiciones, variables, reproducción de medios, reglas de renderizado deterministas y validación de proyectos mínimos renderizables.

Preprocesamiento de activos para composiciones HyperFrames — TTS multiproveedor (HeyGen / ElevenLabs / Kokoro local), BGM multiproveedor (Google Lyria / MusicGen local), transcripción Whisper, eliminación de fondo y creación de subtítulos. Úselo para npx hyperframes tts, bgm, transcribe, remove-background, selección de voz/proveedor, indicación de estado de ánimo musical, subtítulos / letras / karaoke / estilo por palabra.

Instalar y conectar bloques y componentes del registro en composiciones de HyperFrames. Usar al ejecutar hyperframes add, al instalar un bloque o componente, al conectar un elemento instalado en index.html, o al trabajar con hyperframes.json. Cubre el comando add, ubicaciones de instalación, conexión de subcomposiciones de bloques, fusión de fragmentos de componentes, descubrimiento del registro y creación de un nuevo bloque o componente para contribuir upstream (idea → andamiaje → validación → PR).

Úsalo como respaldo para la creación de composiciones de video HTML con HyperFrames personalizadas cuando ningún flujo de trabajo especializado se ajuste. Cubre piezas largas o de múltiples escenas, reels de marca o sizzle, montajes, tarjetas de título, pósters en movimiento de larga duración, bucles estáticos y composiciones libres de cualquier duración o formato. No es para promociones de productos comercializados (product-launch-video), captura general de sitio web a video (website-to-video), explicadores de temas (faceless-explainer), videos de PR de GitHub (pr-to-video), subtitulado de material existente...

Úsalo cuando el usuario quiera un motion graphic breve y centrado en el diseño, donde el movimiento sea el mensaje: tipografía cinética, conteo de estadísticas o números, impacto de gráfico/dato, sting de logotipo, bloque de marca, tercio inferior, llamada, superposición social, titular animado/tweet/noticia, póster en movimiento o resalte rápido de página capturada. Generalmente de menos de 10 segundos y hasta ~30 segundos, sin arco narrativo, locución ni sujeto de acción real. Puede renderizarse en MP4 o superposición transparente. No es para piezas más largas, de múltiples escenas, narradas o de reel de marca...

Comienza AQUÍ para cualquier solicitud de hacer, crear, generar, editar, animar o renderizar un video, animación, gráfico en movimiento, video explicativo, tarjeta de título, superposición, video con subtítulos, promoción de producto, video para sitio web, video de relaciones públicas o registro de cambios, montaje de datos, póster animado o composición HTML de HyperFrames. Úsalo antes que otras habilidades de video o animación cuando el usuario quiera que HyperFrames cree o renderice un video MP4/web terminado, elija un flujo de trabajo, o decida entre video de lanzamiento de producto, video explicativo sin rostro, video de sitio web a video,...