7 Dicas para um bom Design de Elearning responsivo


Como criar materiais de aprendizagem para dispositivos móveis? Este artigo irá analisar a criação de cursos de eLearning responsivos que podem ser vistos em computadores e / ou dispositivos móveis de forma efetiva pelos alunos. Também  trará  algumas questões-chaves para reflexão.

Design de eLearning Responsivo: Criando um excelente  aprendizado para dispositivos móveis

Atualmente, todo material didático deve ser visualizado em dispositivos móveis – a menos que exista alguma razão corporativa ou tecnológica específica, que explique o por que não. Em 2016, os dispositivos móveis ultrapassaram desktops e laptops para navegação na web e essa tendência só continuará à medida que a velocidade de leitura de dados aumente e os dispositivos melhorem. Muitas pessoas, especialmente os jovens, já não possuem ou usam o que poderíamos chamar de computadores “tradicionais” e em vez disso, usam apenas dispositivos móveis – tablets ou smartphones – para acessar a internet.

Como as pessoas possuem estilos de vida cada vez mais ocupados e dinâmicos, não é mais sustentável que os material didáticos do curso só sejam acessíveis em um computador “estático”,  tradicional. Os alunos precisarão de recursos educacionais que possam ser acessados a qualquer momento em que tiverem um tempo livre em qualquer lugar que estejam.

ELearning Responsivo, Mobile Learning

Inicialmente vamos definir alguns termos. Recursos responsivos são projetados para se comportar no contexto dos dispositivos desktop e móveis. Há apenas uma versão do projeto necessário, que é processado corretamente, dependendo do dispositivo pelo qual o usuário o está visualizando.

No entanto, criar um material didático responsivo envolve um novo conjunto de considerações e complicações. Este artigo irá olhar para alguns destes relacionando-os à criação de eLearning e Mobile Learning responsivo. Ferramentas mais antigas, como Flash, são um grande problema no que diz respeito ao desenvolvimento móvel.

Por que não um aplicativo?

Você poderia livremente criar um aplicativo de aprendizagem em vez de criar seu recurso educacional baseado em HTML5 responsivo. Muitas empresas fazem isso para o treinamento de seus funcionários e existem razões válidas para que os apps sejam uma boa ideia em alguns cenários de treinamento, como quando você tem controle sobre a escolha do dispositivo dos educandos ou requer a funcionalidade especializada sob medida.

No entanto, se você percorrer a rota do aplicativo para o público em geral, você precisará fornecer várias versões do aplicativo (iOS e Android pelo menos) e ter de confiar em seus usuários mantendo o aplicativo atualizado. Este é um grande investimento. Instalar um aplicativo também é outro obstáculo entre seu conteúdo e o aluno que começou a estudar. Com materiais eLearning responsivos, o único aplicativo que você precisará é do navegador integrado em cada dispositivo móvel.

Aprendizagem Móvel

Então, como vamos começar? A primeira coisa que você deve pensar antes de fazer qualquer trabalho de design é pensar sobre como o aluno irá consumir o seu conteúdo.

Usar um dispositivo móvel é bastante diferente de usar um computador tradicional.

Sua utilização é uma experiência muito mais pessoal. A tela é geralmente utilizada muito mais perto do rosto do aluno do que uma tela estática. É também um ambiente de computação muito menos previsível, uma vez que o aluno pode ser interrompido regularmente, talvez aprendendo enquanto viaja para trabalhar, por exemplo, ou recebendo notificações do Facebook! Portanto, você precisa se certificar de que seu conteúdo pode ser digerível nos poucos minutos que ele pode ter entre as interrupções.

Usar um dispositivo móvel também é um ambiente muito mais tátil e imediato para a interação. O aluno geralmente usará seus dedos para navegar através de seu conteúdo e não, simplesmente, o clique do mouse. Também pode dar zoom com os dedos para ver melhor seu  conteúdo.

Tente ver alguns sites em um dispositivo móvel, sites que você está familiarizado no seu desktop. Veja como o conteúdo se ajusta, o que funciona bem e, talvez o mais importante, o que não funciona!

