Voltar ao site

3. Biblioteca de Elementos

Passo 1: Ativação da Barra de Elementos

No editor de projeto, clique no botão Adicionar um elemento ou no ícone de + dentro de um grid para ativar e exibir a barra lateral esquerda completa contendo todos os blocos disponíveis.

Passo 2: Explorando os Elementos

- Básico (14 recursos)

  • Texto: Bloco base para escrita, inserção e formatação rica de parágrafos do curso.
  • Imagem: Permite subir imagens locais via upload ou incorporar imagens a partir de links externos.
  • Vídeo: Adiciona vídeos ao projeto; suporta links do YouTube e Vimeo.
  • H5P / Genially: Facilita a incorporação otimizada de pacotes dinâmicos e games de terceiros via iframe.
  • Botão: Gera botões clicáveis de call to action e redirecionamento rápido de navegação.
  • Paginação: Controles posicionados na base para guiar o avanço linear entre as páginas da aula.
  • Lista Ícones: Formata enumerações acompanhado por um vasto banco de ícones no lugar dos marcadores convencionais.
  • Abas: Distribui o aprendizado e conteúdos extensos separados em divisões horizontais navegáveis (tabs).
  • Accordion: Esconde informações volumosas dentro de abas sanfonadas (retraídas) para poupar espaço vertical na leitura.
  • Linha: Traz uma barra contínua divisória indicando a transição exata entre as pautas da aula.
  • Aviso: Caixa proeminente pré-estilizada, fundamental para alertas e fixar a atenção das mensagens institucionais para o aluno.
  • Cabeçalho: Componente ideal para de títulos grandes ("Heading" escalável de H1 a H6).
  • Post-it: Emula visualmente pequenos papéis adesivos coloridos para trazer notas rápidas à atenção.
  • Espaçador: Elemento invisível; adiciona "vazios" dimensionáveis para criar os respiros obrigatórios e alinhar a estética do design no projeto.

- Expert (9 recursos)

  • Título: Elemento flexível exclusivo para configuração mais avançada e descolada da tipografia formadora de títulos. Trabalha em conjuto com o elemento "Menu do cabeçalho" para criar ancoragem do menu com textos ou páginas
  • ImagemAdiciona vídeos ao projeto a partir da plataforma PandaVideo. Essencial para que funcione os marcadores de progresso.
  • Card Estilizado: Bloco predefinido que formata e emoldura magicamente uma imagem atrelada a uma pequena descrição e botão em um quadro moderno.
  • Modal: Engatilha a abertura brusca de um "pop-up" suspenso escurecendo a tela central perante o clique no disparador (como se fosse uma tela extra que surge do topo).
  • Carrossel: Estrutura multi-elemento contendo diversas caixas ou imagens, ideal para rolar horizontalmente com efeito deslizante.
  • Image Card: Foca visualmente na estética de uma imagem imponente engolfando pequeno componente de título/legenda.
  • Citação: Idealizado para separar belamente frases memoráveis de outros autores ou pensadores aspeadas (elemento de "Quote").
  • Linha do Tempo: Desempenha descrições de eventos que são fracionados progressivamente sob a união de bolinhas atreladas via uma linha formadora do percurso/roteiro de passo a passo.
  • Tabela Responsiva: Trata o texto em formato tabela (linhas vs colunas) se ajusta à largura das telas menores dos smartphones, evitando estourar as larguras de página.

- Premium (12 recursos)

  • Template HTML: Área de de HTML simples, facilita a criação de elementos estilizados
  • Social Card: Possibilidade de criar blocos simpáticos pré-formatados, como exemplo de uso crie atalhos nos grupos oficiais do autor/professsor nas redes sociais.
  • Abrir atividade Moodle: Adicionar uma atividade criada no curso dentro do layout Geppetto, o objetivo é facilitar a navegação do aluno que poderáa acessar as atividades sem abandonar a tela do conteúdo.
  • Checkpoint: Insere pontos de checagem em seu conteúdo ou vídeo, funciona de maneira condicional restritivo pedagógico forçando os alunos a interagirem com o conteúdo para marcar como concluído.
  • Barra de Progresso (Header): Trabalha em conjunto com o elemento Checkpoint mostra visualmente para o aluno em que posição do conteúdo atualmente está em tempo real, ditando o ritmo medido como barra preenchida que aumenta rumo ao 100%.
  • Menu do cabeçalho: Crie menus interativos com o conteúdo, paginas ou links externos.
  • Comentários: Traz a interatividade vital para a sua tela; insira o chat abaixo de qualquer conteúdo para os alunos interagirem entre eles ou com o professor atraves de diálogos identados.
  • Bloco de anotações: Interface dedicada ao aluno e professor para fazer anotações durante o seu percuso no ambiente, excelente ferramente para consulta posterior sobre alguma anotação relevante
  • Galeria de imagens: Exibe imagens em modo visual mosaicos ou alinhados.
  • Gráficos: Dispara leitores nativos de estatísticas transformando fatias, picos cronológicos de linhas, contagens verticais e blocos (os estilos Pizza, Linha e Barra) em visuais dinâmicos.
  • Fluxograma:Traça conectores orientados logicamente para apresentar visualmente modelos organizacionais, esquemas de subordinação ou trilhas conceituais diretas de fácil digestão para explicar teorias aos usuários.
  • Pagamento Asaas: Checkout acoplável de apenas um clique. De ao aluno opções de compras como: Ver conteúdos mediante pagamento, emitir certificado, Doações, entre outras possibilidades

Nesta página: