Caso de estudio 04 · Proyecto propio · IA + código
Mundial 2026 — Construir la experiencia que diseñé.
Un explorador interactivo del Mundial hecho con SYX, GSAP, Three.js y Leaflet, usado para demostrar ejecución de principio a fin con desarrollo asistido por IA.
- Rol
- Product Designer · constructor
- Base
- SYX
- Interacción
- GSAP · Three.js · Leaflet
- Modo
- Desarrollo asistido por IA
Evidencia de producto real
El entregable es la experiencia funcionando.
Esta vista previa renderiza directamente dentro del caso de estudio el explorador del Mundial 2026 ya publicado. Da contexto visual inmediato manteniendo la experiencia completa a un clic.
SYX / EXPLORADOR INTERACTIVO
2026Idea de producto → interacción → código asistido por IA → experiencia funcionando
Por qué lo construí
Demostrar que mi rol puede ir más allá de la entrega.
El proyecto es propio y deliberadamente cargado de interacción. Lo usé para explorar hasta dónde podía llevar un concepto de producto cuando el desarrollo asistido por IA opera dentro de un sistema que ya entiendo y gobierno.
Primero el sistema
SYX aporta las restricciones antes de que la IA escriba la implementación.
El proyecto está construido sobre SYX en lugar de generado como una página aislada, así que hereda un lenguaje ya existente de tokens, componentes, arquitectura CSS y reutilización.
Interacción
Usar el motion y las interfaces espaciales como herramientas de producto.
El explorador combina tecnologías de cartografía, 3D y motion. El trabajo no fue añadir librerías, sino coordinarlas en una sola experiencia navegable, con un único lenguaje de interacción entre las tres.
Flujo de trabajo con IA
La IA amplía lo que puedo ejecutar directamente.
En lugar de presentar la IA como autoría, la presento como una capa de ejecución: yo defino la intención, las restricciones y el sistema; la IA ayuda a acelerar la implementación y la iteración.
Conclusión
El entregable es el producto funcionando.
Este caso demuestra un final distinto al de una entrega de diseño tradicional: una experiencia interactiva funcionando que se puede inspeccionar como producto y como código.