Arnie936/image-to-campaign

Imagen → Campaña

Construye un embudo de marketing alemán completo a partir de una sola imagen. El punto clave: una imagen de entrada, un embudo coherente de salida — Reels de Instagram que captan la atención, un blog que genera confianza y posiciona, y una página de aterrizaje que convierte. Cada activo comparte una identidad visual y verbal única porque todos se derivan de un único Brand Brief que tú escribes y el usuario aprueba antes de gastar cualquier crédito.

Principio central: brief primero, fuente única de verdad

NO generes activos primero e intentes unificarlos después. Eso siempre deriva. En su lugar:

1. Escribe un Brand Brief a partir de la imagen + una breve entrevista. El brief fija la identidad del producto, la línea de tesis, la paleta (tokens OKLCH), la tipografía, el tono, la escena, la CTA y los ángulos/estilo elegidos para los Reels. También contiene cada prompt de activo, redactado.
2. El usuario aprueba el brief en un punto de control.
3. Cada salida — página de aterrizaje, Reels, blog — lee su tesis, paleta, fuentes, tono y prompts del brief. Nada vuelve a derivar la identidad por su cuenta.

Esta es la razón por la que la página de aterrizaje, los Reels y el blog terminan pareciendo una campaña, en lugar de tres artefactos AI no relacionados.

Valores predeterminados fijos para este skill

• Idioma: Alemán. Todo el texto visible (sitio, pies de foto, blog) está en alemán. Las banderas técnicas de la CLI se mantienen en inglés.
• Objetivo de conversión: Demo/Konzept. No hay una tienda real, por lo que cada CTA es un marcador de posición limpio (por ejemplo, "Jetzt entdecken"). No inventes precios falsos, enlaces de pago o reseñas.
• Un punto de control de aprobación, justo después del brief. Después de la aprobación, ejecuta de forma autónoma hasta el final.
• La página de aterrizaje se mantiene local (un servidor de vista previa). El despliegue (Vercel) es un paso posterior, solo si el usuario lo pide.

Paso 0 — Inicialización

La generación de activos se ejecuta a través de la CLI de Higgsfield (el mismo motor que los skills higgsfield-generate y higgsfield-product-photoshoot).

1. Si higgsfield no está en $PATH, instálalo: curl -fsSL https://raw.githubusercontent.com/higgsfield-ai/cli/main/install.sh | sh
2. Ejecuta higgsfield account status. Si falla con Session expired / Not authenticated, pide al usuario que ejecute higgsfield auth login y espera. Si aún no tienen una cuenta de Higgsfield, dirígelos a https://higgsfield.ai/s/mcp-arnold-oberleiter-ecZvus para registrarse (se requiere una cuenta con créditos para generar cualquier activo).

Confirma que realmente tienes la imagen de entrada (una ruta local). Si el usuario solo describió un producto sin imagen, dilo — este skill está construido alrededor de una imagen real. Aún puedes proceder solo con texto, pero la fidelidad baja; adviérteselo.

Paso 1 — Entrevista (máximo 2 preguntas, en alemán)

Primero mira la imagen e infiere todo lo que puedas (qué es el producto, para quién es, el ambiente). Pregunta solo lo que realmente no puedas deducir. Mantén las dos preguntas de la especificación de la página de aterrizaje, en alemán:

1. Was ist das Produkt/die Marke in einem Satz, für wen, und welches Gefühl soll es auslösen?
2. Soll ich alle Bild- und Videoassets mit Higgsfield generieren, oder gibt es schon Assets/Logo/Farben, die ich verwenden soll?

Omite una pregunta si la respuesta ya es obvia a partir de la imagen o del mensaje del usuario. No preguntes sobre precio o destino de venta — la CTA es un marcador de posición de demostración por defecto.

Paso 2 — Escribe el Brand Brief

Sigue references/brand-brief.md. Produce brief.md que contenga los campos de identidad Y cada prompt de activo (5 activos del sitio, 3 prompts de Reel, 1 imagen de blog). Escribir los prompts ahora — antes de gastar nada — es lo que hace que el punto de control sea significativo.

🛑 PUNTO DE CONTROL — obtén aprobación antes de generar

Muéstrale al usuario, de forma compacta:

