Disponível para

UX Design · Branding · Front-end

Contato

contato@felipeleite.design

Social

Novo portal Fapto
08 / 09

Novo portal Fapto.

Novo portal Fundação de Apoio Científico do Tocantins

Tipo

UI Design · HTML · CSS · Figma

Ano

2026

Entrega

O Novo Portal foi idealizado para facilitar o acesso a informações e serviços oferecidos, a proposta era criar um layout mais intuitiva, acessível, responsivo e eficiente.

Novo portal Fapto
fapto — cover

Briefing/Overview

Desafio: A FAPTO necessitava de um novo portal que oferecesse uma experiência de navegação mais eficiente, facilitando o acesso às informações sobre editais, projetos e serviços de apoio à ciência e tecnologia no Tocantins.

Proposta de Solução: Redesenhar o portal com foco em usabilidade, acessibilidade e experiência do usuário, otimizando a busca por informações relevantes e criando uma estrutura clara e intuitiva para diferentes públicos, incluindo pesquisadores, empresas e a comunidade em geral.

Fui convidado a participar do projeto com o mesmo já em andamento, foram relatadas dificuldades para modernizar o layout e deixar o fluxo mais leve e o layout responsivo.

Meu Papel no Projeto

Atuei como UX/UI Designer e Frontend, sendo responsável por:

  • Pesquisa e análise de dados sobre o portal.

  • Redesenho da arquitetura da informação, reorganizando o conteúdo para facilitar a navegação.

  • Criação de wireframes e protótipos interativos, validando as soluções com os stakeholders.

  • Design da nova interface do usuário, garantindo que fosse acessível, intuitiva e compatível com dispositivos móveis.

  • Codificação do layout, tecnologias utilizadas - HTML, CSS, Sass, JavaScript.

Pesquisas e Insights

Principais descobertas:

  • Navegação complexa, muitos itens gerando dificuldades em encontrar informações importantes.

  • Layout não responsivo, dificultando o uso do portal em dispositivos móveis.

  • Conteúdo disperso, sem uma hierarquia clara de informações.

Esses insights foram fundamentais para nortear o redesenho e a reestruturação do conteúdo, com foco na experiência do usuário.

Processo de Design

Arquitetura da Informação

Após o levantamento dos problemas, o primeiro passo foi a reorganização do layout:

  • Criação de um menu simplificado e categorizado por tipos de usuário (pesquisadores, empresas, comunidade).

  • Integração com o sistema de gestão de conteúdos já existente, facilitando o acesso direto a editais, resultados e serviços da FAPTO.

  • Hierarquia visual clara, com foco nas informações mais procuradas pelos usuários.

Wireframes e Prototipagem

Desenvolvi wireframes de média fidelidade, validando as interações com os usuários e stakeholders em várias iterações. Isso garantiu que o portal fosse funcional e fácil de navegar, conforme alguns testes de usabilidade. A partir daí foram criados wireframes de alta fidelidade e posteriormente o layout em HTML, CSS e JavaScript.

Design de Interface

A identidade visual foi completamente renovada, com um layout moderno e minimalista, utilizando a paleta de cores institucional da FAPTO para transmitir confiança e seriedade.

  • Layout responsivo foi uma prioridade, garantindo uma boa experiência tanto em desktops quanto em dispositivos móveis.

  • Utilizei ferramentas como Figma para prototipação e design das interfaces.

Desenvolvimento e Testes

Após o design da interface, colaborei com a equipe de desenvolvimento para garantir que as interfaces fossem implementadas de acordo com as especificações, e conduzi testes de usabilidade com usuários reais:

  • Testes de navegação, onde observamos como os usuários interagiam com a nova estrutura do site.

  • Ajustes de acessibilidade, incluindo revisão de contraste, tipografia e design responsivo para assegurar conformidade com as diretrizes de acessibilidade (WCAG).

Resultados

Melhoria no processo de navegação por informações-chave, melhorando a experiência dos usuários que buscavam serviços e informações sobre financiamento de projetos.

Portal totalmente responsivo, adaptado para diferentes dispositivos, ampliando o acesso a um público mais diversificado.

Aprendizados

A importância da pesquisa de usuários para identificar problemas ocultos na usabilidade, que só são perceptíveis após uma análise mais profunda.

Como o design responsivo é essencial para garantir a acessibilidade e usabilidade de qualquer site, especialmente em portais governamentais.

A colaboração com stakeholders foi crucial para alinhar a proposta de design às necessidades institucionais e garantir que o projeto estivesse de acordo com os objetivos da FAPTO.

Próximos Passos

Com o lançamento do portal, a equipe da Fapto deve implementar ferramentas de análise de comportamento do usuário, como Google Analytics, para monitorar continuamente o uso do site e promover melhorias futuras com base nos dados coletados.

Galeria de Imagens e Protótipos

file cover - 1.webp

cores-01.pnghome.pngcores-02.png

card-chip.png

components.png

botoes.png

wireframe-v1.png

figmaexample.png

figma-preview.png

home.png

Próximo projeto

Mais um Dia - App