Don Micka de la Vega
Portfolio bilingüe (EN/FR) para un fotógrafo, con motion engineering como eje: transiciones GSAP, smooth scroll y un CMS propio para que el cliente publique su obra sin tocar código.
- Next.js 16
- TypeScript
- Tailwind CSS
- GSAP
- Lenis
- PocketBase
- Playwright
Un fotógrafo francés necesitaba un portfolio que se sintiera editorial y en movimiento, en dos idiomas, y quería cargar sus propias fotos y reescribir sus textos sin depender de mí. Eso obligaba a resolver tres cosas juntas: animación fluida sin castigar el rendimiento, contenido editable desde un panel, y accesos administrativos separados para que su cuenta no fuera la de servicio.
GSAP con Lenis para el scroll y las transiciones, con las constantes de timing exportadas y fijadas por tests para que nadie las mueva sin darse cuenta. Backend en PocketBase sobre VPS propio, con panel de administración, cuentas separadas (una del cliente, una de servicio) y una guía imprimible en `/admin/help`. SEO técnico completo: canonicals, hreflang en/fr, og-image generada con `next/og`, sitemap con ISR y `noindex` en el admin. CI en GitHub Actions con unit tests siempre y Playwright end-to-end en los pull requests.
En producción y en manos del cliente, que carga su contenido desde el panel y reportó cero bugs. 96 unit tests y la suite end-to-end en verde. El toggle de idioma bajó de 0,46 s a 0,16 s hasta el inicio de la navegación: el cuello de botella no era la duración de la animación sino que la navegación esperaba el `onComplete` del timeline en vez de solaparse con él.
Proyecto freelance trabajado por stages sobre una propuesta formal y el Figma del cliente. Cada stage cerró con verificación completa (typecheck, lint, unit tests y build) antes de mergear a producción.