Sarthib7/agentsmith

Preámbulo (ejecutar primero)

_TEL_TIER=$(cat ~/.superstack/config.json 2>/dev/null | grep -o '"telemetryTier": *"[^"]*"' | head -1 | sed 's/.*"telemetryTier": *"//;s/"$//'  || echo "anonymous")
_TEL_TIER="${_TEL_TIER:-anonymous}"
_TEL_PROMPTED=$([ -f ~/.superstack/.telemetry-prompted ] && echo "yes" || echo "no")
_TEL_START=$(date +%s)
_SESSION_ID="$$-$(date +%s)"
mkdir -p ~/.superstack
echo "TELEMETRY: $_TEL_TIER"
echo "TEL_PROMPTED: $_TEL_PROMPTED"
if [ "$_TEL_TIER" != "off" ]; then
_TEL_EVENT='{"skill":"marketing-video","phase":"launch","event":"started","ts":"'$(date -u +%Y-%m-%dT%H:%M:%SZ)'"}' 
echo "$_TEL_EVENT" >> ~/.superstack/telemetry.jsonl 2>/dev/null || true
_CONVEX_URL=$(cat ~/.superstack/config.json 2>/dev/null | grep -o '"convexUrl":"[^"]*"' | head -1 | cut -d'"' -f4 || echo "")
[ -n "$_CONVEX_URL" ] && curl -s -X POST "$_CONVEX_URL/api/mutation" -H "Content-Type: application/json" -d '{"path":"telemetry:track","args":{"skill":"marketing-video","phase":"launch","status":"success","version":"0.2.0","platform":"'$(uname -s)-$(uname -m)'","timestamp":'$(date +%s)000'}}' >/dev/null 2>&1 &
true
fi

Si TEL_PROMPTED es no: Antes de comenzar el flujo de trabajo de la habilidad, pregunta al usuario sobre la telemetría. Usa AskUserQuestion:

¡Ayuda a superstack a mejorar! Rastreamos qué habilidades se usan y cuánto tiempo toman — sin código, sin rutas de archivo, sin datos personales. Cámbialo en cualquier momento en ~/.superstack/config.json.

Opciones:

• A) Claro, ayuda a superstack a mejorar (anónimo)
• B) No, gracias

Si elige A: ejecuta este bash:

echo '{"telemetryTier":"anonymous"}' > ~/.superstack/config.json
_TEL_TIER="anonymous"
touch ~/.superstack/.telemetry-prompted

Si elige B: ejecuta este bash:

echo '{"telemetryTier":"off"}' > ~/.superstack/config.json
_TEL_TIER="off"
touch ~/.superstack/.telemetry-prompted

Esto solo ocurre una vez. Si TEL_PROMPTED es yes, sáltate esto por completo y continúa con el flujo de trabajo de la habilidad.

¿Habilidad incorrecta? Consulta SKILL_ROUTER.md para todas las habilidades disponibles.

Video de Marketing — Remotion + Renoise

Crea videos de marketing para tu proyecto de Solana usando dos enfoques complementarios:

• Remotion (basado en código): Videos React programáticos — control total, reproducibles, control de versiones. Utiliza las habilidades oficiales de Remotion (38 módulos de reglas).
• Renoise (generado por IA): Generación de video con IA — rápido, creativo, sin necesidad de código

Objetivo: Calidad profesional que no parezca generada por IA. Lee references/professional-quality-guide.md antes de comenzar cualquier trabajo con Remotion.

Cuándo Usarlo

• /marketing-video — Flujo de trabajo completo de producción de video
• /deck-review — Convierte una presentación en formato de video
• "Crea un video de marketing para mi proyecto de Solana"
• "Haz un video de demostración del producto"
• "Convierte mi presentación en un video"
• "Crea un promocional para redes sociales"
• "Haz un TikTok para mi dApp"

No Negociables

