Navegação por Componentes / Disciplinas¶
A seção de Navegação por Componentes / Disciplinas é o coração do Educa.ai para explorar o vasto universo de conteúdos didáticos. Ela foi desenvolvida para que você encontre facilmente materiais organizados por áreas do conhecimento, tornando a busca por recursos educacionais mais eficiente e intuitiva.
1. Tela Inicial - Seleção de Disciplinas¶
A navegação começa na tela inicial com a barra "Navegar Por Componente", que apresenta os principais componentes curriculares com ícones 3D distintivos:

- Matemática - Calculadora azul com botões amarelos e vermelhos
- Ciências - Microscópio prata e preto
- Português - Quadro com "ABC" em giz colorido
- História - Coliseu dourado estilizado
- Geografia - Globo azul e verde em base prata
- Artes - Paleta de madeira com tintas coloridas e pincel
- Educação Física - Troféu dourado
- Inglês - Livro azul aberto com letra "A" e caractere chinês
Cada componente é apresentado em um botão circular com design 3D, facilitando a identificação visual e a navegação intuitiva. A barra permite navegação horizontal - você pode arrastar ou deslizar horizontalmente para visualizar todas as disciplinas disponíveis. O fundo apresenta um gradiente suave azul claro com elementos decorativos.
2. Página da Disciplina - Seleção de Temas¶
Ao clicar em uma disciplina (exemplo: Matemática), você será direcionado para uma página específica que apresenta os temas disponíveis dentro daquela área do conhecimento:

A página apresenta:
Header e Navegação¶
- Logo Educa.ai no canto superior esquerdo
- Informações contextuais: Localização e data (ex: "Bebedouro, terça-feira, 14 de outubro de 2025")
- Menu do usuário: Perfil do professor com dropdown
- Ícones de navegação: Busca, menu, home e voltar
Barra de Navegação da Disciplina¶
- Caminho de navegação: Seta de voltar + nome da disciplina (ex: "Matemática")
- Instrução: "Escolha um tema para explorar"
Grid de Temas¶
A página apresenta um grid 2x3 com 6 cards principais:
- Todos - "Ver todas as habilidades" (acesso completo)
- Geometria - "Explorar Geometria"
- Grandezas e medidas - "Explorar Grandezas e medidas"
- Números - "Explorar Números"
- Probabilidade e estatística - "Explorar Probabilidade e estatística"
- Álgebra - "Explorar Álgebra"
Cada card apresenta um ícone de calculadora 3D azul e um fundo com paisagem educativa (árvores verdes e céu azul).
3. Lista de Habilidades Específicas¶
Ao clicar em "Todos" ou em um tema específico, você acessa a lista detalhada de habilidades da disciplina:

Esta tela apresenta:
Header e Caminho de Navegação¶
- Caminho completo: "Início > Matemática (15 / 247 habilidades)"
- Contador de habilidades: Mostra quantas habilidades estão sendo exibidas do total disponível
- Botões de ação: "Favoritos" (coração) e "Filtros" (funil)
Cards de Habilidades¶
Cada habilidade é apresentada em um card detalhado contendo:
- Código BNCC: Identificador único (ex: EF08MA01, EF08MA02)
- Ícones de ação: Coração (favoritar) e play (iniciar/visualizar)
- Tema: Área específica (ex: "Números")
- Descrição completa: Explicação detalhada da habilidade
- Objetos de Conhecimento: Tópicos específicos abordados
Exemplos de Habilidades Visíveis¶
- EF08MA01: Cálculos com potências de expoentes inteiros e notação científica
- EF08MA02: Relação entre potenciação e radiciação
- EF08MA03, EF08MA04, EF08MA05: Habilidades adicionais (parcialmente visíveis)
Fluxo Completo de Navegação¶
O fluxo de uso segue uma hierarquia clara de três níveis:
- Seleção da Disciplina (Tela Inicial)
- Escolha a área do conhecimento na barra "Navegar Por Componente"
-
Clique no ícone da disciplina desejada
-
Seleção do Tema (Página da Disciplina)
- Visualize os temas disponíveis na disciplina
-
Escolha entre "Todos" ou um tema específico
-
Exploração das Habilidades (Lista Detalhada)
- Acesse a lista completa de habilidades
- Utilize filtros e favoritos para organizar o conteúdo
- Selecione habilidades específicas para explorar recursos
Recursos Adicionais¶
- Sistema de Favoritos: Marque habilidades importantes para acesso rápido
- Filtros Avançados: Organize o conteúdo por critérios específicos
- Navegação Intuitiva: Caminhos de navegação e botões de voltar em cada nível
- Design Responsivo: Interface adaptada para diferentes dispositivos