Este artigo ensina, passo a passo, como personalizar a identidade visual da sua universidade corporativa no módulo Educação (menu lateral, cores, banner, tipografia e logotipo). Utilize os espaços de imagem para inserir os prints conforme a numeração fornecida.
O que a Customização faz? Centraliza ajustes de aparência e navegação (itens do menu, cores, logo, fonte e layout do banner). As mudanças afetam todos os usuários da universidade.
1. Onde acessar
- No menu Gestão → Configurações, abra a aba Customização.
- Você verá as seções: Menu de Navegação, Preview do Banner de Boas-Vindas, Informações Gerais, Cores e Estilo, Logo e Tipografia e Layout.
Acesso à aba Customização.
2. Menu de Navegação (itens visíveis)
Em Configuração do Menu Lateral, defina o que aparece para os usuários na barra lateral.
- Itens fixos: Início e Gestão sempre permanecem visíveis.
- Itens opcionais: Comunidade, Cursos, Trilhas, Conquistas e Diário podem ser ligados/desligados individualmente (switch à direita).
- Descrições: cada item apresenta um texto curto explicando sua função (ex.: “Catálogo de cursos disponíveis”).
Alternância de visibilidade dos itens do menu.
⚠️ Atenção: Ao desativar um item, ele deixa de aparecer para todos os usuários (exceto administradores com rotas diretas). Revise impactos em trilhas e comunicações internas.
3. Preview do Banner de Boas-Vindas
Mostra, em tempo real, como o cabeçalho de entrada será exibido aos usuários.
- Componentes: saudação, nome da universidade, slogan, texto de boas-vindas e indicadores (status/última atividade).
- Dependências visuais: reage às seções Cores e Estilo, Logo e Tipografia e Layout.
- Objetivo: validar contraste, legibilidade e tom da mensagem antes de publicar.
Pré-visualização do banner com cores e estilo aplicados.
ℹ️ Informação: Textos longos podem quebrar o layout em telas pequenas. Prefira mensagens curtas e diretas.
4. Informações Gerais (textos institucionais)
Edite os textos exibidos no banner e em áreas de cabeçalho.
- Nome da Universidade: rótulo institucional principal (exibido com destaque).
- Slogan: frase curta de posicionamento (ex.: “Transformando conhecimento em crescimento”).
- Texto de Boas-vindas: mensagem de recepção ao usuário.
Campos de Nome, Slogan e Boas-vindas.
💡 Dica: Mantenha o slogan com até ~60 caracteres para preservar legibilidade em celulares.
5. Cores e Estilo (tema visual)
Personalize a paleta principal da plataforma.
- Cores predefinidas: Azul, Verde, Roxo, Laranja, Rosa e Vermelho.
- Cor Primária: aplicada a botões e elementos de destaque.
- Cor Secundária: aplicada a elementos de apoio (chips, ícones, fundos).
Seleção de paleta e campos de cor primária/secundária.
⚠️ Atenção: Evite combinar tons muito próximos (ex.: azul #0062ff com roxo escuro) para não perder legibilidade.
6. Logo (identidade visual)
Envie o logotipo oficial da instituição.
- Upload: clique em Selecionar Arquivo e envie imagem PNG (preferencialmente com fundo transparente) ou SVG.
- Pré-visualização: a miniatura aparece imediatamente após o upload.
- Troca/remoção: use o X para remover e enviar outra versão.
Upload e pré-visualização do logotipo.
💡 Dica: Utilize versão horizontal do logo e com boa margem de respiro para evitar cortes no banner.
7. Tipografia e Layout (estilo do banner)
Defina a fonte e o estilo visual do cabeçalho.
- Família da Fonte: Inter (Padrão) — moderna e legível.
- Estilo do Banner:
- Moderno: elementos flutuantes e visual contemporâneo.
- Clássico: aparência tradicional e elegante.
- Minimalista: design clean e simplificado.
Opções de tipografia e estilos do banner.
💡 Dica: Marcas jovens/tech combinam com o estilo Moderno. Para ambientes institucionais, prefira Clássico ou Minimalista.
8. Salvar e publicar
- Revise o Preview do Banner (contraste, legibilidade e cortes de logo).
- Clique em Salvar Configurações para aplicar as mudanças globalmente.
Confirmação das alterações visuais.
⚠️ Importante: As alterações impactam todos os usuários vinculados à universidade. Programe mudanças visuais para janelas de baixa utilização.
9. Fluxo recomendado
- Defina itens do menu (mostrar apenas o necessário).
- Configure Informações Gerais (nome, slogan, boas-vindas).
- Aplique cores (primária/secundária) e envie o logo.
- Escolha Tipografia e Layout do banner e valide no Preview.
- Salve e comunique a mudança aos alunos.
10. Solução de problemas (rápido)
- Logo distorcido/cortado: use PNG com fundo transparente e margem; prefira proporção horizontal.
- Texto estourando no banner: encurte o Texto de Boas-vindas e o Slogan.
- Cores pouco legíveis: ajuste a Cor Secundária para aumentar o contraste com o fundo do banner.
- Itens do menu sumiram: confirme se o switch do item está ativo e se o perfil do usuário possui permissão.