• Nunca te saltes la entrevista. No adivines el producto, la audiencia o la dirección visual. Pregunta.
• Nunca preguntes sobre tecnicismos de animación. Al usuario no le importan las configuraciones de spring o TransitionSeries. Pregunta sobre su producto, su historia, su gusto.
• Mantente firme en tus opiniones. Si la idea del usuario para un video es débil (demasiado largo, audiencia equivocada, sin gancho), dilo claramente y redirige.
• El gusto visual primero, el código después. Establece cómo DEBE SENTIRSE el video antes de escribir una sola línea de Remotion.
• Reúne los elementos de forma proactiva. Pide capturas de pantalla, logotipos, colores de marca. Si no los tienen, busca íconos SVG (Lucide, Heroicons), genera paletas de colores y sugiere estilos de ilustración.
• Ventanilla única. Esta habilidad lo maneja todo: entrevista → concepto → storyboard → recopilación de elementos → andamiaje → código → renderizado → cortes para plataforma. El usuario no debería necesitar otra herramienta.

Flujo de Trabajo

Paso 1: Recopilación de Contexto (Antes de Preguntar Nada)

Revisa silenciosamente el contexto existente. Lee estos archivos si existen — no le pidas al usuario que repita información:

.superstack/idea-context.md    → Concepto del producto, audiencia, propuesta de valor
.superstack/build-context.md   → Stack tecnológico, características, estado del despliegue

También verifica: ¿Ya existe un proyecto Remotion en el directorio de trabajo? (remotion.config.ts o package.json con dependencia de remotion)

Detecta automáticamente los activos del producto. Antes de la entrevista, escanea el proyecto en busca de material visual utilizable:

# Capturas de pantalla e imágenes
find . -maxdepth 3 -type f \( -name "*.png" -o -name "*.jpg" -o -name "*.jpeg" -o -name "*.webp" \) ! -path "*/node_modules/*" ! -path "*/.git/*" 2>/dev/null | head -20

# Archivos SVG (logotipos, iconos, ilustraciones)
find . -maxdepth 3 -type f -name "*.svg" ! -path "*/node_modules/*" ! -path "*/.git/*" 2>/dev/null | head -20

# Grabaciones de video/pantalla
find . -maxdepth 3 -type f \( -name "*.mp4" -o -name "*.webm" -o -name "*.mov" \) ! -path "*/node_modules/*" ! -path "*/.git/*" 2>/dev/null | head -10

# Colores de marca desde configuración CSS/Tailwind
grep -r "primary\|accent\|brand" tailwind.config.* globals.css theme.* 2>/dev/null | head -10

# Package.json para nombre/descripción del proyecto
cat package.json 2>/dev/null | grep -E '"name"|"description"' | head -5

Si encuentras activos, menciónalos durante la entrevista: "Noté que tienes capturas de pantalla en public/ y un logotipo SVG — puedo usarlos directamente."

Paso 2: La Entrevista (Profunda, Centrada en el Producto)

Esto es una conversación, no un cuestionario. Comienza con las preguntas ancla. Profundiza según sus respuestas. NO pases a la producción hasta que puedas articular claramente: qué hace el producto, a quién le importa, por qué es importante y qué debería hacer sentir el video.

Ronda 1 — El Producto (obligatorio, preguntar todo):

1. "Explícame tu producto como si fuera un usuario potencial, no un desarrollador." Por qué: Los obliga a salir de la jerga técnica. El video necesita hablar el idioma del usuario.

2. "¿Quién específicamente va a ver este video? No 'todos' — dame una persona." Por qué: Un video para un degenerado de DeFi es completamente diferente de uno para un juez de hackathon. Seguimiento si es vago: "¿Esta persona es técnica? ¿Ya usa cripto? ¿Qué está haciendo cuando ve tu video — desplazándose por Twitter, navegando una página de aterrizaje, sentado en una reunión de presentación?"

3. "¿Qué es lo único que quieres que el espectador HAGA después de verlo?" Por qué: Cada fotograma existe para impulsar esta única acción. Sin acción = sin propósito. Rechaza si dicen "conocer más sobre nosotros" — eso no es una acción. "Registrarse", "probar la demo", "visitar el sitio", "votar por nosotros" — esas son acciones.

Ronda 2 — La Historia (obligatorio, preguntar todo):

4. "¿Qué problema resuelve tu producto? Describe el dolor — hazme sentirlo." Por qué: Los mejores videos comienzan con un problema que el espectador ya tiene. Sin problema = sin gancho.

5. "¿Cuál es el 'momento ajá' en tu producto? Eso que hace que la gente diga 'oh, espera, esto es realmente genial'." Por qué: Esto se convierte en el centro del video. Si no pueden nombrarlo, indaga: "¿Qué es lo que los usuarios más elogian? ¿Cuál es el momento de la demo que genera reacciones?"

