Atenção: Esse artigo é para os administradores da plataforma. Caso você seja um aluno, favor entrar em contato diretamente com a instituição responsável pelo seu curso.


    Este documento contém as especificações técnicas do seu template. Mostraremos todas as seções explicando item a item sua funcionalidade e especificações.


  • HOME

    A home page é página principal da plataforma e é nela que os atrativos para seu negócio serão colocados.


    Header:


save image


    Banner:


save image


    Seção quem somos:


save image


    Seção promocional:


save image


    Seção cursos destacados:

 save image   

    Seção depoimentos:


save image


    Seção diferenciais:

save image

save image



    Rodapé:


save image



  • HEADER


save image


O header da plataforma é um menu de navegação que leva os usuários a diferentes páginas existentes.


  1. Logo

            Dimensões: até 400px largura x 65px altura.


  1. Menu de navegação

            Os botões que vêm por padrão são:

  • Home - Página principal da plataforma.

  • Cursos - Página pública de cursos, um catálogo com todos os cursos publicados na sua plataforma.

  • Atendimento - Formulário para enviar mensagem aos responsáveis pela plataforma.

  • Login/Cadastre-se - Áreas para o usuário realizar login ou se registrar.




  • BANNER


save image


    O objetivo do banner é atrair a atenção do cliente através de imagens e frases. O banner conta com um botão de conversão que encaminhará o aluno à um link desejado, por exemplo página de cadastro ou compra do curso.


  1. Imagem do banner

                Dimensões: 1550px largura x 500px altura.

                Recomendamos que a imagem do banner seja uma imagem chamativa que sirva apenas de fundo.

                Para adicionar informações ao seu banner é recomendado utilizar os elementos título, descrição e botão de conversão.

*Observação: informações importantes na sua imagem ficarão sobrepostas por outros elementos do banner, caso os use.


  1. Título

            Fonte: 48px

            30 a 40 caracteres.

            Sugerimos que o título seja curto para gerar rápido entendimento no usuário. Não é obrigatório utilizar um título em seu banner.

*Observação: Recomendamos que o título do banner tenha até 2 linhas, mais linhas comprometem o visual da home, ainda mais no caso das mobile pois as telas menores vão gerar ainda mais linhas. Títulos longos também deslocarão os outros elementos do banner.


  1. Descrição

Fonte: 20px

60 a 80 caracteres. 

Uma breve descrição do contexto do que trata o seu banner.

Recomendamos que a descrição não ultrapasse 2 linhas.

Não é obrigatório usar uma descrição no seu banner.

*Observação: Caso sua descrição seja muito longa os outros elementos do banner serão deslocados, prejudicando a visibilidade.


  1. Botão de conversão

Fonte: 14px

Até 20 caracteres. 


Este é um botão que vai direcionar o usuário para a página que estiver configurada. Caso queira saber como basta clicar aqui.

*Observação: Ultrapassar a quantidade recomendada de caracteres vai gerar um botão de conversão muito longo que não se adaptará corretamente nas versões mobile da plataforma.



  • SEÇÃO QUEM SOMOS

save image


    A seção ‘Quem Somos’ traz informações sobre o seu você ou seu negócio, é um texto de apresentação ao cliente. Esta seção é colocada por nós de acordo com o que foi preenchido em sua planilha dashboard que o seu implementador lhe entregará.


  1. Imagem

Dimensões: 618px largura x 503px altura.

Esta imagem é a imagem de destaque colocada nas informações do curso, na página de criação do curso.

*Observação: Utilizar uma imagem de dimensões diferentes vai alterar as proporções da seção.


  1. Título

Fonte: 45.5px

Até 90 caracteres, 4 linhas de título.

*Observação: Ultrapassar os limites de linhas e quantidade de caracteres fará com que a imagem e os textos da seção fiquem deslocados. O que deixará sua home visualmente desequilibrada.


  1. Subtítulo

Fonte: 18px

Até 95 caracteres, 4 linhas.

*Observação: Ultrapassar os limites de linhas e quantidade de caracteres fará com que a imagem e os textos da seção fiquem deslocados. O que deixará sua home visualmente desequilibrada.


  1. Texto

Fonte: 18px

Até 328 caracteres.

*Observação: Mesmas observações do título.


  • SEÇÃO PROMOCIONAL 1

save image


    A seção promocional mostra a seus alunos as vantagens em fazer os seus cursos. Os principais tópicos abordados e sua importância. Esta seção é composta por título, texto e conteúdo. Esta seção é colocada por nós de acordo com o que foi preenchido em sua planilha dashboard, que o seu implementador lhe entregará.


  1. Título

Fonte: 45.5px

Até 85 caracteres, 2 linhas.

*Observação: Ultrapassar os limites de linhas e quantidade de caracteres aumentará a altura da seção.


  1. Texto

Fonte: 24px

Até 145 caracteres.

*Observação: Ultrapassar os limites de linhas e quantidade de caracteres aumentará a altura da seção.



  • CURSOS DESTACADOS


save image


    Os cursos que forem configurados como publicados e destacados serão automaticamente colocados dentro de um card, estes cards são organizados dentro da seção cursos e colocados em uma grade.


  1. Card do curso