• la línea de tesis, la frase de escena, los 4 tokens de paleta, las fuentes, las palabras de tono, la CTA
• el concepto de desplazamiento elegido (una línea de por qué)
• los 3 ángulos de Reel + el estilo de Reel elegido (cinemático vs UGC) y por qué
• la lista completa de prompts de activos que estás a punto de ejecutar

Luego pregunta una cosa: "Passt der Brief so, oder soll ich was anpassen, bevor ich generiere?" Generar cuesta créditos, así que no te saltes esto. Aplica las ediciones y luego continúa. Después de este punto, ejecuta de forma autónoma.

Paso 3 — Construcción (después de la aprobación)

Construye en este orden — es deliberado. La página de aterrizaje se construye primero porque fija el sistema de diseño y produce el video hero, que los Reels reutilizan.

1. Página de aterrizaje → references/landing-page.md. Genera los 5 activos del sitio, ensambla website/index.html, verifica en el navegador.
2. Reels → references/reels.md. Tres Reels 9:16. Reutiliza/reenmarca el video hero o intermedio del sitio para el ángulo de exhibición cinemática para ahorrar créditos; genera los otros dos. Escribe reels/captions.md.
3. Blog → references/blog.md. Un artículo SEO en alemán en blog/blog.html que reutiliza los mismos tokens de paleta y fuentes, con una imagen (reutiliza un fotograma del sitio donde sea posible) y una CTA que vuelva a la página de aterrizaje.

Paso 4 — Control de calidad

• Página de aterrizaje: ejecuta la lista de verificación completa del navegador en references/landing-page.md.
• Reels (opcional pero recomendado): puntúa cada uno con el Predictor de Viralidad (higgsfield generate create brain_activity --video <reel> --wait) y regenera el más débil si es obvio un ángulo claramente mejor. Reporta las puntuaciones; no te las calles.
• Confirma que cada activo esté en alemán donde lleve texto, y que la paleta y las fuentes sean idénticas en el sitio, las miniaturas de los Reels y el blog.

Paso 5 — Entrega

Ensambla la carpeta de la campaña (estructura a continuación) y escribe README.md a partir de assets/campaign-readme-template.md: qué contiene, cómo previsualizar el sitio localmente, los 3 pies de foto listos para pegar, y el siguiente paso obvio (desplegar + cambiar la CTA de marcador de posición por una real).

Mensaje final al usuario (en alemán, conciso): la URL local del sitio, la línea de tesis, los 3 ángulos de Reel con sus archivos, dónde están los pies de foto y el blog, y cualquier limitación que hayas encontrado (por ejemplo, un activo que tuviste que regenerar).

Estructura de la carpeta de campaña

kampagne-<slug>/
  brief.md                  # la fuente única de verdad aprobada
  website/
    index.html
    assets/                 # hero.mp4, middle.mp4, g1.jpg, g2.jpg, g3.jpg
  reels/
    reel-1-hook.mp4
    reel-2-showcase.mp4
    reel-3-lifestyle.mp4
    captions.md             # por reel: texto de gancho, pie de foto, hashtags, CTA
  blog/
    blog.html
    assets/                 # imagen(es) del blog
  README.md

Leyes de consistencia (aplicar a cada activo generado)

En toda la campaña, mantén estas constantes — esto es lo que hace que se sienta como una sola marca y no como una bolsa de activos generados:

• misma identidad y forma del producto
• mismo lenguaje de materiales
• misma dirección de iluminación
• mismo mundo de color (la paleta del brief)
• mismo tono premium

Rechaza y regenera cualquier activo donde la identidad del producto cambie, la forma se desvíe, el material se vea incorrecto, el texto aparezca horneado en la imagen/video (el renderizado de texto AI no es confiable — mantén el medio generado limpio y añade texto real en el pie de foto/editor), o simplemente se vea "hecho por AI". La consistencia supera al espectáculo.

Índice de referencias

• references/brand-brief.md — cómo derivar el brief + la plantilla del brief y la lista completa de prompts de activos (lee esto primero, en el Paso 2)
• references/landing-page.md — la construcción de la página de aterrizaje autocontenida y consciente del brief con la lista de verificación de QA del navegador
• references/reels.md — los 3 ángulos de Reel, selección entre cinemático y UGC, comandos de generación, reutilización mediante reencuadre y el formato de pies de foto
• references/blog.md — la especificación del artículo SEO en alemán y la plantilla HTML
• assets/brief-template.md, assets/blog-template.html, assets/campaign-readme-template.md — plantillas para rellenar