erikghandClaude Opus 5
d4bff33e47
Prometí en la vista previa que entrarían «de una en una al bajar» y lo que monté las traía a las cuatro a la vez: un stagger de contenedor se dispara con la sección al 30% en pantalla, y la sección mide 1.200px, así que el lector veía aparecer todas las frases mucho antes de llegar a ellas. Ahora cada cita usa TextoDesenfoque, que lleva su propio observador: cada una espera su turno y entonces se resuelve desde un desenfoque, palabra a palabra. Es el dolor entrando en foco, y es el mismo recurso que ya usan el hero y la frase ancla — vocabulario del proyecto, no un invento nuevo. Verificado midiendo la opacidad de la palabra animada de cada cita: al asomar la sección, las dos primeras están resueltas y las dos últimas a cero; a media sección, las cuatro. Antes de corregir el selector medía el span envoltorio y daba unos en todas, que no significaba nada. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
creeer
Landing page one-page para creeer, marca personal de una estratega de crecimiento. Next.js 14 (App Router) + TypeScript + Tailwind CSS + Framer Motion, exportada como sitio estático.
Requisitos
- Node.js 20+
- pnpm 11+ (
corepack enable)
Comandos
pnpm install # instalar dependencias
pnpm dev # servidor de desarrollo (http://localhost:3000)
pnpm build # build estático → out/
pnpm test # tests (Vitest)
pnpm lint # ESLint
Estructura
app/ # App Router (layout, page, globals.css)
components/
primitives/ # Wordmark, Container, CTA (reutilizables)
sections/ # Hero, FraseAncla, ParaQuien, Mecanismo, Disciplinas, Estratega, Cierre, ComoEmpezar
layout/ # Header, Footer
lib/
content.ts # todo el copy (source of truth)
motion.ts # variantes Framer Motion + reduced-motion
docs/ # spec, plan, directrices de marca
Decisiones de diseño
Ver docs/dueña-directrices.md (directrices de marca) y docs/superpowers/specs/2026-07-20-creeer-landing-design.md (spec completo).