Portfólio

Visión general

Mi portafolio personal es un proyecto personal creado para representar con precisión mi identidad visual y mi trayectoria profesional como desarrollador front-end. El concepto va más allá de mostrar trabajos: fue diseñado como una experiencia de marca personal, con una estética moderna, creativa y profesional basada en una paleta de naranja y gris.

Contexto y objetivo

El desarrollo se extendió por aproximadamente 11 meses, equilibrando mis estudios en Análisis y Desarrollo de Sistemas con entregas reales como freelancer. El objetivo fue construir una vitrina que comunique madurez técnica, consistencia visual y capacidad de ejecución, entregando una experiencia de navegación fluida y atractiva de principio a fin.

El desafío

El principal desafío fue equilibrar una personalidad visual fuerte con claridad y rendimiento, sin depender de frameworks. Fue necesario mantener ritmo, legibilidad y responsividad en cada sección, además de sostener una experiencia dinámica con animaciones e interacciones sin perder ligereza, organización de código ni consistencia estética.

La estrategia

Estructurar el portafolio como una narrativa de navegación, donde cada sección refuerza una etapa de mi identidad profesional. La alternancia de colores y la jerarquía del contenido fueron planificadas para crear ritmo visual y guiar al usuario de forma natural, manteniendo la lectura predecible y la atención en los puntos más importantes.

Lo que se implementó

Front-end desarrollado desde cero:

• HTML, CSS y JavaScript puro: estructura completa sin frameworks para mantener control total de rendimiento, responsividad y personalización visual.
• Estandarización visual: definición consistente de tipografías, tamaños, espaciados y contraste para mantener legibilidad y unidad.
• Navegación con ritmo: alternancia de colores entre secciones para crear una experiencia de scroll más envolvente.

Interacciones y experiencia dinámica:

• Cargas y comportamientos dinámicos: implementación de flujos que hacen la experiencia más responsiva y viva.
• Animaciones y microinteracciones: efectos visuales diseñados para reforzar modernidad sin comprometer el rendimiento.
• Modales y botones de acción: apertura de modales, interacciones con CTAs y comportamientos responsivos integrados al layout.

Soporte de IA y estructura complementaria:

• OpenAI Codex: uso del agente para generar la base del back-end a partir de prompts técnicos elaborados con precisión.
• Integración del front-end y lógica: implementación de las conexiones necesarias para garantizar un funcionamiento integrado y consistente.

Resultado

El resultado es un portafolio que funciona como vitrina y como producto, comunicando identidad, consistencia y ejecución técnica. Representa lo que soy capaz de construir hoy y también cómo evoluciono continuamente, como un proyecto vivo en constante refinamiento, acompañando mi trayectoria profesional y mi búsqueda de innovación.