Diseño de contenidos responsive en Elearning

Con este, comienzo una serie de artículos sobre el diseño responsive con herramientas de autor para la creación de contenidos y cursos interactivos en Elearning. También me detendré en mencionar las más importantes y comentar con más profundidad aquellas con las que he tenido experiencia directa.

Si tienes interés por diseñar u ofrecer contenidos para el aprendizaje en movilidad (mobile learning) es posible que te sean útiles para elegir herramientas en un modelo de rapid learning. También para distinguir lo responsive de otras soluciones que aprovechan las tendencias del aprendizaje ubicuo.

¿Qué significa «responsive» en el diseño de contenidos interactivos para Elearning?

Es Ethan Marcotte, en un artículo de 2010 quien acuña el término responsive design aplicado al diseño de sitios web. En español este término se puede ver escrito como “responsivo”, “adaptativo”… Incluso “sensible”. Un berenjenal que dejo a otros para meterse en él  🙂 .

La irrupción del los lenguajes HTML5 y CSS3 marcan la generalización de lo «responsive» y el adiós a «Flash»

Entre otras muchas maravillas, estos lenguajes definen un antes y un después en la experiencia tanto del usuario como del diseñador web. Se acabó la duplicidad de versiones de un mismo sitio web, la necesidad de complementos como Flash para visualizar vídeos o hacer contenidos interactivos, etc.

Además, también se facilitó que pequeños y medianos proyectos de empresa pudieran ajustar su estrategia para adaptarse a las nuevas tecnologías sin morir en el intento.

Contenido responsive en escritorio tablet y smartphone

Entonces, ¿Cuáles son las condiciones para que un contenido sea «responsive»?

Los contenidos responsive son aquellos capaces de adaptarse a dispositivos con pantallas de diversos tamaños y orientaciones, táctiles o no, como smartphones, tablets o laptops, manteniendo una adecuada experiencia de usuario.

Forman parte de un pequeño paso en el concepto de “mejora progresiva“. En esta interesante presentación de Stephanie Rieger sobre «progressive-enhancement» puedes ampliar información.

El diseño responsive normalmente se van a mostrar en navegadores web u otros ecosistemas abiertos y para ser realmente efectivo debe contemplar aspectos como el ajuste en la disposición de sus elementos. En este breve vídeo, Allison Grayce lo representa visualmente:

Al aplicar este tipo de diseño a contenidos interactivos en Elearning conseguiremos que estén poco o nada condicionados por el tipo o disposición del dispositivo que utilice el aprendiz.

La utilización de un diseño no responsive, si bien es apropiado en ocasiones, impide o dificulta que podamos aprovechar para el aprendizaje la flexibilidad y habitualidad características de los dispositivos móviles.

Contenidos interactivos «responsive» y mobile learning

El diseño responsive facilita que se puedan dar condiciones de mobile learning, pero no es exclusiva de éste. Es decir, no todos los contenidos que se utilizan para mobile learning son responsive.

Utilizando mobile learning en el contexto empresarial

En mobile learning podemos encontrar contenidos no responsive, con una experiencia de usuario y objetivos exclusivamente dirigidos smartphones y tablets para el aprendizaje ubicuo. Normalmente se materializan en aplicaciones nativas (Apps).

Al respecto tienes un excelente post de Marcelino Martel sobre Apps aplicadas al Mobile Learning en Empresas.

Muchas Apps, sin embargo, no pueden encuadrarse en un diseño verdaderamente responsive ya que los contenidos:

  • O bien están limitados a mostrarse sólo dentro de la App nativa (por lo que no pueden ser mostrados en PCs portátiles o de escritorio)
  • O bien apenas es posible introducir interacciones de tipo selectivo o de contenido, como ocurre habitualmente con las app de los MOOCs (Coursera, Edx, etc.).

Ojo, que esto no quiere decir que no puedan ser estupendas y apropiadas para algunos contextos. Simplemente que no aprovechan las características de un diseño responsive para la experiencia de aprendizaje (o no lo necesitan).

Y, ¿sirve para todo el diseño «responsive» en Elearning?

Rotundamente, NO. El diseño responsive en Elearning es claramente insuficiente por ejemplo para el entrenamiento de habilidades que requieren escenarios y simulaciones complejas, role play, etc.

