Justaposição de Imagem


Um tipo de conteúdo de imagem que permite aos usuários comparar duas imagens interativamente.

Você pode escolher entre um controle deslizante horizontal e um controle deslizante vertical, definir sua posição inicial e, opcionalmente, rotular suas imagens.

Vale salientar que, caso o treinando esteja acessando a Plataforma LMS NEXT por um dispositivo móvel através do sistema Android ou iOS, precisa desativar a opção de "Janela pop-up" do navegador do dispositivo para visualizar algumas das atividades de um Treinamento e/ou Curso para o treinando. Pois, como configuração padrão do navegador Safari, vem bloqueado janelas de Pop-up, assim impedindo as atividades (funcionalidades) que envolvam o H5P de serem executadas ou até mesmo alguns SCORM. Portanto recomendamos o desbloqueio das janelas de Pop-up dos navegadores.

Veja como fazer esse processo nesses links: Safari | Chrome | Edge | Firefox


Para realizar a criação da atividade, siga os passos abaixo:

Passo 1. Escolha o treinamento que irá abrigar a atividade e, na tela do curso referente, clique na parte superior direita, na opção "Modo edição" ativar a edição do curso: 


Passo 2. Logo após, com a edição ativada, com o tópico escolhido que irá alocar a atividade, clique em “Adicionar uma atividade ou recurso” e selecione a atividade "H5P":



Passo 3. Você será redirecionado à página de configuração e criação. Selecione a opção "Novo conteúdo" e escolha "Justaposição de imagem" na lista de tipos de conteúdo:


Passo 4. Em “Título”, defina um título para a sua tarefa, já em “cabeçalho”, insira o título que você gostaria de mostrar antes da imagem:


Passo 5. Insira a imagem requisitada e, log abaixo, no campo “Texto alternativo”, insira uma breve descrição que será exibida caso o navegador não seja capaz de exibir a imagem. Em “Texto flutuante” e “Rótulo para a primeira imagem”, são considerados também opcionais:


Passo 5.1. Siga as mesmas recomendações para a foto posterior:


Passo 6. Configurações comportamentais:

Posição inicial do controle deslizante em %: Define a posição inicial do controle deslizante (ex.: irá mostrar 30% da imagem posterior).
Orientação do controle deslizante: 
Horizontal irá mover para a esquerda e direita, vertical irá mover para cima e para baixo.
Cor do controle deslizante: 
Você também poderá customizar a cor do seu controle deslizante.


Passo 7. Sobreposição de texto e traduções - Aqui você pode editar configurações ou traduzir textos usados neste conteúdo:


Ficará desta forma a atividade de justaposição de imagem:


Indicamos que utilize sites gratuitos disponíveis na internet para tratar suas imagens na questão de qualidade de criação, tamanho da imagem e espaço utilizado (kb ou Mb) antes de subir elas na plataforma LMS Next.

Dessa forma, irá garantir uma qualidade maior e eficiência ao carregar a imagem, trazendo uma melhor experiência para o treinando, segue algumas sugestões abaixo:

https://www.adobe.com/br/express/feature/image/resize

https://tinypng.com/

https://www.canva.com/pt_br/

https://www.nuvemshop.com.br/ferramentas/redimensionar-imagem


Atualizado em 16/05/2025