Communitygithub.com

media-use

Sistema operativo de medios para HyperFrames: resuelve, genera, opera y recuerda cualquier tipo de contenido multimedia con un solo技能. Incluye resolución de BGM, SFX, imágenes, iconos, logos, voces, gradación de color y LUTs, generación mediante TTS/música/modelos de imagen, y operaciones como corte, recuadre y transformación.

¿Qué es media-use?

media-use es un skill integral diseñado para HyperFrames que unifica la gestión de todos los tipos de contenido multimedia en un solo comando: `resolve`. Permite resolver BGM, SFX, imágenes, iconos, logos, voces, gradación de color y LUTs desde catálogos locales o en la nube (HeyGen, svgl, etc.), generando automáticamente activos faltantes mediante TTS, música o modelos de imagen. También ofrece operaciones como corte, recuadre y transformación de medios existentes, además de un motor de audio compartido para voz superpuesta, transcripción, subtítulos y eliminación de fondos. El skill incluye referencias detalladas para cada subfunción (resolución, gradación, audio, operaciones, tratamientos creativos) y promueve un flujo de trabajo proactivo pero no intrusivo, sugiriendo mejoras multimedia solo cuando hay señales concretas y solicitando aprobación una vez por proyecto. Es compatible con HyperFrames y requiere instalación del CLI de HeyGen para su funcionamiento gratuito.

Compatible con~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/jasonfast123/hyperframes-skills/tree/main/skills/media-use

Preguntar en tu IA favorita

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

Documentación

¿Qué hace media-use?

El sistema operativo de medios para HyperFrames: resuelve · genera · opera · recuerda — cada tipo de medio, un solo skill, cero ruido de contexto.

Primera ejecución: instala e inicia sesión en el CLI de heygen (ruta de uso gratuito), luego verifica con node <SKILL_DIR>/scripts/resolve.mjs --doctor. Configuración y proveedores: references/setup-providers.md.

Resolver — el único verbo

node <SKILL_DIR>/scripts/resolve.mjs --type <tipo> --intent "<descripción>" --project <directorio>

Devuelve una línea: resolved <id> → <ruta> (<tipo>, <metadatos>). Todo el ruido de búsqueda permanece en el disco.

TipoIntención en una línea
bgmmúsica de fondo (catálogo HeyGen, más de 10.000 pistas)
sfxefectos de sonido (biblioteca incluida de 19 archivos + catálogo)
imagefotos, fondos (búsqueda de activos HeyGen, más de 75.000 vectores)
iconiconos, símbolos (transparentes)
logomarcas oficiales (svgl → simple-icons → avatar de GitHub → favicon; nunca redibujado)
voicevoz superpuesta por TTS (ruta de uso gratuito HeyGen; Kokoro local opcional)
gradecandidato de corrección medido; el pulido/estilización general sigue los tratamientos de medios
lutarchivo .cube proporcionado por el usuario o elegido explícitamente, validado y reutilizable

Antes de resolver algo nuevo, lista los candidatos reutilizables con --candidates y juzga tú mismo el ajuste — las reglas de reutilización, todas las banderas, la ingesta (--from) y la adopción están en references/resolve.md.

Tratar la retroalimentación visual amplia como intención de medios

Cuando un usuario pide explícitamente arreglar, pulir, estilizar, oscurecer, enfatizar o revelar medios fotográficos, lee references/media-treatments.md incluso si no menciona gradación de color o un efecto. Inspecciona el <img>/<video> real, elige una intención principal, luego usa persistencia y verificación deterministas. Usa una receta coincidente como semilla probada opcional, o inspecciona hyperframes media-treatment --capabilities --json, luego solicita una familia/efecto relevante con --capability <id> y ensambla un tratamiento personalizado a partir de controles canónicos. Nunca cargues --all para una creación ordinaria. Un tratamiento puede componer corrección, un preajuste, acabado, efectos de sombreado compatibles, fotogramas clave admitidos y superposiciones opcionales del Registro. Agrega solo ajustes acotados y justificados por la fuente y partes compatibles, nunca efectos solo para hacer que el resultado parezca más sofisticado. Persiste la carga final combinada con hyperframes media-treatment.

Usa un flujo de trabajo progresivo y de una sola escalada. Para video, inspecciona una hoja de contacto etiquetada de principio/medio/final en lugar de leer fotogramas por separado. Aplica un candidato e inspecciona una hoja posterior para corrección o pulido ordinarios. Escala a fotogramas individuales o evidencia de borrador en movimiento solo cuando el resultado sea ambiguo, temporal, estilizado, basado en LUT, sensible a HDR/LOG, privado o crítico para la marca.

Para corrección o pulido ordinarios, persiste el JSON de preajuste/ajuste del tratamiento final. No generes un LUT .cube solo para codificar exposición, sombras, contraste o calidez. Usa un LUT solo cuando el usuario lo proporcione o el tratamiento seleccionado lo posea explícitamente. resolve --type grade --for ... --analyze es evidencia de medición, no permiso para reemplazar el tratamiento elegido con un LUT generado. No recrees viñetas, grano, desenfoque, pixelado, color o efectos de tratamiento compatibles con superposiciones CSS/SVG; eso evita los controles de Studio y la ruta canónica de previsualización/renderizado de sombreado.

Sé proactivo — realiza un pase de oportunidad de medios

El humano generalmente no puede saber qué medio mejoraría la pieza. Tú sí puedes. Cuando construyas o revises una composición, haz un escaneo fundamentado y luego pregunta una vez — no agregues en silencio, ni insistas por cada activo.

