Método Oneshot — Pipeline de landing en un prompt

Por qué existe

Generar una landing "desde cero" con prompts sueltos toma horas, quema tokens y produce páginas genéricas que igual hay que rehacer. Este método invierte el orden: primero los datos, después el diseño. Si el ADN del cliente está completo, la landing sale bien a la primera. Si no lo está, no se dispara.

1 promptproduce la landing completa sobre el esqueleto

≥ 60%readiness mínimo del ADN para intentar (ideal ≥ 85%)

0datos del cliente hardcodeados fuera de marca.ts

El pipeline — 6 pasos

ADN del cliente

Skill adn: recolecta y cura todo el material público (web, redes, prensa, fotos, paleta, tono de voz, datos duros) → clientes/<slug>/adn/. Devuelve un % de readiness automático.

Brief oneshot

Skill brief-oneshot: convierte el ADN en marca.ts (token por token, con procedencia) + el BRIEF-EQUIPO. Verifica readiness antes de disparar.

Esqueleto base

Se copia catalogo-landings/cindercapacitaciones/ (Next 15 + Tailwind + shadcn) a clientes/<slug>/landing/. Los 9 slots ya están resueltos; solo consumen tokens.

Llenar marca.ts

Todo lo del cliente vive en un solo archivo. Regla dura: si un dato del cliente aparece hardcodeado fuera de marca.ts, es un bug.

Showcase de variantes Estándar mínimo

No se muestra una landing: se arma un showcase con ≥8 variantes sobre el mismo contenido del brief (4 esqueletos que cambian la posición del VSL + 4 skins de color/tipografía con botón 🎨). El cliente elige estructura + skin en una sola página. Ver la sección de abajo.

QA y deploy

anti-ia-detector + mobile-qa-auto (viewport 390px) antes de publicar. Piso de calidad: ≥ iConcreta v2. Mobile-first: 95% del tráfico de campañas es celular.

Compuerta de calidad: readiness del ADN < 60% → NO se intenta el oneshot. Una landing generada con datos incompletos sale genérica, y una landing genérica no se arregla puliendo CSS: hay que rehacerla.

El contrato: 9 slots → token → de dónde sale

Cada slot del esqueleto consume un dato del ADN. Esta tabla es el contrato completo.

#	Slot	Token	Sale de (ADN)
1	Apertura animada	`marca.tema`	ficha → tema/metáfora (confirmar con cliente)	Crítico
2	Hero	`marca.hero.*`	foto hero (score ≥55) + voz del corpus	Crítico
3	Barra de stats	`marca.stats[]`	datos duros — 3 cifras reales o no va	Opcional
4	VSL falso play	`marca.vsl.*`	video propio + poster limpio	Opcional
5	Productos / servicios	`marca.productos[]`	datos duros + fotos con rol (nombres vigentes)	Crítico
6	3 pilares	`marca.pilares[]`	la voz del cliente, no la nuestra	Crítico
7	Prueba social	`marca.logos/certs/testimonios`	logos + certificaciones + citas reales	Opcional
8	CTA / agenda	`marca.wa/tel/calendario`	datos duros — en Chile el WhatsApp convierte	Crítico
9	Footer	`marca.legal/redes`	datos duros + razón social	Opcional

El Showcase — el estándar mínimo de entrega Nuevo

Post-ADN nunca se entrega una landing suelta. Se entrega un showcase: una sola URL que le muestra al cliente el recorrido interactivo + mínimo 8 variantes de landing, todas con el mismo contenido real del brief. El cliente elige; nosotros dejamos fina la elegida y va a deploy. Referencia viva: perla-showcase (está en la pestaña Showcase del catálogo).

4 + 44 esqueletos (estructura) × 4 skins (color/tipografía) = mínimo 8

1 contenidoel mismo brief real en todas — cambia la forma, no los datos

🎨 1 cliccada esqueleto se repinta con los 4 sistemas de color en vivo

Los 4 esqueletos — cambian dónde va el VSL

E · VSL protagonista — video héroe al centro, CTA debajo. Estilo funnel, máxima conversión por video.
F · Hero partido — copy + stats a un lado, video vertical al otro. Equilibra argumento y prueba.
G · VSL pivote central — hero de texto, y en el medio una banda full-bleed con el video: el giro emocional.
H · Carta larga — columna única, ritmo de carta de ventas: gancho → video → problema → oferta.

Los 4 skins — cambian color y tipografía

Sistema oscuro premium — base profunda, glow, vidrio. Íntimo, envolvente.
Editorial claro — papel crema, serif en cursiva, aire. Autoridad de revista.
Clínico/confianza — blanco + acento institucional, trust bar, cards. El más "consulta".
Aura/bold moderno — gradient mesh animado, tipografía grande y redonda. Cara wellness-app.

Cómo se construye sin recalentar tokens: un solo motor de temas (shared/base.css con :root[data-theme="…"] + shared/app.js con el switcher y localStorage). Cada esqueleto es HTML que consume esas variables; cambiar de skin es cambiar un atributo data-theme, no reescribir la página. Kit reutilizable listo para copiar: catalogo-landings/showcase-kit/.

Reglas del rubro por encima del diseño: todas las variantes comparten copy empático, contraindicaciones visibles y cero promesas médicas/legales. El skin cambia la piel, nunca el cumplimiento. Y los 4 sistemas de color salen de paleta.json del ADN — no se inventan.

Colores: tokens, no literales

La base (clara u oscura) la decide paleta.json del ADN de cada cliente — nunca se copia la del esqueleto. El acento se elige por croma, no por cantidad de píxeles: los acentos pesan ~2% y rankeados por cantidad quedan enterrados bajo los neutros.

:root{
  --base:      /* paleta.json → recomendacion.base  (¡CLARA u OSCURA!) */
  --acento:    /* paleta.json → marca_candidatos[0] (por croma)        */
  --acento-2:  /* marca_candidatos[1]                                  */
  --tinta:     /* paleta.json → recomendacion.texto_sobre_dominante    */
}

Qué se copia del esqueleto y qué no

Se copia (patrones probados)

Hero con @keyframes, no con librería — Ken Burns CSS puro, cero JS, no cuesta LCP
Falso play siempre — preload="metadata" + poster; nunca autoplay en 4G
Rutas reales — / · /agendar · /gracias: cada paso del embudo dispara su evento en Meta
Una base, tres variantes — la capa de captura es un flag, no tres páginas
WhatsApp con ?text= por punto de entrada
GTM en layout, no el pixel a mano

No se copia

La base oscura — la decide el ADN de cada cliente
Colores hardcodeados — van a variables CSS
Textos del esqueleto — la voz sale del corpus del cliente nuevo
Constantes literales en componentes — van a marca.ts

Dónde está cada pieza

Pieza	Ruta en el workspace
Esqueleto + contrato	`catalogo-landings/cindercapacitaciones/ESQUELETO.md`
Tokens de marca	`catalogo-landings/cindercapacitaciones/marca.example.ts`
Fuente de oro	`clientes/Cinder/cinder-src/src/`
Skill ADN	`skills/adn/SKILL.md`
Skill brief oneshot	`skills/brief-oneshot/SKILL.md`
Bloques listos	`skills/web-blocks-library/blocks/`
Animaciones listas	`skills/web-animations-catalog/SKILL.md`
Kit de showcase (motor + contrato)	`catalogo-landings/showcase-kit/`
Showcase de referencia (Perla)	`clientes/perla-bereaud/perla-showcase/` · live