save image



    O card do curso também é gerado automaticamente a partir das informações que forem colocadas na página de criação de cursos.

  1. Imagem do card

Dimensões: retangular, 400px largura x 276px altura.

Esta imagem é a imagem de destaque colocada nas informações do curso, na página de criação do curso.

*Observação: Utilizar uma imagem de dimensões diferentes vai alterar a altura e proporção do card.


  1. Título

Fonte: 23 px

Até 25 caracteres, 1 linha.

*Observação: Utilizar mais caracteres e linhas do que o indicado irá alterar a altura do card.


  1. Descrição

Fonte: 18.5 px

A descrição do curso no card virá da descrição feita na página de criação dos cursos, o card automaticamente usará uma quantidade limitada de caracteres.


  1. Preço

O preço do curso também é definido a partir da página de criação de cursos. Caso o curso esteja configurado como grátis, no lugar do preço a mensagem ‘Grátis’ será exibida.

O preço mostrado cortado é o preço original do curso,  o preço inteiro é o preço que que será pago na compra do curso.


  1. Botão ‘Ver mais’

Este botão levará o aluno a página específica do curso.



  • SEÇÃO DEPOIMENTOS


save image

    A seção depoimentos contém os feedbacks que os seus alunos passaram dos seus cursos. Para preencher esta seção é necessário nos enviar os materiais solicitados na planilha chamada dashboard, que seu implementador lhe entregará. Os depoimentos são compostos por foto, nome, cargo e texto.


  • SEÇÃO DIFERENCIAIS

save image


A seção diferenciais  são argumentos para gerar interesse no visitante. É composta por título, texto e imagem.


  1. Imagem

Dimensões: 618px largura x 503px altura.

*Observação: Utilizar uma imagem de dimensões diferentes vai a lterar as proporções da seção.


  1. Título

Fonte: 45.5px

Até 44 caracteres, 2 linhas.

*Observação: Ultrapassar os limites de linhas e quantidade de caracteres aumentará a altura da seção.


  1. Texto

Fonte: 18px

Até  315 caracteres.

*Observação: Ultrapassar os limites de linhas e quantidade de caracteres aumentará a altura da seção.


  • RODAPÉ

save image


    O rodapé traz informações importantes de contato. Telefone, e-mail, endereço e redes sociais. O rodapé é preenchido pela nossa equipe de acordo com o que for informado pela planilha dashboard.


  1. Logo

Dimensões: altura até 150px.

*Observação: A logo do rodapé pode ser um pouco maior do que a usada no header, entretanto não é recomendado utilizar um valor de altura acima de 150px, isso aumentaria a altura total do rodapé causando desequilíbrio no visual das páginas.



  • PÁGINA DE CURSOS


save image


  1.  HEADER


  1.  BUSCA

            É a campo para buscar cursos por nome e/ou palavras-chave.


  1.  CATEGORIAS

Links das categorias criadas, elas aparecerão nesta seção desde que exista pelo menos um curso com essa categoria.


  1.  LISTA DE CURSOS

Nesta seção todos os cursos criados e que estejam publicados irão aparecer. 




  • PÁGINA PÚBLICA DO CURSO (LANDING PAGE DO CURSO)


save image


    Esta é a página específica do curso, o aluno é direcionado a ela ao clicar em no curso em que tem interesse. Esta página contempla descrições detalhadas do conteúdo do curso.


  1.  HEADER

        2. BANNER

            O banner do curso é gerado com a imagem definida nas imagens do curso.

            2.1 Imagem do banner do curso

Dimensões: 1920px largura x 560px altura.

Recomendamos que a imagem do banner seja uma imagem chamativa que sirva apenas de fundo.

Para adicionar informações ao seu banner é recomendado utilizar os elementos título, descrição e botão de conversão.

*Observação: informações importantes na sua imagem ficarão sobrepostas por outros elementos do banner, caso os use.


            2.2 Título do banner do curso

Fonte: 34px

Até 40 caracteres

O título do banner do curso é o nome do curso, e é o mesmo título que é usado no card do curso (ver 1.5.1).

*Observação: Como este título é o nome do curso e também o título do card do curso recomendamos que sejam utilizadas as especificações deste documento para não desconfigurar os outros elementos.


            2.3 Botão do banner do curso

                O botão do banner do curso é gerado automaticamente. O texto dele mudará dependendo do valor do curso e caso ele seja gratuito.


        3. RODAPÉ

         


  • PÁGINA DE ATENDIMENTO


save image


  1.  HEADER

       

  1. BANNER DA PÁGINA DE ATENDIMENTO

            Este banner é apenas uma imagem de fundo para a página.

Dimensões: 1700px largura x 250px altura.

Recomendamos que a imagem do banner seja uma imagem chamativa que sirva apenas de fundo.


  1. FORMULÁRIO

            O formulário contém campos que permitem que visitantes ou alunos entrem em contato com os administradores da plataforma.



  • PÁGINA DE LOGIN/CADASTRO

    Esta página contém duas abas, uma aba é para já cadastrados possam realizar login na plataforma. Já a página de cadastro é a página onde os usuários preenchem um formulário para criar um perfil.



save image


save image


     Caso ainda tenha ficado alguma dúvida, entre em contato com a nossa equipe de atendimento através do suporte@eadbox.com