Galaxies Survey Builder
Backoffice de una plataforma de investigación de videojuegos reescrito desde cero en tres semanas — compatibilidad total de esquema, gestión de estado quirúrgica y administradores que dejaron de depender del desarrollador.
- TypeScript
- React
- GraphQL
Galaxies construía una plataforma de inteligencia de datos para la industria brasileña de videojuegos — agregando respuestas de gamers y convirtiéndolas en insights de mercado para estudios y publishers. El backoffice que sustentaba esa investigación dependía de un constructor de formularios que se había vuelto frágil: los administradores tenían que adivinar el comportamiento de la interfaz o consultar al desarrollador original para entender cómo funcionaba.
Me incorporé al proyecto para asumir la reescritura completa de ese constructor, de v1 a v2, con un plazo de tres semanas y un equipo completamente remoto de cinco personas.
Las Restricciones
El constructor v1 tenía un esquema ya en uso en todas las encuestas existentes. Cualquier reescritura debía mantener compatibilidad total con versiones anteriores — los formularios ya guardados en la base de datos debían cargarse correctamente en la nueva UI, y todo lo generado debía seguir siendo legible por el mismo renderizador de formularios. Cambiar el esquema no era una opción.
La implementación v1 también cargaba y rastreaba estado en masa, lo que causaba problemas de performance a medida que los formularios crecían — un problema que debía resolverse sin romper nada upstream ni downstream.
Backoffice
Reconstruyendo el constructor de encuestas
Diseñé y construí el constructor v2 desde cero. La página permitía a los administradores configurar dinámicamente cada aspecto de una pregunta de investigación: categoría, imagen, caption, tipo de pregunta (texto libre, selección múltiple y otros), metadatos de accesibilidad y strings de i18n — todo en una sola interfaz.
Rediseñé el modelo de estado para ser quirúrgico, rastreando solo lo que se estaba editando activamente en lugar de mantener el formulario entero en memoria. La arquitectura se basó en patrones construidos en FDTE para interfaces de formularios dinámicos similares — priorizando simplicidad y previsibilidad.
El desafío más difícil fue la compatibilidad de esquema: el output generado por la nueva UI debía ser parseable por el renderizador existente, mientras que todos los formularios ya en la base de datos se cargaban correctamente sin migración.
La v2 llegó a producción dentro del plazo. El resultado más significativo fue la usabilidad: los administradores podían configurar encuestas de forma independiente, sin necesidad de preguntar al desarrollador que escribió la v1 qué significaba cada campo.
Tecnologías
- React — árbol de componentes para el constructor de encuestas dinámico
- Material UI — sistema de diseño usado en la UI del backoffice
- GraphQL — queries y mutations para cargar y persistir configuraciones de encuestas
- TypeScript — tipado de extremo a extremo en todo el esquema de formularios
Aspectos Técnicos Destacados
- Reescritura con compatibilidad de esquema — la nueva UI debía producir output parseable por el renderizador existente y cargar todos los formularios legados sin migración, convirtiendo la compatibilidad retroactiva en el principal driver de diseño
- Gestión de estado quirúrgica — la v1 mantenía el formulario entero en memoria; la reescritura rastreaba solo el alcance de edición activo, eliminando los problemas de performance que hacían lento al constructor antiguo en encuestas complejas
- Arquitectura basada en patrones anteriores — modelada a partir de sistemas de formularios construidos en FDTE, priorizando una estructura simple y predecible