Dicas para criar um grande eLearning  com design responsivo

1.  Pense Mobile design primeiro e Desktop design depois

Se eu fosse  resumir a minha abordagem para a concepção de cursos responsivos em uma única frase seria “Pense no design mobile primeiro e o desktop depois”. Por isso, quero dizer que você precisa, em primeiro lugar, pensar sobre as restrições da tela do celular em termos de conteúdo. Em uma tela móvel, seu conteúdo textual será melhor exibido em parágrafos curtos e facilmente digeríveis de não mais de 4 ou 5 linhas de comprimento. Portanto, ao criar seus materiais de aprendizagem, começar no slide do desktop com longos blocos de texto é uma má ideia. Lembre-se que é um curso de eLearning responsivo, portanto, o mesmo conteúdo é usado para todos os modos de aprendizado.

A visualização da área de trabalho do conteúdo também terá parágrafos curtos de texto. Isso, no entanto, é o que você precisa projetar primeiro, fazendo o melhor do seu conteúdo usando espaço e linhas limpas para uma melhor apresentação. Em seguida, cuidadosamente refazendo seu projeto inicialmente em telas menores. Quando você primeiro definir a quantidade correta de conteúdo que será mostrado, será um processo muito mais simples.

2. Otimizar e refinar

Embora as redes 4G estejam se espalhando rapidamente em todo o país, muitos alunos podem estar acessando seu conteúdo através de conexões 3G mais lentas. Você precisa levar isso em consideração ao criar seus materiais de aprendizagem (a menos que você saiba com certeza que eles serão acessados em condições previsíveis e controladas, como por meio da empresa wi fi).

Apesar de desejarmos que nossos materiais de aprendizagem pareçam tão bons quanto o possível, colocar um monte de gráficos pode tornar o eLearning inutilizável para os alunos que aprendem com o celular. A última coisa que você quer para eles é que desperdicem seus preciosos minutos olhando barras de progresso ou animações de carregamento.

Portanto, tente reduzir os gráficos ao mínimo, especialmente os que são usados apenas para fins ilustrativos. Se você tiver gráficos, certifique-se de que eles são otimizados (algumas ferramentas de criação fazem isso automaticamente para você). Você também pode remover os desnecessários das versões móveis do curso, se você quiser mantê-los para desktop.

Você economizará muita largura de banda usando animações em HTML5 e CSS em vez de animações gráficas e efeitos. Uma animação em HTML5 pode ser muito menor em tamanho do que um gif animado (e, provavelmente, parecerá superior também).

3. Deslize para a esquerda

Seus alunos, provavelmente, estarão familiarizados com o uso de páginas e dispositivos móveis, de modo que usarão gestos para navegar.  Deslizar para a esquerda e direita através do material de aprendizagem, mesmo em uma navegação mais tradicional que exija cliques ou toques também estará disponível.

Deslizar pelo conteúdo do curso pode ser muito mais rápido do que encontrar e clicar em um botão. Com isso em mente, poderia ser fácil para o aluno passar por slides sem percebê-los, especialmente se eles forem muito semelhantes.

Pequenos sinais visuais para confirmar ao aluno que houve uma mudança para um novo slide são uma boa ideia. Estes podem incluir contadores de slides, usando cores diferentes (apesar de algumas pessoas com deficiência visual não serem capazes de distinguir entre algumas cores – ferramentas on-line estão disponíveis para testar isso), ou simplesmente variando a quantidade de conteúdo em slides. Por exemplo, se você tem um monte de texto para passar, pode  alternar entre um ou dois parágrafos de texto por slide útil.

4. Apontar o dedo

Seu aluno normalmente estará usando seu dedo para interagir com o recurso educacional em um dispositivo móvel. Um dedo tenderá a ser menos exato (e uma área maior) do que um ponteiro do mouse. Enquanto os dispositivos móveis são projetados para lidar com esse tipo de interação você precisa levar isso em conta ao desenvolver seus materiais responsivos.