6. "¿Tienes un número que haga que alguien deje de desplazarse?" Por qué: Las métricas son los ganchos más poderosos en el contenido cripto. Ejemplos: "$2M de TVL", "liquidación en 400ms", "50K transacciones", "10x más barato que Ethereum". Si no tienen una métrica: "¿Cuál es la prueba más concreta de que tu producto funciona? ¿Número de usuarios? ¿Volumen de transacciones? ¿Comparación de velocidad?"

Ronda 3 — El Gusto (obligatorio, preguntar todo):

7. "Muéstrame un video que te encante — de cualquier marca, cualquier industria. Algo que capture la energía que quieres." Por qué: Esto revela más sobre la calidad y el tono deseados que cualquier pregunta de opción múltiple. Si no pueden nombrar uno, ofrece anclas de referencia:

   • "¿Limpio y minimalista, como el lanzamiento de un producto de Apple?"
   • "¿Rápido y contundente, como un éxito de Twitter cripto?"
   • "¿Técnico y nerd, como una charla de conferencia de desarrolladores?"
   • "¿Audaz y cinematográfico, como un tráiler de película?"
   • "¿Divertido y con memes, como una tendencia de TikTok?"

8. "¿Qué vibra debería tener este video? Elige una: seguro, urgente, divertido, misterioso, autoritario, rebelde." Por qué: La vibra lo determina todo — paleta de colores, velocidad de animación, peso tipográfico, elección musical.

9. "¿Dónde verá la gente esto? ¿Qué plataforma?" Por qué: Determina el formato (16:9 vs 9:16), la duración (15s vs 3min) y la ventana de gancho (1s para TikTok, 5s para YouTube).

Ronda 4 — Los Activos (obligatorio, preguntar todo):

10. "¿Tienes: un logotipo, colores de marca y una captura de pantalla de tu producto? Comparte lo que tengas." Por qué: El metraje real del producto separa lo profesional de lo genérico. Si no tienen nada, está bien — generaremos imágenes.

    • Si tienen un logotipo: Consíguelo como SVG si es posible, PNG si no
    • Si tienen colores de marca: Obtén los códigos hex
    • Si tienen capturas de pantalla: Consíguelas en la resolución más alta posible
    • Si no tienen NADA: "No te preocupes. Configuraré un sistema visual — usaremos íconos SVG, una paleta de colores generada y texto animado para construir el video."

11. "¿Tienes un tono de escritura preferido para superposiciones de texto y subtítulos? ¿Minúsculas e informales, o pulidas y formales?" Por qué: Las superposiciones de texto y el copy posterior deben coincidir con la voz del fundador. Lee ../tone-guide.md para valores predeterminados.

12. "¿Hay algún texto específico que DEBA aparecer? ¿Eslogan, URL, métrica, nombre del hackathon?" Por qué: Algunos textos no son negociables (logotipos de patrocinadores, marca del hackathon, URL del producto).

Ronda 5 — La Restricción (preguntar si es necesario):

12. "¿Hay una fecha límite? ¿Entrega de hackathon, fecha de lanzamiento, reunión de presentación?" Por qué: Si lo necesitan en 2 horas, haremos una plantilla rápida de Remotion o Renoise. Si tienen una semana, podemos ser más ambiciosos.

13. "¿Presupuesto para extras? ¿Voz en off (ElevenLabs), música, metraje de archivo?" Por qué: Determina si usamos solo efectos de sonido (gratis) o agregamos voz en off TTS / música con licencia.

Reglas de la Entrevista

• Adáptate, no sigas un guión. Si el usuario da una respuesta rica a la pregunta 1 que cubre las preguntas 2-4, sáltatelas. Si son parcos, profundiza.
• Desafía los ganchos débiles. Si su "métrica que detiene el desplazamiento" es "usamos Solana" — eso no es un gancho. Exige algo específico y sorprendente.
• Sin falsos elogios. Si su concepto de video es demasiado ambicioso para un clip de Twitter de 15s, dilo. Si su producto aún no tiene una historia visual clara, ayúdalos a encontrar una.
• Nunca preguntes sobre preferencias de animación. Los usuarios no saben qué significa spring damping y no deberían necesitarlo. Pregunta por la SENSACIÓN, no por la técnica. Tú traduces gusto → técnica.
• Máximo 3 preguntas por mensaje. No vomites las 13 preguntas de una vez. Rondas conversacionales.

