/brag (Brag Ultra)
Lo construiste. Ahora presume de ello, con una fidelidad ultra alta de nivel Apple.
Despacho de invocación (debe ocurrir primero)
Antes de inspeccionar el proyecto, analiza la invocación completa de /brag. Si la invocación contiene --voice, establece voice.enabled = true. Si se proporciona --format o --kit, configura el pipeline de renderizado en consecuencia.
/brag transforma el proyecto actual (aplicación web, aplicación móvil, GUI de escritorio, herramienta CLI/TUI o librería) en un video de lanzamiento y un kit de lanzamiento social de altísimo brillo.
Qué hace Brag Ultra
- Inspecciona el Proyecto y Captura la UI / CLI Real: Escanea el código del proyecto, la arquitectura y las instancias en vivo. Captura emuladores móviles reales (
adb), páginas web (Puppeteer), ventanas de escritorio o sesiones de terminal (asciinema/ marco CSS de terminal). - Planificación Responsiva Multi-Formato: Planifica diseños adaptativos para 16:9 Horizontal (X, YouTube), 9:16 Vertical (TikTok, Reels, Shorts) y 1:1 Cuadrado (LinkedIn, Instagram).
- Guionización y Storyboarding de Nivel Apple: Crea una narrativa de alto impacto con muelles críticamente amortiguados, shaders cinéticos, trazado de trazos SVG y datos auténticos del proyecto.
- Masterización de Audio Inteligente y Ducking: Automáticamente reduce el volumen de la música de fondo en -12dB durante la narración de voz (TTS Kokoro) con curvas suaves de ataque de 0.3s / liberación de 0.5s y mezcla efectos de sonido con niveles de impacto.
- Entrega del Kit de Lanzamiento Completo: Renderiza MP4s multi-formato, extrae imágenes JPG de póster horneadas en el fotograma 0, genera GIFs de vista previa animados de dos pasos y nítidos, y produce copias sociales estructuradas y
launch-metadata.json.
Analizando la invocación
El usuario puede invocar con lenguaje natural o banderas:
/brag
/brag --tone polished --format vertical
/brag --format all --kit --voice
/brag --tone chaotic --format square
/brag esta herramienta CLI. Haz que se sienta como una keynote de desarrollador de Apple.
Banderas y Opciones Soportadas
| Opción | Valores | Por defecto | Descripción |
|---|---|---|---|
--tone | preestablecido o descripción libre | apple-keynote / inferido | Estilo estético y de ritmo |
--format | landscape (16:9), vertical (9:16), square (1:1), all | landscape | Relación de aspecto del video y objetivo de reflujo CSS |
--duration | segundos (ej. 15s, 20s) | auto (15–25s) | Duración total |
--voice | bandera | narración desactivada | Voiceover Kokoro opcional con auto-ducking de -12dB |
--kit | bandera | renderizado estándar | Generar kit de lanzamiento completo (MP4s, GIF, póster JPG, JSON de metadatos) |
--terminal | bandera | auto-detectado | Habilitar reproducción y chrome de terminal CLI/TUI |
--no-music | bandera | música activada | Deshabilitar la pista de música de fondo |
--no-sfx | bandera | efectos activados | Deshabilitar efectos de sonido |
--title | cadena | inferido | Título personalizado del producto |
Cuando se especifica --format all o --kit, genera las 3 relaciones de aspecto (16:9, 9:16, 1:1) junto con el GIF animado y el paquete de metadatos.
Pilares Centrales de Brag Ultra
1. Reflujo Responsivo Multi-Formato
Sin incómodas barras negras ni letterboxing ingenuo. La composición se refluye de manera inteligente:
- 16:9 Horizontal (
1920x1080): Diseños divididos lado a lado, marcos de dispositivo dobles, vistas de terminal panorámicas. - 9:16 Vertical (
1080x1920): Pila vertical centrada, marcos de dispositivo móvil de altura completa, límites de fuente grandes, zonas seguras estrictas (relleno superior/inferior para superposiciones de plataforma). - 1:1 Cuadrado (
1080x1080): Recorte enfocado y ajustado, tarjeta principal centrada, tipografía de alto contraste.
2. Masterización de Audio Inteligente y Ducking de Voiceover
- La música de fondo se reduce automáticamente en -12dB cada vez que se reproduce la narración de voz o el diálogo.
- Curva de ducking: 0.3s de ataque suave antes del habla, 0.5s de liberación después del habla.
- Limitador maestro y normalización de volumen: Los efectos de sonido penetran a 0.60–0.85 sin recorte digital.
3. Captura de Pantalla de Terminal / CLI / TUI
- Soporte dedicado para herramientas de terminal (
pluvia,hyperindex,omnihud,token-trimmer, etc.). - Reproduce comandos en vivo con cadencia de escritura humana realista (fluctuación de 40–90 ms), colores de sintaxis ANSI y audio de pulsación de tecla sincronizado (
keyboard/keypress-*.wav). - Marco de terminal SVG / Canvas de alta resolución con chrome de ventana de semáforo de Apple y borde de titanio.
4. Shader Cinético y Pulido de Movimiento
- Textura de Granulado de Película: Ruido sutil de SVG
feTurbulence/ canvas (3–5% de opacidad) eliminando bandas de color y añadiendo calidez cinematográfica. - Aberración Cromática: Micro-división RGB en cortes de alta velocidad e impactos de golpe.
- Física de Muelle: Curvas críticamente amortiguadas de GSAP (
ease: "expo.out",ease: "power4.out", omass: 1, stiffness: 120, damping: 14). - Trazado de Trazos SVG: Dibujo de trayectoria animada (
stroke-dashoffset) para logotipos, nodos arquitectónicos y contornos de UI.
5. Generación del Kit de Lanzamiento Completo
Produce un directorio de lanzamiento llave en mano:
brag.mp4/brag-16x9.mp4,brag-9x16.mp4,brag-1x1.mp4brag.gif(Vista previa animada de dos pasos optimizada con paleta a 30fps para READMEs de GitHub y embeds de Discord de menos de 10 MB)brag.jpg(Fotograma de póster de alta resolución, horneado directamente en el fotograma 0 del MP4)share-copy.txt(Subtítulo de publicación única y concisa)share-copy-variants.md(Subtítulos personalizados para X/Twitter, LinkedIn, Reddit, Product Hunt)launch-metadata.json(Etiquetas OpenGraph, Twitter Card, palabras clave, marcas de tiempo)
Directorio de Salida
La salida por defecto va a brag-output/ (o brag-output-YYYY-MM-DD-HHmmss/ con marca de tiempo si ya existe):
brag-output/
brag.mp4 # Video renderizado principal
brag-16x9.mp4 # Renderizado horizontal 16:9 (si multi-formato)
brag-9x16.mp4 # Renderizado vertical 9:16 (si multi-formato)
brag-1x1.mp4 # Renderizado cuadrado 1:1 (si multi-formato)
brag.jpg # Fotograma de póster de alta resolución (horneado en fotograma 0)
brag.gif # Vista previa GIF animada de alta resolución
brag-plan.md # Storyboard y plan creativo
composition-brief.md # Resumen de Hyperframes
share-copy.txt # Subtítulo de publicación principal
share-copy-variants.md # Copia de publicación multi-plataforma
launch-metadata.json # Metadatos OpenGraph y sociales
composition/ # Proyecto fuente de Hyperframes
Pasos del Flujo de Trabajo
- Paso 1: Inspeccionar y Capturar UI / Terminal en Vivo: Leer references/step-1-inspect.md y references/capture-workflow.md
- Paso 2: Planificar y Hacer Storyboard: Leer references/step-2-plan.md y references/apple-design-guide.md
- Paso 3: Componer con Hyperframes: Leer references/step-3-compose.md y references/audio.md
- Paso 4: Validar, Renderizar y Entregar el Kit de Lanzamiento: Leer references/step-4-deliver.md
Preestablecidos de Tono
Definiciones completas en references/tones.md:
| Tono | Energía | Una Línea |
|---|---|---|
apple-keynote | Confianza tranquila, física táctil, moderación sublime | Estética de revelación de producto insignia de Apple |
default | Juguetón, limpio, publicable | Escaparate de buenas vibras para consumidores y creativos |
polished | Serio, elegante, de alta artesanía | Herramienta de desarrollador premium o producto empresarial |
yc-parody | Energía de startup inexpresiva | Entrega seria de conceptos audaces o extravagantes |
chaotic | Rápido, ruidoso, desatado | Reel de hype de alta velocidad |
deadpan | Tranquilo, seco, discreto | Ritmo minimalista donde la moderación es el remate |
cinematic | Dramático, a escala de blockbuster | Gran movimiento, crescendos orquestales/sintéticos, ritmo de tráiler |
app-store | Suave, limpio como tarjeta de características | Recorrido de UI nítido con micro-interacciones táctiles |