/brag
Lo construiste. Ahora presume de ello.
Despacho de invocación (debe ocurrir primero)
Verificación de modelo. Si eres Claude Opus 5.5 y la invocación no solicita el flujo de trabajo completo (--full, "usa el brag completo") ni voiceover (--voice, que brag-slim no hace), cambia a brag-slim: lee <skill-dir>/slim.md (la habilidad /brag-slim, incluida aquí) y síguela para el resto de esta ejecución en lugar de este archivo. Pasa la entrada del usuario y pasa cualquier otra opción (--no-music, --title, …) como indicación en lenguaje natural. Informa al usuario en una línea primero, p. ej. "Estás en Opus 5.5, así que estoy usando /brag-slim: construyo el video completo yo mismo. Di 'usa el brag completo' para volver atrás." Si eres cualquier otro modelo, o no puedes determinar qué modelo eres, salta esta verificación.
Antes de inspeccionar el proyecto, analiza la invocación completa de /brag. Si la invocación contiene --voice, establece voice.enabled = true. Habilita la narración solo para esa ejecución. No habilites la narración automáticamente y no recurras al flujo de trabajo normal sin voz.
/brag convierte el sitio web o la aplicación del proyecto actual en un video de lanzamiento corto, pulido y compartible usando Hyperframes. Es limitado, opinado y divertido.
Qué hace esta habilidad
- Lee el código del proyecto actual para entender la aplicación.
- Planifica un concepto de "brag" corto y específico para este proyecto.
- Escribe el guion y el storyboard del video.
- Entrega un resumen de composición enfocado a Hyperframes.
- Valida, renderiza y escribe el texto para compartir.
Analizando la invocación
El usuario puede invocar con lenguaje natural o banderas:
/brag
/brag --tone chaotic
/brag --tone polished --format vertical
/brag this. Haz que parezca el lanzamiento de una startup ridícula.
Analiza estas opciones:
| Opción | Valores | Por defecto |
|---|---|---|
--tone | preestablecido o descripción libre | inferido |
--format | landscape, vertical, square | landscape |
--duration | segundos | auto (15-25s) |
--no-music | bandera | música activada |
--no-sfx | bandera | efectos de sonido activados |
--title | cadena | inferido del proyecto |
--voice | bandera | narración desactivada |
La voz es opcional. Si --voice está presente, usa Kokoro a través de Hyperframes y no agregues ninguna lógica de selección de proveedor. El flujo de trabajo de voz es intencionalmente de un solo proveedor.
El tono puede ser un preestablecido (default, polished, yc-parody, chaotic, deadpan, cinematic, app-store) o una dirección creativa como "lanzamiento falso de Serie A de 2016", "exposición de museo" o "anuncio de juego móvil sobreproducido".
Cuando el usuario da una dirección de tono libre, asígnala al preestablecido más cercano para el ritmo y la estructura, pero preserva la dirección del usuario en el plan y el resumen de composición.
Guía de narración
Cuando --voice está habilitado, escribe una narración que complemente los visuales, no se limite a leer el texto visible, coincida con el ritmo de la escena, suene natural y conversacional, y se mueva suavemente entre escenas. Mantén el guion conciso y específico del producto para que la voz se sienta como parte de la edición en lugar de una pista de narración separada.
Directorio de salida
Por defecto, la salida va a brag-output/. Para evitar sobrescribir ejecuciones anteriores, usa un directorio con marca de tiempo:
brag-output-2026-05-04-143022/
Usa una marca de tiempo cuando:
- El usuario solicita explícitamente una nueva ejecución sin sobrescribir resultados anteriores
- Ya existe un directorio
brag-output/en el proyecto
Genera la marca de tiempo al inicio de la ejecución (YYYY-MM-DD-HHmmss) y úsala de manera consistente para todas las rutas de salida en esa ejecución: plan, resumen, composición, renderizado y texto para compartir.
Directorio de la habilidad
<skill-dir> es el directorio que contiene este SKILL.md. Claude Code lo imprime como "Directorio base para esta habilidad" cuando la habilidad se carga; para otros agentes, está dondequiera que se haya instalado la habilidad. Los recursos incluidos están en <skill-dir>/assets/ y los scripts en <skill-dir>/scripts/. No adivines una ruta de instalación: una instalación de complemento, una copia en ~/.claude/skills/ y este repositorio la colocan en lugares diferentes.
Paso 1: Inspeccionar el proyecto
Lee: references/step-1-inspect.md
Escanea el directorio del proyecto y extrae la información necesaria para planificar el video de "brag".
Puerta: Puedes responder las 9 preguntas de la rúbrica de planificación de brag.
Paso 2: Planificar y hacer storyboard
Lee: references/step-2-plan.md
Escribe <output-dir>/brag-plan.md (donde <output-dir> es brag-output/ o la variante con marca de tiempo elegida anteriormente). Responde la rúbrica de planificación. Comprométete con un ángulo creativo. Escribe el storyboard golpe por golpe incluyendo escenas, texto, tiempos, transiciones e indicaciones de efectos de sonido.
Cuando se selecciona música, incluye una sección compacta de Guía de indicaciones de música: lee la indicación de música preestablecida de la pista incluida desde <skill-dir>/assets/music/cues/ si está presente, de lo contrario indica que las indicaciones se detectarán en el momento de la composición (cualquier pista ahora admite sincronización de ritmo — consulta references/audio.md). Los metadatos de las indicaciones son solo una guía de tiempo opcional: la historia, la legibilidad, el ritmo y la claridad del producto siguen siendo lo principal.
Puerta: <output-dir>/brag-plan.md existe con un storyboard completo. Las duraciones de las escenas suman 15–25 segundos.
Paso 3: Entregar a Hyperframes
Lee: Las habilidades de dominio de Hyperframes — hyperframes-core, hyperframes-animation, hyperframes-creative, hyperframes-keyframes, hyperframes-cli. /brag es su propio flujo de trabajo: no entres en la entrevista de intención del punto de entrada de hyperframes ni te enrutes en su flujo de trabajo genérico de video promocional / de lanzamiento.
Lee: references/step-3-compose.md
Lee: references/audio.md
Escribe el resumen de composición y usa Hyperframes para crear la implementación del video en <output-dir>/composition/.
/brag es dueño del ángulo del producto, el material fuente, el storyboard, el tono, el formato, la selección de audio, la guía de indicaciones de música y las expectativas de entrega. Hyperframes es dueño de la estructura de composición concreta, la sincronización exacta de la animación, la mecánica de la animación, las elecciones de tiempo de ejecución, las reglas de linting y el flujo de trabajo de renderizado.
Puerta: npx hyperframes check pasa con cero errores dentro de <output-dir>/composition/ (la única puerta del navegador antes del renderizado — consulta hyperframes-cli para ver qué audita).
Paso 4: Validar, renderizar y entregar
Lee: references/step-4-deliver.md
Valida, previsualiza, renderiza en <output-dir>/brag.mp4, elige el mejor fotograma de póster en <output-dir>/brag.jpg, hornea ese póster como el fotograma 0 del video para que sea la miniatura inactiva en todas partes, y escribe <output-dir>/share-copy.txt.
Puerta: <output-dir>/brag.mp4 existe. Se elige un póster del mejor fotograma <output-dir>/brag.jpg (no un fotograma arbitrario) y se hornea como fotograma 0 de brag.mp4. El texto para compartir está escrito.
Sistema de tonos
Siete preestablecidos de tono vienen con /brag. Cada uno cambia la energía del guion, el ritmo, la personalidad tipográfica y el estilo de transición. Los preestablecidos son valores predeterminados, no límites.
Definiciones completas: references/tones.md
| Tono | Energía | Frase resumen |
|---|---|---|
default | Juguetón, limpio, publicable | El predeterminado de buenas vibras |
polished | Serio, elegante | Para proyectos que no son bromas |
yc-parody | Energía de startup inexpresiva | Seriedad falsa aplicada a proyectos absurdos |
chaotic | Rápido, ruidoso, agresivo | Exagerado y desquiciado |
deadpan | Calmado, seco, discreto | El chiste es que nada es un chiste |
cinematic | Dramático, a escala de tráiler | Gran movimiento, afirmaciones más grandes |
app-store | Suave, limpio con tarjetas de características | Corporativo pero no aburrido |
Siempre permite una dirección creativa libre para refinar o anular el preestablecido.
Leyes creativas
Estas se aplican a cada video de "brag" independientemente del tono.
Corto. 15–25 segundos. Ni un segundo más sin una razón.
Legible. Mantén el ritmo alto a través del movimiento y los cortes, nunca mostrando texto rápidamente. Cada línea que un espectador debe leer se mantiene el tiempo suficiente para leerla (etiqueta corta ~0.8s estable; una oración ~0.3s por palabra). Entrada rápida, luego mantener — nunca entrada rápida, luego desaparecer.
Específico. El video debe sentirse como si estuviera hecho para este proyecto exacto, no para cualquier proyecto.
Muestra la cosa. Al menos una escena debe mostrar la interfaz de usuario real, el texto o un visual clave del producto. Sin relleno abstracto.
Sin lenguaje genérico de SaaS. "Optimiza tu flujo de trabajo" está prohibido. Usa el texto y las afirmaciones reales del proyecto.
El gancho lo es todo. Los primeros 2 segundos determinan si alguien sigue viendo. Planifica el gancho antes que cualquier otra cosa.
Divertido se gana su lugar. El humor debe venir del absurdo del proyecto, no de intentar ser gracioso.
Patrón:
Gancho (2-3s) → Revelación (2-4s) → 2-3 puntos destacados claros (5-12s) → Remate/cierre (2-4s)
Adapta esto. No todos los proyectos necesitan exactamente 3 puntos destacados. El patrón es una forma de inicio, no una plantilla.