La introducción de demasiados recursos multimedia (videos o locuciones) así como de ciertas interacciones complejas también es bastante incompatible con un formato responsive:

  • ¿Has pensado que tus aprendices podrían estar utilizando tus contenidos mientras están en el metro? No parece muy apropiado entonces un contenido que necesite el aprovechamiento del canal auditivo, por ejemplo.
  • ¿Y si necesita interactuar con la simulación de un software? Es totalmente imposible entrenar este tipo de competencias en una pantalla de 5 pulgadas.

Pero lo cierto es que como diseñadores instruccionales tenemos una alta demanda de este tipo de formato responsive puede ser aprovechado para motivar y facilitar procesos de aprendizaje. 

Guías, introducción de conceptos, microcontenidos, refuerzo/repaso de aprendizajes, evaluaciones, etc. sí son ejemplos muy adecuados para su aplicación en formatos responsive.

Herramientas de autor para el diseño de contenidos interactivos

Las herramientas de autor son aplicaciones que nos van a facilitar la creación de contenidos formativos/educativos a diseñadores instruccionales, responsables de formación y docentes.

Normalmente se enmarcan dentro del denominado Rapid Learning por proporcionar una relativa facilidad para crear contenidos de calidad con un presupuesto ajustado y la posibilidad de realizar prototipos evaluables en poco tiempo.

Probablemente te suenan ejemplos como Adobe Captivate, eXeLearning, Articulate Storyline.

Representación de herramientas contenidos elearning responsive

Lo «responsive» en las herramientas de autor

Actualmente casi todas las aplicaciones presumen de incluir algún tipo de diseño responsive. Sin embargo no es realmente así en muchos casos.

Generar los contenidos en HTML5 tampoco garantiza un diseño responsive.

Por ejemplo, Articulate Storyline 360 genera contenidos interactivos en HTML5. Pero únicamente es responsive su reproductor. Los contenidos simplemente se reducen sin cambiar su relación de aspecto ni reposicionarse. Se asemejaría al “fluid layout” que puedes ver en el vídeo de arriba.

También se suele olvidar que en muchas ocasiones tenemos que depender de un LMS. Y una buena experiencia de usuario en el LMS (intuitiva, acciones mínimas para llegar al contenido deseado, etc.) es esencial para no arruinar ventajas de un diseño responsive.

¿Con qué herramientas puedes diseñar contenidos interactivos responsive?

Pese a sus limitaciones para crear escenarios y simulaciones complejos, este tipo de herramientas de autor nos van a permitir crear experiencias de aprendizaje especialmente adecuadas para generar microcontenidos.

Los aprendices pueden aprovecharlos en muchos dispositivos y situaciones que, como dice Marcelino Martel, pueden ofrecer “[…] comodidad, familiaridad y una mayor motivación[…]”

Varios dispositivos preparados para elearning responsive

Las herramientas más destacadas hoy en día para crear cursos y contenidos interactivos responsive pueden dividirse en dos clases:

Aplicaciones offline

Estas herramientas se instalan y guardan los contenidos en un equipo local. La capacidad para colaborar en equipo en la creación  de contenidos suele estar limitada o depender de otros servicios adicionales.

Las más importantes son:

  • Captivate 2017.
  • Lectora 17.
Aplicaciones online/basadas en web

Estas herramientas funciona y guardan sus datos en la nube. Normalmente permiten la exportación de los cursos en diferentes estándares y suele ser más factible la colaboración.

Las más importantes son:

  • Lectora online 3.
  • Elucidat.
  • Articulate Rise (parte de la suite Articulate 360).
  • Gomo Learning.
  • H5P.
  • Adapt Learning.
  • Evolve (versión privativa del framework de Adapt Learning).

Como puedes ver el tema de las herramientas de autor para generar contenidos interactivos con diseño responsive da para mucho.

En próximos artículos detallaré las posibilidades y algunas experiencias con las dos únicas herramientas Open Source que hay entre las mencionadas:

 

  • H5P: Herramienta para crear pequeños objetos de aprendizaje interactivos en Drupal, WordPress y Moodle.
  • Adapt Learning: Framework y herramienta de autor que permite crear cursos enteros totalmente responsive e introducir contenidos interactivos.

 

Y tú, ¿Conoces alguna otra herramienta de autor para crear contenidos «responsive»? ¿Qué opinas sobre sus ventajas e incovenientes?

 

Acerca de Mario G. Almonte Moreno

Consultor y diseñador de Elearning. Impulsor de la transformación digital y el aprendizaje de emprendedores y organizaciones.
Scroll To Top