PTEN
← Todos os cases
UX/UI DesignArquitetura da informaçãoWeb responsivoProjeto real

FAPAM

Comunidade, informação e captação de alunos em uma única experiência digital.

Meu papel
UX/UI Designer: arquitetura da informação, fluxos, wireframes, UI, protótipo e handoff
Cliente
Faculdade de Pará de Minas
Plataforma
Web · desktop e mobile
Resultado
+40%de acessos ao site após o lançamento
Home · desktop
Home do novo site da FAPAM: banner do vestibular, agenda de eventos e modalidades de curso
02 — Desafio

De dois produtos digitais para uma única experiência

A FAPAM tinha um portal para alunos e uma landing page de matrículas, separados. O novo site precisava servir quem já estuda lá e quem ainda está decidindo.

Antes

Portal do aluno

Serviços · atividades · links

Antes

LP de matrículas

Captação de novos alunos

Depois

Um único site institucional

Informar, facilitar o acesso a serviços e atrair novos alunos.

Como informar, facilitar o acesso a serviços e, ao mesmo tempo, atrair novos alunos?

03 — Públicos

Quatro públicos, dois objetivos

Comunidade → experiência
  • AlunosServiços e acessos rápidos
  • PaisCursos e ambiente
  • DocentesInformação e recursos
Captação → conversão
  • Futuros alunosJovens escolhendo a profissão

Experiência: informação, pertencimento e serviços. Conversão: lead e matrícula.

04 — Benchmark e arquitetura

Organizar muito conteúdo sem perder o usuário

Benchmark com outras instituições: menus, categorias de curso, hierarquia e caminhos para a matrícula. O resultado virou a estrutura de navegação do site, com um menu de destaque para captação e um menu menor para a comunidade.

Organograma da estrutura de navegação da FAPAM: Website dividido em Portal do Professor, Portal do Aluno, Menu Menor (Serviços, FAPAM Social, Biblioteca, Sobre a FAPAM) e Menu Destaque (Como ingressar, Cursos, Pós-Graduação, Pesquisa e Extensão, Viva a FAPAM, Novidades)
Organograma da navegação: menu de destaque para quem está decidindo, menu menor para quem já faz parte.

Princípio de navegação

Entrar→Encontrar→Aprofundar→Voltar→Continuar
05 — O equilíbrio

Informação sem sobrecarga

Informar←→Converter
Institucional←→Comercial
Aluno atual←→Futuro aluno
Profundidade←→Facilidade

Resposta: hierarquia forte, padrões de interface, CTAs claros e menos decisões por etapa.

06 — Decisão: home de pertencimento

A home mostra o que acontece dentro da FAPAM

Em vez de mostrar só o que a faculdade oferece, a home abre com a campanha de marketing e logo traz a agenda e os eventos: feiras, aulas magnas e ações sociais.

  • 01Alunos. Participação e chance de se ver no conteúdo.
  • 02Futuros alunos. Sentem como é fazer parte da comunidade.
  • 03Pais. Veem a dinâmica e o ambiente da faculdade.
  • 04Docentes. Vitrine das iniciativas da instituição.
Página interna de evento: I Feira de Empreendedorismo Social de Pará de Minas
Página de evento: passe o mouse para rolar.
07 — Decisão: jornadas com identidade própria

Mesmo sistema, sensações diferentes

Graduação · tema claro

Amigável e acessível: uma transição fácil do ensino médio.

Página de cursos de graduação em tema claro

Pós-graduação · tema escuro

Mais escura e high-end, associada a tecnologia e especialização.

Página da pós-graduação em tema escuro, com cursos de especialização
08 — Da descoberta à matrícula

Uma jornada progressiva de decisão

Home→Conhecer a FAPAM→Explorar cursos→Escolher curso→Página do curso→Lead / matrícula

A página do curso como “segunda home”

É aqui que eu quero estudar? A página interna não só explica o curso: ela ajuda o futuro aluno a decidir, e termina numa ação clara.

  • 01Sobre o curso
  • 02Infraestrutura e laboratórios
  • 03Corpo docente
  • 04Diferenciais
  • 05Depoimentos de ex-alunos
  • 06CTA · Inscreva-se
Página do curso de Administração com sobre o curso, estrutura curricular, diferenciais, professores, depoimentos e CTA de matrícula
Página do curso de Administração: passe o mouse para ver a rolagem completa.
09 — Consistência

O usuário não reaprende a interface a cada página

Navegação

Adaptada a cada contexto, desktop e mobile.

CTAs

Sempre visíveis em todas as páginas.

Padrões

Os mesmos componentes em todo o site.

Componente de menu com o dropdown de Cursos aberto: Graduação, Pós-Graduação, Pesquisa e Extensão
Card de curso em versão clara
Card de curso em versão vinho
Card do vestibular
10 — UI

A mesma marca, mais leve no digital

A identidade já existia. O trabalho foi adaptá-la para a leitura de muito conteúdo: vermelho só como destaque e espaço em branco para respirar.

BrancoBase
CinzasSeções
TextoLeitura
VinhoMarca
LaranjaDestaque · CTA
11 — Resultado

A experiência virou número

+40%

de acessos ao site em relação à versão anterior.

Matrículas

Crescimento expressivo nas matrículas vindas do Google orgânico, com o site como uma das principais ferramentas de captação de alunos.

Depoimento em vídeo: o prof. Reinaldo Galvão, coordenador das pós-graduações da FAPAM, conta como o projeto nasceu e o impacto do novo site nos resultados da faculdade.

Assistir no Instagram ↗

Handoff acompanhado de perto com o time de desenvolvimento para preservar as decisões de UX e UI.

12 — Aprendizados

O que eu faria diferente

Adaptaria ainda mais a marca ao digital: menos gradiente vermelho, linguagem mais flat e paleta mais suave.

O que eu levo

Arquitetura→Navegação→Jornadas→Interface→Negócio

Pensar no produto inteiro, não em páginas isoladas.