Release Notes 4.0.0

Novo layout das telas dos usuários

 A plataforma passou por uma renovação visual nas telas dos usuários, com uma navegação mais moderna, organizada e responsiva. A seguir, são apresentadas as mudanças em cada uma das telas.

Meu Perfil

Na área Meu Perfil, a barra lateral esquerda foi reorganizada e passou a exibir suas informações em cards separados. A principal novidade é o novo card Desempenho geral, que apresenta o percentual do usuário calculado com base no total de módulos concluídos dividido pelo total de módulos vinculados, comparado à meta definida, indicando de forma clara se ele está acima ou abaixo do desempenho esperado. A Meta de 85% é um campo fixo.

O Blog, que antes ficava ao final da tela, passa a ser acessado como uma aba no menu superior, junto às demais. Nas abas Ambientes, Trilhas e Módulos, passa a existir a seção Continuar de onde parou, que retoma o último ambiente, trilha ou módulo acessado, e a possibilidade de marcar ambientes, trilhas e módulos como Favoritos, reunidos em uma seção própria. Essas duas opções vêm desabilitadas por padrão e podem ser ativadas em Configurações > aba Geral, na seção Meu Perfil. Nessas três abas também é possível alternar o tipo de visualização entre Cards e Lista — sendo Cards o padrão —, além do botão Filtrar para refinar a listagem.

Configurações > aba Geral: opções; Exibir continuar de onde parou e Exibir favoritos, que habilitam as seções na área Meu Perfil.

Aba Ambientes:

Aba Trilhas:

Aba Módulos:

Aba Histórico:

Aba Notificações:

Aba Blog:

Ambiente

Ao entrar em um ambiente, a tela passou por uma renovação visual. No topo, passa a existir uma seção dedicada ao Ambiente, que reúne o banner, a carga horária restante, o total de trilhas, o contador de módulos (por exemplo, 0/5), o progresso de conclusão e o botão Continuar. O botão Continuar leva o usuário ao último módulo acessado que esteja em andamento ou, caso não haja, ao próximo módulo em aberto.

A antiga capa da trilha passa a se chamar Banner e agora permite incluir mais de uma imagem, cada uma com o seu próprio link.

Os cards dos módulos foram reformulados e passam a exibir a capa, as tags, o nome do módulo, a barra de progresso, a data, o status e o botão de ação. As tags têm origem em um novo campo Tags, disponível no cadastro do módulo. A data é dinâmica e exibe:

• Disponível a partir de: quando o módulo ainda não foi liberado.
• Expira em: quando está em aberto.
• Finalizado em: quando concluído.

O botão de ação também é dinâmico: não aparece enquanto o módulo não está liberado.  Exibe:

• Iniciar: quando liberado e ainda não iniciado.
• Continuar: quando já iniciado e não concluído.
• Rever quando finalizado.

 Cada trilha passa a contar ainda com o botão Filtrar, com as mesmas opções de filtro disponíveis em Meu Perfil > aba Módulos.

Tela do ambiente, com a nova seção do ambiente (banner, informações e botão Continuar) e os cards de módulo reformulados:

Tela do ambiente com o menu lateral recolhido:

A configuração desses elementos fica na área administrativa: o Banner é definido em Editar trilha > aba Aparência, onde é possível adicionar uma ou mais imagens, cada uma com um link opcional, e a dimensão recomendada do banner passou a ser 994x280, as imagens configuradas são rotativas e mudam a cada 5 segundos. Já a capa e as tags do módulo são configuradas em Editar Módulo > aba Geral.

Configuração do banner na aba Aparência da trilha:

Configuração da capa e das tags na aba Geral do módulo:

Os menus internos do ambiente também acompanharam o novo layout. As mudanças foram principalmente visuais (CSS), mantendo o funcionamento; as telas de configuração do Avatar e da Loja de Itens também passaram por mudanças mais:

Ranking do ambiente:

Editar avatar:

Loja de Itens:

Canal direto:

Tipos de trilha

Além da trilha do tipo Galeria, os demais tipos de trilha também foram repaginados: Lista de tópicos, Ícones e Personalizada. A trilha Personalizada passou a ser responsiva, com o posicionamento dos botões adaptável à largura da tela.

Trilha do tipo Lista de tópicos:

Trilha do tipo Ícones:

Trilha do tipo Personalizada:

Trilha do tipo Personalizada em tela reduzida, demonstrando a responsividade:

Player de atividades

O player de atividades passou por uma mudança visual expressiva. A barra superior foi reorganizada e passa a exibir o botão Sair, o nome da trilha e a indicação da tentativa; é também nessa barra que o botão de Ver certificado aparece quando ele estiver disponível. O nome da trilha exibido pode variar quando o módulo é do tipo módulo-link.

O menu lateral pode ser recolhido ou expandido e reúne o contador de módulos, o nome do módulo, os pontos conquistados, o contador de atividades, o nome, o tipo e a carga horária da atividade, além do próximo módulo. O botão de Próximo módulo só fica ativo após a conclusão de todas as atividades do módulo atual.

Ao chegar na última atividade, o botão de avançar passa a ser Concluir o módulo. A seção de comentários passa a ficar abaixo da área de conteúdo, ocupando toda a largura do frame principal.

Player de atividades, com a barra superior e o menu lateral com as informações do módulo e da atividade:

Player de atividades em uma atividade do tipo formulário:

Player de atividades com o menu lateral recolhido:

Novo tema do ambiente

Acompanhando o novo layout, um novo tema passa a estar disponível na lista de temas do ambiente (em Editar ambiente > aba Aparência > Tema do Ambiente), identificado como New Engage. As cores desse tema também podem ser escolhidas como as cores padrão da plataforma, em Configurações > Aparência > Gerenciar cores. As cores definidas nessa tela influenciam diretamente a aparência da tela Meu Perfil.

Novo tema New Engage disponível na lista de temas do ambiente:

Cores do tema New Engage disponíveis em Gerenciar cores, nas configurações da plataforma:

Versões mobile (Android e iOS)

As alterações do novo layout foram aplicadas às versões mobile, tanto no Android quanto no iOS, mantendo a mesma renovação visual e a consistência com a versão web.

Meu Perfil no mobile:

Aba Ambientes no mobile:

Tela do ambiente no mobile:

Player de atividades no mobile: