// Portfolio · Selected Work · 2026

Construyo experiencias que conectan.

Tres piezas seleccionadas que muestran mi rango: desde landing pages editoriales con identidad propia, hasta dashboards de IA con datos en tiempo real. Cada caso resuelve un problema real con criterio técnico y sensibilidad humana.

03 casos seleccionados HTML · CSS · JS · IA Patagonia, AR
// Scroll para ver los casos Empezar
Caso 01
Landing Page · Premium

Identidad editorial para coach.

Landing page con estética dark luxury para coach personal premium. Tipografía editorial Cormorant Garamond, paleta dorado/carbón, animaciones sutiles que transmiten autoridad sin perder calidez.

Stack HTML5 CSS3 JS Vanilla Cormorant + Syne
  • Hero con SVG animado de brújula que rota
  • Glow ambient flotante y efecto sweep dorado
  • Sticky header con animación de pulso
  • 10 secciones con scroll fade-in
Ver demo en vivo → Cómo lo construí
landing-coach.juanjoalegre.com
Live demo
Caso 02
Interactive Tool · Quiz

Quiz de arquetipos con lógica viva.

Quiz interactivo de 6 preguntas que tipifica al usuario en 4 arquetipos de liderazgo. Sistema de puntuación, validación, modal de cotización con campo condicional dinámico que aparece según la opción seleccionada.

Stack HTML5 CSS Animations JS State Mgmt Conditional Forms
  • Sistema de tipificación con tiebreaker logic
  • 4 SVGs únicos generados para cada arquetipo
  • Modal con validación regex + campos condicionales
  • Botones de share a WhatsApp, X y copy link
Probar demo → Cómo lo construí
quiz.juanjoalegre.com
A B C D
Interactivo
Caso 03
SaaS Dashboard · AI Agents

Dashboard de agentes IA en vivo.

Panel de control para monitorear agentes de IA en tiempo real. Métricas que se actualizan solas, gráfico SVG con curvas Bézier que se regenera, log de actividad streaming, tabla con status pulsantes. Pensado para stack n8n + Claude API + Supabase.

Stack HTML5 SVG Live JS Realtime n8n + Claude API Supabase
  • KPIs animados con tween counters al cargar
  • Gráfico SVG dual (Bézier + áreas) auto-refresh cada 6s
  • Activity log con streaming + auto-cleanup
  • Search bar con shortcut ⌘K + sidebar fija
Ver dashboard → Cómo lo construí
dashboard.juanjoalegre.com
Real-time
// Proceso

Cómo construyo cada caso.

No improvise. Cada proyecto sigue un proceso claro de 4 fases que combina el rigor técnico con la escucha humana. Por eso los resultados son rápidos, sólidos y se sienten propios desde el primer borrador.

Conocer mi propuesta →
// 01

Sesión de escucha

60 minutos sin costo para entender el proyecto, el contexto y los objetivos. Si hay match, avanzamos.

Duración: 60 min · Sin compromiso
// 02

Diseño estratégico

Defino arquitectura técnica, estética visual, contenidos clave y cronograma. Te entrego un blueprint claro antes de tocar una línea de código.

Duración: 5-7 días
// 03

Construcción iterativa

Construcción con feedback en cada hito clave. Acceso a previews en vivo durante todo el proceso. Sin sorpresas al final del recorrido.

Duración: 2-6 semanas según alcance
// 04

Lanzamiento y acompañamiento

Deploy, configuración de dominio, capacitación y 30 días de soporte incluidos. Te dejo autónomo con la herramienta funcionando.

30 días incluidos · Soporte mensual opcional
// Capabilities

Lo que sé construir.

Stack moderno, sin Make ni Zapier. Soluciones que escalan, mantenibles, propias.

🎨

Frontend

Webs e interfaces modernas, responsive y con identidad propia. Foco en performance y experiencia.

HTML5 CSS3 JS React
🤖

IA & Agentes

Workflows automatizados con LLMs para tareas reales. Triage, resúmenes, copilots a medida.

Claude API n8n MCP
🗄️

Backend & Data

Bases de datos, autenticación y APIs robustas. Stack moderno, escalable, mantenible en el tiempo.

Supabase PostgreSQL Python
🚀

Deploy & DevOps

Hosting, dominios, CI/CD. Te dejo todo configurado y documentado para que puedas mantenerlo solo.

Hetzner VPS Netlify Cloudflare
// Hablemos de tu proyecto

¿Tenés una idea? Construyámosla juntos.

Sea una landing premium, una herramienta interactiva, un dashboard con IA o un sistema completo: si lo podés imaginar, lo podemos construir. La primera conversación es sin costo y sin compromiso.

Solicitar cotización → 💬 WhatsApp directo