Paso 2.5: Investigación en Vivo (obligatorio antes de la dirección creativa)

Cada métrica mostrada en un video debe estar actualizada. Antes de producir el brief creativo, investiga:

• Obtén el TVL, volumen, recuentos de usuarios actuales del producto y sus competidores usando búsqueda web o herramientas MCP (DefiLlama, CoinGecko)
• Obtén las estadísticas más recientes del ecosistema relevantes para el gancho (ej. volumen total de perps en Solana, número de tokens lanzados en pump.fun, etc.)
• Verifica cualquier número que el usuario haya mencionado en la entrevista

Cada número que aparezca como texto en el video debe provenir de esta pasada de investigación. Las métricas desactualizadas en un video son peores que ninguna métrica.

Verifica si hay hacks/exploits recientes. No hagas referencias positivas a protocolos hackeados. Verifica antes de citar cualquier protocolo como competidor o comparación.

Paso 3: Dirección Creativa (Tú Decides, El Usuario Aprueba)

Después de la entrevista, TÚ produces la dirección creativa. No le pidas al usuario que elija de un menú — presenta una única recomendación segura que puedan aprobar o rechazar.

Genera un Brief Creativo que incluya:

1. Concepto del Video — Una oración: "Un clip de Twitter de 30 segundos que abre con tu métrica de liquidación de $2M, muestra una demo del producto en 3 pasos y termina con un código QR a tu sitio."

2. Marco de Narración — Elige el mejor (lee references/video-storytelling.md):

   Marco	Mejor Para	Estructura
   Gancho-Prueba-CTA	Twitter, TikTok (15-30s)	Métrica impactante → Prueba de demo → "Pruébalo"
   Problema-Demo-Resultado	Demos de producto (30-90s)	Punto de dolor → Demo de solución → Resultado
   Antes/Después	Páginas de aterrizaje (30-60s)	Forma antigua (dolorosa) → Nueva forma (fluida)
   Speedrun	Demos de hackathon (1-3min)	Recorrido completo del producto a velocidad
   Sándwich de Testimonio	YouTube, contenido más largo	Cita de usuario → Demo → Cita de usuario
   Historia de Datos	Productos DeFi/infra	Métricas animadas que cuentan una historia de crecimiento

3. Dirección Visual — Mood board en palabras:

   • Paleta de colores (códigos hex — derivados de su marca o generados)
   • Elecciones tipográficas (fuente de título + fuente de cuerpo)
   • Sensación de animación: "suave y elegante" o "rápido y contundente" o "pesado y cinematográfico"
   • Elementos visuales clave: Qué aparece en pantalla en cada escena

4. Storyboard Escena por Escena — Escrito, fotograma a fotograma:

   Escena 1 (0-3s): GANCHO — Gran métrica animada "$2.1M" aparece con resorte sobre fondo negro.
                    Subtítulo aparece gradualmente: "liquidado en 30 días. Cero cuentas bancarias."
   Escena 2 (3-8s): PROBLEMA — El texto se revela línea por línea: "Los agentes de IA no pueden pagarse entre sí
                     sin un cofirmante humano." Tinte rojizo, desaturado.
   Escena 3 (8-22s): DEMO — Captura de pantalla del producto se desliza desde la derecha. Flechas animadas apuntan
                      a características clave. Etiquetas de pasos aparecen en secuencia.
   Escena 4 (22-27s): PRUEBA — Tres tarjetas de métricas aparecen con resorte escalonado: "50K+ transacciones",
                      "120 agentes", "liquidación <400ms"
   Escena 5 (27-30s): CTA — "Pruébalo ahora" con URL y código QR. Transición de fuga de luz.
   

5. Elementos Visuales Necesarios — Lista concreta:

   • Capturas de pantalla a capturar / proporcionar
   • Íconos SVG a usar (de Lucide, Heroicons o personalizados)
   • Ilustraciones o diagramas a crear
   • Activos de marca (ubicación del logotipo, colores)

6. Decisión de Enfoque — Remotion o Renoise

…

[truncado para traducción]