Llevo más de 15 años diseñando productos digitales. Sé cómo definir un sistema de diseño, facilitar una sesión de investigación o escribir un documento de estrategia de contenido. También sé programar y montar sitios web — pero no a este nivel. No con la profundidad de decisiones de infraestructura, pipelines de deployment y configuración de DNS que exige un sitio en producción real.
Esta es la historia de cómo construí andresballen.com desde cero usando Claude Code, y lo que esa experiencia reveló sobre el futuro del trabajo de diseño.
Empezó con documentos, no con código
Antes de escribir una sola línea de código, pasé semanas en una fase de investigación paralela — corriendo las mismas preguntas en ChatGPT, Gemini, Claude, Grok y Copilot simultáneamente, y luego comparando y sintetizando los resultados.
El brief era simple: ayúdame a construir un portafolio que compita a un nivel alto. Lo que siguió fue una serie de documentos markdown que se convirtieron en la base de todo: un benchmark de los 20 mejores portafolios UX del mundo con análisis individual de cada uno, un informe de investigación profunda sobre patrones de UX en banca digital desde mi trabajo profesional, una estrategia de contenido completa en español e inglés, una definición del sistema de diseño, un inventario de componentes, y un documento de perfil profesional que sintetizó 15 años de trayectoria en una narrativa coherente.
Cada IA aportó algo diferente. ChatGPT era metódico y estructurado. Gemini profundizaba en el análisis competitivo. Grok era más rápido y más opinionado. Claude era el mejor para razonar a través de contradicciones y sintetizar entre fuentes. Copilot fue útil para la investigación más técnica. Ninguno solo produjo lo que todos juntos lograron.
También tenía una materia prima importante: mi sitio anterior en WordPress. Exporté la base de datos — posts, páginas, contenido acumulado durante más de una década — y la alimenté en el proceso de investigación. La IA me ayudó a identificar qué seguía siendo relevante, qué había envejecido mal, qué necesitaba reescribirse desde cero, y qué podía convertirse en la base de nuevos casos de estudio. El sitio nuevo no surgió de la nada — surgió de una conversación honesta entre lo que era, lo que quería ser, y lo que el mercado estaba buscando.
El resultado fue algo que no esperaba: un punto de partida inusualmente coherente. Para cuando escribí la primera línea de código, ya sabía el tono de voz, la lógica de enrutamiento bilingüe, qué contenido realmente necesitaba existir, y qué quería decir el sitio sobre mí profesionalmente. Ese es el trabajo que normalmente se omite — y es exactamente el trabajo que la mayoría de los portafolios no hacen.
Claude Code como colaborador, no como herramienta
Quiero ser honesto sobre lo que Claude Code es y no es. No es un generador de código al que le das un prompt y te alejas. Se parece más a un desarrollador senior muy capaz que trabaja en tu terminal, lee tus archivos, razona sobre tu código base y te dice cuando algo es mala idea.
Los mejores momentos no fueron cuando escribió código por mí. Fueron cuando yo describía un problema y él cuestionaba: *"este enfoque va a romper el routing de i18n porque..."* o *"la estrategia del deploy branch va a chocar con el límite de 100MB de GitHub por el binario @next/swc."* Esos fueron los momentos en que aprendí algo real.
El capítulo de cPanel (o: cómo casi abandoné)
El plan original era alojar en cPanel — mi hosting compartido existente. Lo que siguió fueron aproximadamente dos semanas de debugging que tocó workflows de GitHub Actions, scripts de carga FTP, límites de cuota de disco, corrupción del caché de npm y errores de repositorio git que todavía no entiendo del todo.
Mirando atrás, ese capítulo fue realmente valioso. Me obligó a entender el stack de deployment a un nivel que nunca había necesitado antes. Aprendí qué es realmente un build standalone de Next.js. Aprendí por qué node_modules no puede ir en un repositorio git. Aprendí que 1GB de hosting desaparece más rápido de lo que crees cuando estás construyendo JavaScript moderno.
La lección no fue "cPanel es malo." Fue: la decisión correcta de infraestructura depende del proyecto, y migrar temprano es mejor que migrar bajo presión.
Mover a Vercel cambió todo
La decisión de mover a Vercel se tomó en menos de una hora. En 30 minutos el sitio estaba deployado. En otros 30, el formulario de contacto funcionaba.
Ese contraste — dos semanas de debugging en cPanel vs. 30 minutos en Vercel — dice algo sobre la importancia de elegir la herramienta correcta para el trabajo. Para un portafolio en Next.js, Vercel es la elección obvia. Debí haber empezado ahí.
El agujero negro del DNS
Incluso después de que Vercel funcionaba perfectamente, el dominio personalizado tardó casi 24 horas en propagarse completamente. Y cuando lo hizo, el formulario de contacto dejó de funcionar — porque el servidor SMTP vivía en cPanel, y los registros DNS de correo ahora apuntaban a IPs de Vercel.
Luego los emails rebotaban desde Gmail con errores de SPF y DKIM, porque cPanel enruta el email a través de MailChannels y esa IP de relay no estaba en el registro SPF.
Estos son el tipo de problemas que me habrían tomado días resolver solo. Con Claude Code, cada uno se diagnosticó y resolvió en minutos — no porque la IA "supiera la respuesta", sino porque podía leer los logs de error, entender los registros DNS, explicar qué fallaba y por qué, y proponer una solución.
Lo que realmente aprendí
La IA amplifica tu conocimiento existente. Mientras más entendía sobre DNS, HTTP y deployment, mejores eran mis conversaciones con Claude Code. No es un atajo para evitar entender — es un multiplicador sobre lo que ya sabes.
Las habilidades de diseño se transfirieron directamente. Pensar en sistemas, definir problemas antes de saltar a soluciones, entender flujos de usuario — todo eso se aplicó directamente a las decisiones arquitectónicas en el código. DesignOps está más cerca de DevOps de lo que la mayoría de diseñadores se da cuenta.
La documentación es un entregable de primera clase. Los documentos markdown de la fase de investigación se convirtieron en la fuente de verdad del proyecto. El historial de commits se convirtió en el changelog. Escribir con claridad, desde el principio, rindió frutos cada vez que volví al proyecto.
La velocidad sin calidad es solo deuda técnica. Hubo momentos en que Claude Code sugirió una solución rápida que habría introducido una vulnerabilidad de seguridad o un bypass del CSP. Detectar esos momentos — y cuestionar — requirió criterio que ninguna IA puede reemplazar.
Lo que sigue
Este sitio no está terminado. La animación Three.js del hero necesita ajustes. Hay casos de estudio que escribir. El contenido bilingüe necesita expansión.
Pero está en vivo, es rápido, envía emails, rastrea analíticas y representa mi trabajo con precisión. Para un proyecto individual construido sin presupuesto de desarrollo, eso no es poca cosa.
Más que el sitio en sí, este proceso me dio un nuevo modelo sobre cómo los diseñadores pueden construir. No aprendiendo a programar en el sentido tradicional — sino desarrollando suficiente alfabetización técnica para colaborar de manera significativa con herramientas de IA que pueden manejar la implementación.
Esa es la habilidad en la que voy a seguir invirtiendo.
