Claridad
La información importante debe encontrarse rápidamente y sin explicaciones innecesarias.
Software Engineer / Product Developer · TypeScript · React · Node.js
Hola, soy Luis Villanueva.
Transformo problemas complejos en productos digitales claros, interactivos y preparados para evolucionar.
Creo productos digitales donde la experiencia del usuario, la arquitectura del código y el diseño trabajan como un solo sistema.
Mapas interactivos
Visualización de datos
Componentes reutilizables
Interfaces accesibles
Frontend DevelopmentUI EngineeringUX ThinkingAccesibilidadResponsive DesignProduct Thinking
Mi enfoque
Cómo pienso un producto
Antes de escribir código, cada proyecto comienza entendiendo el problema, organizando la información y construyendo una estructura que permita que el producto crezca con el tiempo.
- 01
Problema
Identifico qué necesidad debe resolverse y cuál es el resultado que espera el usuario.
- 02
Usuarios
Analizo quién utilizará el producto y qué información necesita encontrar con mayor rapidez.
- 03
Arquitectura
Defino las entidades, los datos y la relación entre las distintas partes del sistema.
- 04
Wireframe
Organizo la información mediante bloques sencillos antes de trabajar los detalles visuales.
- 05
Componentes
Construyo elementos reutilizables que mantengan consistencia y faciliten futuros cambios.
- 06
Interacción
Agrego feedback, estados y microinteracciones que permitan que la interfaz se sienta viva.
- 07
Producto
Integro diseño, código y experiencia en una solución clara, funcional y mantenible.
Lo que guía mi trabajo
Principios de diseño y desarrollo
Busco que cada producto sea fácil de comprender, agradable de utilizar y sencillo de mantener.
Componentes reutilizables
Construyo sistemas consistentes antes que soluciones aisladas.
Accesibilidad
Una buena interfaz debe poder ser utilizada por la mayor cantidad posible de personas.
Feedback
Cada acción debe comunicar claramente qué está ocurriendo dentro del sistema.
Interacción
Las microinteracciones aportan vida a la interfaz y ayudan a orientar al usuario.
Escalabilidad
Pienso en los cambios futuros desde las primeras decisiones de arquitectura.
Lo que disfruto construir
Interfaces donde la información y la interacción se encuentran
Me interesan especialmente los productos que requieren organizar información compleja y transformarla en una experiencia visual sencilla.
Mapas
Experiencias geográficas que ayudan a comprender rutas, ubicaciones y relaciones espaciales.
Dashboards
Visualización de datos, métricas e indicadores que facilitan la toma de decisiones.
Sistemas interactivos
Interfaces construidas con componentes reutilizables, estados claros y feedback inmediato.
Productos digitales
Proyectos destacados
Una selección de productos en los que participé desde la organización de la experiencia hasta su implementación Frontend.
Colección Épica
Caso->Plataforma de registro, acceso mediante QR y visualización de estadísticas para una exposición temporal. Alcanzó aproximadamente 5,700 registros y 4,800 asistentes validados.
Frontend Developer
Circuito San Pedro
Caso->Mapa interactivo para consultar rutas gratuitas, paradas y caminos hacia la parada más cercana.
Frontend Developer · UI/UX
Mercado de la Fregonería
Caso->Experiencia digital para descubrir emprendedores, productos artesanales y la distribución del mercado.
Frontend Developer · UI Design
Hacemos San Pedro
Caso->Plataforma de participación ciudadana para consultar proyectos públicos y registrar propuestas.
Frontend Developer
Vive San Pedro
Caso->Calendario de eventos municipales con filtros, registro de interés y notificaciones.
Frontend Developer
Vuelve a Centrito
Caso->Plataforma para reactivar la vida urbana, cultural y comercial de Centrito.
Frontend Developer · UI Design
Mi proceso
Del problema al producto
Mi proceso combina pensamiento de producto, arquitectura Frontend e iteración visual directamente sobre el código.
01
Idea
Comprendo la necesidad y defino qué debe resolver el producto.
02
Entidades
Identifico los objetos, datos y relaciones que existirán dentro del sistema.
03
Wireframe
Organizo las pantallas mediante bloques y jerarquías simples.
04
Código
Construyo una primera versión funcional utilizando datos simulados.
05
Iteración
Ajusto distribución, contenido y estilo mientras la interfaz toma forma.
06
Microinteracciones
Incorporo estados, transiciones y feedback para mejorar la experiencia.
07
Producto
Conecto los datos reales y preparo una solución estable y mantenible.
“Suelo alejar la pantalla para comprobar que la jerarquía visual siga siendo clara incluso antes de leer el contenido.”
Experiencia relevante
Experiencia que respalda mi trabajo
He desarrollado productos digitales y sistemas internos, participando en frontend, backend, datos y entregas.
Sector publico
Plataformas web, sistemas internos, flujos de registro, mapas y productos digitales para instituciones.
Manufactura
Sistemas full stack para trazabilidad, correccion de datos y soporte a procesos de produccion.
Empresas multinacionales
Desarrollo de servicios B2B y automatizacion de pruebas para equipos y productos de alcance internacional.
Tecnología
Herramientas que utilizo para construir productos
La tecnología es una herramienta. El objetivo siempre es resolver el problema de la forma más clara y mantenible posible.
Frontend
- React
- Next.js
- TypeScript
- JavaScript
- Tailwind CSS
- Zustand
- React Router
- Zod
Backend
- Node.js
- Hono
- NestJS
- .NET
- PostgreSQL
- SQL Server
- Drizzle ORM
Herramientas
- Figma
- Google Maps
- Google Charts
- Docker
- GitHub Actions
- ArgoCD
- Git
Las herramientas cambian. Resolver problemas permanece.
Más allá del desarrollo
También participo en los detalles que completan el producto
En distintos proyectos he asumido tareas adicionales para mantener la calidad y coherencia de la experiencia final.
Obtención de recursos visuales
Busco, selecciono o genero los recursos necesarios cuando el proyecto no cuenta con todos los assets.
Edición y optimización de imágenes
Recorto, adapto y optimizo imágenes para mejorar su integración y rendimiento en la web.
Organización del contenido
Transformo información extensa o desordenada en una estructura fácil de explorar.
Definición de componentes
Diseño componentes que puedan reutilizarse en distintas pantallas y estados.
Arquitectura Frontend
Organizo servicios, datos y módulos pensando en el mantenimiento y la evolución del proyecto.
Dirección visual
Adapto identidades existentes y tomo decisiones de composición para construir una experiencia coherente.
Sobre mí
Diseño y desarrollo como partes de un mismo proceso
Soy Software Engineer y Product Developer en desarrollo. Disfruto construir productos donde el diseño, la interacción y el código trabajan de manera conjunta.
Trabajo con TypeScript, React, Next.js, Node.js, APIs y PostgreSQL, con una preferencia especial por frontend y experiencia completa de producto.
Mi forma de trabajar parte de entender el problema, imaginar cómo crecerá el producto y convertir esa estructura en una experiencia sencilla de utilizar.
Amabilidad
Valoro la colaboración, la comunicación clara y el trabajo en equipo.
Confianza
Me gusta asumir responsabilidad y dar seguimiento a los detalles del producto.
Diversidad de ideas
Exploro distintas soluciones y no tengo miedo de proponer enfoques poco convencionales.
Contacto
Construyamos un producto que las personas quieran utilizar
Estoy interesado en oportunidades donde el diseño, el desarrollo y la experiencia del usuario tengan la misma importancia.