Tente evitar colocar links muito próximos uns dos outros, por exemplo, pois pode ser difícil para o aluno tocar no pretendido. Se você estiver usando arrastar e soltar em uma atividade, certifique-se de que os itens para arrastar são grandes o suficiente e separados o suficiente para que o aluno possa selecionar o item que eles querem e não outros. Novamente, você precisa aproveitar ao máximo o tempo do aluno, que pode ser curto, que deseja que seus materiais de aprendizagem sejam mais simplificados e menos cansativos!

5. Retrato, Uma Paisagem Diferente

Se você está acostumado a criar materiais didáticos para desktop, então você irá geralmente projetar em modo paisagem. No entanto, a maioria das pessoas usam seus dispositivos móveis no modo retrato. Um bom eLearning responsivo se ajustará automaticamente, de modo que o conteúdo seja exibido corretamente independente da tela de destino.

No entanto, alguns conteúdos podem ser difíceis de serem apresentados no modo retrato. Por exemplo, um diagrama retangular mostrando uma organização de uma empresa, quando reduzida para caber no modo retrato (que pode ter apenas algumas centenas de pixels de largura) pode tornar-se ilegível. O que você pode fazer é projetar seu conteúdo para que ele funcione em modo retrato. Por exemplo, refaça seu diagrama para a orientação diferente. Ainda funcionará no modo desktop.

Isto nem sempre é possível. Nessas situações, o que você pode tentar, talvez, seja incorporar o conteúdo na visualização móvel, para que o aluno possa rolar para o lado e ver o conteúdo. Não é uma solução ideal, embora possa funcionar muito bem.

6. Entrada do usuário

Se sua aprendizagem requer que o aluno introduza valores, como em um teste on-line, lembre-se de como os usuários móveis introduzem seus dispositivos usando um teclado na tela. Isso significa que alguns de seus itens de tela valiosos, já colocados em uma tela pequena,  serão sobrepostos pelo teclado.

Você também precisa ter em mente a mecânica de entrada em um dispositivo móvel. Listas que caem, por exemplo, podem ser um pouco complicadas para o aluno, especialmente se as listas forem longas. Existe uma maneira melhor?

7. Sempre haverá um modo

Desnecessário será dizer que você deve testar seus materiais de aprendizagem, tanto quanto possível, antes de disponibilizá-los aos seus alunos. Teste para o celular: o que testar? Adicione uma nova complicação. Existem dezenas de fabricantes de telefones e centenas de smartphones que podem ver o seu conteúdo. A menos que você tenha especificado o hardware em um ambiente corporativo, você não irá saber o que seu aluno está usando para ver o seu curso.

Um bom design responsivo deve funcionar em todos os dispositivos, é o que diz a teoria afinal de contas! Na prática, haverá exceções e estranhezas. Você pode ser pego por novas versões de telefones com telas um pouco maiores. Tudo o que pode fazer é aplicar um bom design responsivo ao seu curso e testar o máximo possível. Não há dúvida de que há alguém que tem um telefone que tem problemas. Tente fazer com que isso não o deixe acordado à noite!

Espera-se que este breve artigo o ajude a criar cursos de eLearning responsivos que funcionem muito bem em dispositivos móveis. O melhor conselho é apenas começar a construir. Ganhando experiência, você aprenderá a aplicar seu conteúdo a telas móveis. E pensar em mobile em todos os momentos.

Confira outros artigos que podem te interessar

5 tendências de eLearning

5 tendências de eLearning

Principais tendências de eLearning Mesmo antes da pandemia de coronavírus, a indústria de eLearning estava se expandindo em um ritmo constante. Mas agora, o fechamento da maioria das empresas e instituições educacionais levou a um crescimento explosivo, à medida...

read more
Como um LMS pode otimizar o trabalho do RH?

Como um LMS pode otimizar o trabalho do RH?

O que é LMS aplicado a empresas? Como você pôde perceber, o LMS dentro das empresas assume o importante papel de aliado nas ferramentas para a educação corporativa. Seu principal objetivo é realizar o processo de aquisição de novas competências para os colaboradores,...

read more

Pin It on Pinterest

Share This
Close Bitnami banner
Bitnami