Galaxies Survey Builder

A Galaxies construía uma plataforma de inteligência de dados para a indústria brasileira de games, agregando respostas de gamers e transformando-as em insights de mercado para estúdios e publishers. O backoffice que sustentava essa pesquisa dependia de um construtor de formulários que havia se tornado frágil: administradores precisavam adivinhar o comportamento da interface ou consultar o desenvolvedor original para entender como funcionava.

Entrei no projeto para assumir a reescrita completa desse construtor, da v1 para a v2, com um prazo de três semanas e um time completamente remoto de cinco pessoas.

Os Desafios

O construtor v1 tinha um schema já em uso em todas as pesquisas existentes. Qualquer reescrita precisava manter compatibilidade total com versões anteriores: formulários já salvos no banco deveriam carregar corretamente na nova UI, e tudo que fosse gerado precisava continuar sendo lido pelo mesmo renderizador de formulários. Alterar o schema estava fora de cogitação.

A implementação v1 também carregava e rastreava estado em massa, o que causava problemas de performance conforme os formulários cresciam. Isso precisava ser resolvido sem quebrar nada upstream ou downstream.

Backoffice

Reconstruindo o construtor de pesquisas

Projetei e construí o construtor v2 do zero. A página permitia que administradores configurassem dinamicamente cada aspecto de uma pergunta de pesquisa: categoria, imagem, caption, tipo de pergunta (texto corrido, multi seleção e outros), metadados de acessibilidade e strings de i18n, tudo em uma única interface.

Redesenhei o modelo de estado para ser cirúrgico, rastreando apenas o que estava sendo ativamente editado em vez de manter o formulário inteiro em memória. A arquitetura foi baseada em padrões construídos na FDTE para interfaces de formulários dinâmicos similares. Priorizou simplicidade e previsibilidade em vez de generalidade.

O desafio mais difícil foi a compatibilidade de schema: o output gerado pela nova UI precisava ser parseável pelo renderizador existente, enquanto todos os formulários já no banco carregavam corretamente sem migração.

A v2 foi para produção dentro do prazo. O resultado mais significativo foi a usabilidade: administradores passaram a configurar pesquisas de forma independente, sem precisar perguntar ao desenvolvedor que escreveu a v1 o que cada campo significava.

Tecnologias

• React: árvore de componentes do construtor de pesquisas dinâmico
• Material UI: sistema de design usado na UI do backoffice
• GraphQL: queries e mutations para carregar e persistir configurações de pesquisa
• TypeScript: tipagem fim a fim em todo o schema de formulários

Destaques Técnicos

A compatibilidade retroativa foi o principal driver de design: a nova UI precisava produzir output parseável pelo renderizador existente e carregar todos os formulários legados sem migração. Além disso, a v1 mantinha o formulário inteiro em memória; a reescrita passou a rastrear apenas o escopo de edição ativo, o que resolveu de fato os problemas de performance que tornavam o construtor antigo lento em pesquisas complexas.

• Arquitetura baseada em padrões anteriores: modelada a partir de sistemas de formulários construídos na FDTE, priorizando uma estrutura simples e previsível