Ofrece una oportunidad solo cuando haya una señal concreta presente:

Señal detectadaOfrece
Texto en pantalla / un guión sin voz superpuestaVoz superpuesta por TTS (motor de audio)
Emoji o un <div> estilizado como iconoresolver icons reales
Imagen que es un marcador de posición, pequeña o parece ampliadauna image mejor (y/o ampliación — ver references/operations.md)
Cortes de escena duros / transiciones sin sonidosfx de transición
Una pieza de más de ~10s sin música de fondobgm
Metraje que se ve sub/sobreexpuesto o con cast de coloruna corrección de gradación (inspecciónalo con hyperframes media-treatment --selector '#hero' --analyze --json)
Medios fotográficos que se sienten visualmente planos o fuera de temaun preajuste específico apropiado para la fuente o un tratamiento personalizado, con el destino previsto nombrado
Una entrada/revelación de medios significativa que se siente estáticauna animación de tratamiento compatible y segura para la búsqueda; conserva el color a menos que la solicitud también justifique un preajuste

Reglas que mantienen esto como una ayuda, no un fastidio: fundamentado, no genérico (sin señal → sin sugerencia); opinado + concreto (propón la solución específica con valores predeterminados elegidos — el humano aprueba todo / algo / nada); una vez por proyecto (una solicitud consolidada; respeta "déjalo así"); superficie, nunca mutar en silencio (las gradaciones de color especialmente: propón y previsualiza — una "corrección" de mundo gris arruina una puesta de sol intencional o un aspecto neón).

Dónde mirar — lee solo el archivo que tu tarea necesita

TareaLee
resolver / reutilizar / adoptar / ingerir, banderas, cascada, inventarioreferences/resolve.md
gradación de color, LUTs, gradación inteligente (--for), comparación de gradaciónreferences/grading.md
voz superpuesta / TTS, música, SFX, subtítulos, transcripción (motor de audio)references/audio.md
cortar / recuadrar / transformar medios existentes, difusión de errores exacta, HEVCreferences/operations.md
tratamientos creativos conscientes de la fuente, efectos en tiempo real, superposiciones, revelacionesreferences/media-treatments.md
instalación + autenticación, tabla de proveedores, escaleras de RAM, --local-only, --providerreferences/setup-providers.md
preferencias recordadas + recetas congeladas (memoria del usuario)references/memory.md
matriz de propiedad, estadísticas de uso, telemetría, privacidad (para mantenedores)references/meta.md

Individual skills in this repo

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

embedded-captions

>

faceless-explainer

Turn arbitrary text — an article, notes, a topic, a brief — into a faceless explainer video: there is no site or footage to capture, so the visuals are invented per scene (typography, abstract graphics, diagrams, data-viz). Use for topic explainers, concept breakdowns, how-tos, listicles. Not a video built from a website (/product-launch-video — promo or tour). Unclear → /hyperframes.

figma

Import Figma content into a HyperFrames composition — rendered assets, brand tokens, components, storyboard sections → reconstructed motion (frames read as states, not slides) (REST/CLI), connector-assisted motion when available, and shaders from a connector or native export. Use when the user pastes a figma.com link or asks to bring a Figma design, frame, logo, brand, or animation into a video/composition.

general-video

>

hyperframes

>

hyperframes-animation

All animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition

hyperframes-audio

>

hyperframes-cli

>

hyperframes-core

The HyperFrames composition contract — build one renderable project. Use for composition structure, the `data-*` timing attributes, `class=

hyperframes-creative

Non-animation creative direction for HyperFrames videos. Use for design spec (frame.md / design.md) handling, palettes, typography, narration, beat planning, audio-reactive visuals, composition patterns, and brand / style decisions. For atomic motion patterns and scene blueprints, use `hyperframes-animation`.

hyperframes-keyframes

>

hyperframes-registry

Install, discover, and wire registry blocks and components into HyperFrames compositions. Use when running hyperframes add or hyperframes catalog, installing one item or every block matching a tag, wiring an installed item into index.html, or working with hyperframes.json. Covers discovery, install locations, block sub-composition wiring, component snippet merging, and authoring a new block or component to contribute upstream (idea → scaffold → validate → PR).

jasonfast123/hyperframes-skills

Import Figma content into a HyperFrames composition — rendered assets, brand tokens, components, storyboard sections → reconstructed motion (frames read as states, not slides) (REST/CLI), connector-assisted motion when available, and shaders from a connector or native export. Use when the user pastes a figma.com link or asks to bring a Figma design, frame, logo, brand, or animation into a video/composition.

motion-graphics

>

music-to-video

Turn a music track (an audio file, a video to pull audio from, or a track generated from a mood brief) into a beat-synced video — lyric video, slideshow, or kinetic promo. The music drives all pacing; any user-supplied images/videos are cut onto the same beat grid, and a complete video needs zero assets. Narrated pieces → the input-matched workflow (see /hyperframes). Unclear → /hyperframes.

pr-to-video

Turn a GitHub pull request (a PR URL, owner/repo#N, or

remotion-to-hyperframes

Port an existing Remotion (React) composition

slideshow

>

talking-head-recut

Package an existing talking-head / interview / podcast video with timed, designed GRAPHIC OVERLAY cards — kinetic titles, lower-thirds, data callouts, quotes, side panels, picture-in-picture — synced to the transcript, on a 16:9 / 9:16 / 4:5 canvas of your choice; the clip plays untouched underneath. Trigger on

Skills relacionados