IngFAQ
O redesign do IngFAQ surgiu da necessidade de reestruturar e documentar padrões, módulos e tokens da plataforma, com o objetivo de implementar e consolidar o design system da Ingenium Systems.
Escopo do trabalho
Design System, Web App
Status
Em atuação
IngFAQ com o Design System integrado.
Como começou?
Quando entrei na Ingenium Systems, percebi que o IngFAQ, principal aplicação de suporte da empresa, enfrentava desafios de usabilidade e consistência visual. A ferramenta, que deveria centralizar informações e facilitar a rotina de gestores e funcionários, acabava se tornando um ponto de frustração: as interfaces eram desenvolvidas de forma isolada, havia falta de alinhamento entre design e desenvolvimento, e os usuários frequentemente relatavam dificuldades em encontrar e utilizar recursos básicos.
Esses problemas impactavam diretamente a eficiência da equipe e a experiência dos clientes. Diante desse cenário, conduzi o redesign completo do IngFAQ, com foco em tornar a aplicação mais intuitiva, escalável e alinhada às reais necessidades dos usuários. Durante o processo, aproveitei a oportunidade para estruturar e documentar padrões visuais e funcionais, integrando o projeto ao início de um Design System que hoje serve como base para futuros produtos da empresa.
Versão antiga da página de edição de artigo.
Identificando o problema
O IngFAQ foi desenvolvido para centralizar conteúdos de suporte e permitir que clientes criem, organizem e publiquem artigos de forma simples. No entanto, ao analisar a aplicação, percebi que sua estrutura apresentava barreiras que comprometiam tanto a experiência do usuário quanto a eficiência da ferramenta.
Para mapear esses pontos, realizei uma análise heurística da interface e da navegação, que revelou os seguintes problemas:
Inconsistência na hierarquia de títulos e seções – a utilização aleatória de H1, H2 e H3 dificultava a leitura e a escaneabilidade dos artigos.
Busca interna pouco eficiente – ao digitar palavras-chave, o sistema retornava resultados incompletos ou irrelevantes, tornando difícil encontrar conteúdos específicos.
Feedback limitado ao publicar conteúdo – não havia mensagens claras sobre status de publicação, erros ou sucesso, gerando insegurança nos usuários durante a criação e edição.
Gestão de links e mídias confusa – sem visualização prévia ou confirmação de formatação, aumentava o risco de artigos com imagens ou links quebrados.
Dificuldades de navegação entre categorias – a ausência de uma hierarquia clara obrigava os usuários a abrir múltiplos menus ou pesquisar manualmente para localizar conteúdos relacionados.
Versão antiga da página "Central de ajuda".
Abordagem e processos contra o tempo
A ausência de operações de design na equipe fazia com que os sistemas fossem desenvolvidos sem documentação clara, o que resultava em inconsistências de interface e falhas recorrentes. Além disso, não havia um time dedicado de DesignOps, e as demandas de design eram tratadas conforme a urgência do momento.
Para avançar com o redesign do IngFAQ, precisei estruturar um processo ágil e objetivo, dividido em quatro frentes principais:
Pesquisa e diagnóstico – conduzi um inventário da interface existente, mapeando elementos repetidos ou conflitantes, além de entrevistas rápidas com colaboradores para identificar as principais dores no uso da ferramenta.
Fundamentos visuais – defini padrões de cor, tipografia, espaçamento, ícones e estados de interação, garantindo maior consistência visual e usabilidade dentro da aplicação.
Construção de componentes – organizei a interface no Figma e criei versões revisadas dos elementos da aplicação, já com variantes de uso. Antes da implementação, testei a usabilidade internamente para validar fluxos de navegação e interações.
Documentação funcional – para manter a agilidade, toda a organização foi estruturada no próprio Figma, evitando a curva de aprendizado de novas ferramentas. Esse arquivo centralizado serviu como referência imediata para o time de desenvolvimento durante a implementação do redesign.
Organização de tokens utilizando as variáveis do Figma.
Qual foi o impacto?
Mesmo com o projeto ainda em andamento, os primeiros resultados do redesign do IngFAQ apareceram já no primeiro mês. As interfaces se tornaram mais consistentes e alinhadas à identidade da empresa, o que trouxe ganhos para diferentes frentes:
Para o design – ficou mais simples criar, replicar e evoluir recursos sem retrabalho.
Para os desenvolvedores – a implementação passou a acontecer de forma fluida, sem divergências em relação aos protótipos.
Para o suporte e os clientes – a navegação se tornou mais clara, facilitando o acesso às informações. O retorno foi tão positivo que alguns clientes solicitaram que as melhorias também fossem aplicadas em outras plataformas contratadas.