3 pasos para convertir el contenido de aprendiaje electrónico de Flash a HTML5

Migrar tu contenido de Flash eLearning a HTML5 puede parecer sencillo. Ya tienes el diseño de instrucción del curso y la narración grabada. ¡Y lo que queda es moverlos a un entorno HTML5! Bueno, ojalá esto fuera cierto, pero el proyecto de conversión no logrará sus objetivos a menos que sea planeado minuciosamente.

En los últimos 5 años, mi empresa ha recibido muchas solicitudes para convertir el contenido interactivo de eLearning heredado que fue desarrollado en Flash a HTML5. Después de trabajar en más de 100 horas de aprendiaje de la migración, llegamos a la siguiente lista de consejos para realiar esta tarea de manera eficiente y reducir los costos involucrados.

Normalmente dividimos el trabajo en 3 componentes principales:

1. Conversión de la imagen de la red

Este es el marco que mantiene todo unido. Puede ser una herramienta de creación (Adobe CS6 con CreateJS, Adobe Captivate, Trivantis Lectora, Articulate Storyline, etc.), o un desarrollo HTML5 flexible y personaliado diseñado específicamente para satisfacer sus necesidades. Si eliges desarrollar tu wireframe de forma personaliada, debes tener en cuenta los siguientes consejos:

  • Los objetivos de clic y toque deben ser lo suficientemente grandes (tamaño recomendado 7mm por 7mm en pantalla).
  • Los enlaces principales, incluyendo el menú del curso, deben agruparse en el encabeado.
  • Añada siempre una barra de estado debajo del encabeado que muestre la posición exacta del usuario en el curso.
  • Los botones de control de reproducción, pausa y audio son los del reproductor predeterminado del navegador y deberían aparecer sólo si son necesarios.
  • Usar iconos que den instrucciones visuales claras.

2. La conversión de la apariencia y el tacto

El aspecto y la sensación de una aplicación web receptiva es diferente del aspecto y la sensación de no receptividad. Preste especial atención a la disposición del diseño para que toda la información se presente con una experiencia de visualiación óptima a través de diferentes dispositivos.

3. Conversión de contenido

Y aquí reside la mayor parte del trabajo, el análisis cuidadoso de todo el contenido en vital en esta etapa, debería ser capa de hacer coincidir cada una de las funciones de legado con un grupo de plantillas web bien diseñadas. Las plantillas interactivas comunes de eLearning HTML5 incluyen:

Plantilla de acordeón

Puede utiliarse para presentar información en categorías interactivas, y puede contener texto, imágenes y objetos sonoros.

Plantillas de gráficos

Puede utiliarse para presentar el contenido visualmente y permitir la interactividad con el contenido para presentar el texto, las imágenes y la narración relacionados.

Plantillas de la lista de control

Puede utiliarse para guiar al estudiante a través de una serie de pasos o un proceso; el estudiante comprobará cada parte del proceso, y luego pasará al siguiente con indicaciones claras de los pasos completados.

Plantillas de comparación

Puede utiliarse cuando se presenta al alumno un contenido relacionado, y necesita conocer la deferencia y/o las similitudes entre ellos.

Plantilla de arrastrar y soltar

Puede ser usado para evaluar la comprensión de los alumnos con respecto a un tema explicado, y para hacer el proceso de aprendiaje divertido y efectivo. Revise el artículo de Cristian Pardo sobre las 6 maneras de usar las interacciones de arrastrar y soltar en su curso de eLearning

Plantilla de la galería de fotos

Pueden utiliarse para presentar imágenes relacionadas o un progreso de algún tipo; estas plantillas son una forma efica de presentar un gran número de contenido visual (imágenes, vídeos y gráficos) en la misma diapositiva, a la ve que proporcionan introducciones visuales de elementos adicionales.

Plantillas del glosario

Puede utiliarse para agrupar toda la terminología utiliada en el curso de eLearning en un icono de cabecera fácilmente accesible, o en el menú principal del curso.

Plantillas HotSpot

Interactividades como puntos de acceso en la pantalla se utilian en los cursos de eLearning para atraer y hacer que los alumnos se centren en el curso. Le piden a los alumnos que hagan clic para saber. Cuando el usuario hace clic, se muestra la información relacionada; este patrón permite al usuario explorar la información para mantenerse ocupado.

Plantillas de presentación de diapositivas

Son similares a las plantillas de la galería de fotos, pero avanan automáticamente para mostrar al alumno una presentación continua de un tema o un grupo de temas.

Plantillas de video

Presentar un vídeo o una animación relacionada con el contenido, y también puede utiliarse para obtener retroalimentación presentando un tema en un vídeo y luego pidiendo al alumno una retroalimentación.

Espero que estos consejos te ayuden a migrar eficientemente de Flash a HTML5. Si tienes alguna pregunta, contáctame.

Dejar respuesta

Please enter your comment!
Please enter your name here

Información básica sobre protección de datos Ver más

  • Responsable los propietarios legales de editorialcomplutense.
  • Finalidad  Moderar los comentarios. Responder las consultas.
  • Legitimación Su consentimiento.
  • Destinatarios  contabo.
  • Derechos Acceder, rectificar y suprimir los datos.
  • Información Adicional Puede consultar la información detallada en la Política de Privacidad.