Page 1

FACULTAD DE INGENIERIA

Julián Esteban Gutiérrez Posada Universidad del Quindío Abril 2010

Universidad del Quindio - Jugutier Abril 2010

1


Software requerido

Procedimiento ◦ Descargue e Instale el software requerido ◦ Construyendo un sitio web de un TEMA o UNIDAD ◦ Creando actividades evaluativas ◦ Empaquetando el objeto de aprendizaje SCORM

Conclusiones Universidad del Quindio - Jugutier Abril 2010

2


KompoZer (http://www.kompozer.net/)

Herramienta para crear sitios web

HotPotatoes (http://hotpot.uvic.ca/)

Herramienta para crear actividades evaluativas

Reload (http://www.reload.ac.uk/new/editor.html/)

Herramienta para crear objetos de aprendizaje

Universidad del Quindio - Jugutier Abril 2010

3


ď ˝

Descargue el programa KompoZer (http://hivelocity.dl.sourceforge.net/project/kompozer/current/0.7.10/kompozer-0.7.10-win32.zip)

ď ˝

Descomprima el archivo

(kompozer-0.7.10-win32.zip)

En Program Files (Archivos de programa)

Universidad del Quindio - Jugutier Abril 2010

4


ď ˝

Ejecute el programa

Universidad del Quindio - Jugutier Abril 2010

5


ď ˝

Descargue el programa HotPotatoes (http://hotpot.uvic.ca/setup_hotpot_6303.exe)

ď ˝

Instale el programa

(setup_hotpot_6303.exe)

En C:\Program Files\HotPotatoes6

Universidad del Quindio - Jugutier Abril 2010

6


ď ˝

Ejecute el programa

Universidad del Quindio - Jugutier Abril 2010

7


ď ˝

Descargue el programa Reload (http://www.reload.ac.uk/download/Reload_Dist255_Java15.zip)

ď ˝

Descomprima el archivo

(Reload_Dist255_Java15.zip)

En Program Files (Archivos de programa)

Universidad del Quindio - Jugutier Abril 2010

8


ď ˝

Ejecute el programa

Universidad del Quindio - Jugutier Abril 2010

9


Lo primero que hay que hacer es hacer una planeación inicial, es decir tener claro por lo menos:  La población destinataria para el objeto de aprendizaje (OVA).  Conocimientos previos para poder enfrentar el OVA.  Definir los objetivos del OVA.

 Los contenidos del OVA, idealmente multimediales.  Las actividades (auto)evaluativas que involucra el OVA.  Idealmente deben proponer actividades colaborativas.

 Tener presente en el diseño los estilos de aprendizaje. Universidad del Quindio - Jugutier Abril 2010

10


A manera de ilustraci贸n, analice la propuesta de David Kold sobre 驴c贸mo aprendemos?

Universidad del Quindio - Jugutier Abril 2010

11


Universidad del Quindio - Jugutier Abril 2010

12


Ejemplo de una Planeación inicial –Sitio sobre la construcción de OVAsCARACTERISTICA INICIAL DEL OVA Población destinataria

• Principalmente estudiantes del curso de E-Learning, o cualquier persona que cumpla los conocimiento previos.

Conocimiento previos

Habilidades y conocimiento básicos en: • El manejo, instalación y descompresión de software • Internet, específicamente la navegación

Objetivo General

Ilustrar un procedimiento de creación de un OVA

Objetivos específicos

• Indicar cuál puede ser un conjunto de software requerido para el diseño y construcción de un OVA • Mostrar su instalación y ejecución. • Crear paso a paso un OVA

Contenidos

• • • •

Instalación y ejecución del software requerido Creación del sitio web Creación de actividades evaluativas Creación del OVA en sí mismo.

• • • • •

Ejercicios de Ejercicios de Ejercicios de Ejercicios de Ejercicios de

Actividades evaluativas

Por cada contenido respectivamente y una actividad final

reordenar frases rellenar huecos emparejamiento evaluación tipo test crucigramas Universidad del Quindio - Jugutier Abril 2010

13


Cree desde el explorador de archivo una carpeta de trabajo. Ej: y otra dentro de ella para las imágenes, Ej:

Ejecute la herramienta para crear sitios web. ◦ Defina un área de trabajo de 600px

Universidad del Quindio - Jugutier Abril 2010

14


Copie primero en la carpeta destinada para las imágenes todas aquellas que desee utilizar. Por ejemplo para crear la presentación del OVA, yo necesito:

Universidad del Quindio - Jugutier Abril 2010

15


Antes de comenzar a trabajar en una página del proyecto, guárdelo (save) en la carpeta de trabajo con la extensión (html). El título puede tener acentos, pero recomiendo no ponerlos en el nombre del archivo.

Universidad del Quindio - Jugutier Abril 2010

16


Construya una presentación para el OVA, tal y como si estuviera usando un editor de textos como el Word. No se niegue la posibilidad de utilizar imágenes, animaciones y demás elementos visuales que le ayuden a dar una presentación agradable, sin llegar nunca a exagerar. ◦ Inserte únicamente las imágenes que copió en la carpeta destinada para ellas. ◦ Asegúrese de que ellas tengan activa la opción “URL is relative to page location”. ◦ Asígnele un texto alternativo para poder insertar la imagen. ◦ Use tablas para organizarlas, si son varias. ◦ Puede usar la opción de Insertar HTML para insertar elementos como videos de YouTube.

Universidad del Quindio - Jugutier Abril 2010

17


Sólo para ilustrar, en Youtube se debe hacer clic en Insertar y luego copiar el código señalado en la ventana que aparece al insertar HTML… y listo. Para verlo por la opción Browse.

Universidad del Quindio - Jugutier Abril 2010

18


Ejemplo de la presentación del OVA vista desde el navegador (Browse)

Sería ideal asignarle una licencia CC (Creative Commons)

a su objeto de aprendizaje para facilitar su difusión y reutilización. http://creativecommons.org/choose/?jurisdiction=co Universidad del Quindio - Jugutier Abril 2010

19


Repita el procedimiento para crear TODO el contenido del OVA, iniciando con las características del OVA.

Le recomiendo no escribir mucho contenido por página, en su lugar divida el contenido varios páginas (secciones y subsecciones)

Universidad del Quindio - Jugutier Abril 2010

20


Al igual que en los procesadores de textos como Word, usted puede poner enlaces a otras páginas externas o internas al OVA. Para ello se usa la opción “Link…” Por ejemplo: ◦ Regrese

a la página de presentación.

◦ Adicione

la palabra Continuar en la parte inferior, subráyela y haga clic en Link…

Universidad del Quindio - Jugutier Abril 2010

21


En las propiedades del enlace “Link Properties” defina la localización del enlace “Link Location”

Universidad del Quindio - Jugutier Abril 2010

22


Universidad del Quindio - Jugutier Abril 2010

23


Ejecute la herramienta para crear actividades evaluativas

Pero antes de crear un ejemplo, lo invito a ver los siguientes videos en YouTube. ◦ Parte 1 (Ejercicios de reordenar frases)

http://www.youtube.com/watch?v=--McdHtr4-s

◦ Parte 2 (Ejercicios de rellenar huecos)

http://www.youtube.com/watch?v=h2DIF3DKtGU&feature=related

◦ Parte 3 (Ejercicios de emparejamiento)

http://www.youtube.com/watch?v=zwfVQ9bRyMQ&feature=related

◦ Parte 4 (Ejercicios de evaluación tipo test)

http://www.youtube.com/watch?v=ZejEfEBEeNA&feature=related

◦ Parte 5 (Ejercicios de crucigramas)

http://www.youtube.com/watch?v=j-ScQgkm0bM&feature=related Universidad del Quindio - Jugutier Abril 2010

24


ď ˝

ď ˝

Una vez hecha una actividad evaluativa en el HotPotatoes, se debe generar un archivo HTML y este debe ser almacenado en la carpeta de trabajo, ej: Ahora y a manera de ilustraciĂłn, haremos un ejercicio de emparejamiento (JMatch)

Universidad del Quindio - Jugutier Abril 2010

25


ď ˝

Complete la informaciĂłn solicitada

Universidad del Quindio - Jugutier Abril 2010

26


Genere una página web con el ejercicio

◦ Guarde el archivo (.htm) en la carpeta de trabajo.

No deje espacios en los nombres de los archivos. ◦ Finalmente vea el resultado en el navegador Universidad del Quindio - Jugutier Abril 2010

27


ď ˝

Se puede observar que hay textos que podemos traducir

Universidad del Quindio - Jugutier Abril 2010

28


Vamos a la pantalla de configuración

Cambiemos en Títulos/Instrucciones ◦ “Matching exercise” por “Ejercicio de emparejamiento” ◦ “Match the items on the right to the items on the left” por “Empareje los elementos de la derecha con los de la izquierda” Universidad del Quindio - Jugutier Abril 2010

29


Cambiemos en Avisos / Feedback: ◦ “:-)” por “Correcto” ◦ “X” por “Incorrecto” ◦ “Your score is “ por “Su puntaje es “ ◦ “Correct! Well done.” por “Correcto! Bien hecho.”

◦ “Sorry! Try again. Incorrect

matches have been removed.”

por “Lo siento! Inténtelo de nuevo.” Universidad del Quindio - Jugutier Abril 2010

30


Cambiemos en Botones: ◦ “Check” por “Comprobar” ◦ “Ok” por “Correcto”

◦ “Next” por “Siguiente” ◦ “Delete” por “Borrar” 

Desactive las opciones ◦ Incluir botón “Siguiente ejercicio” ◦ Incluir botón “Ir a Contenidos”

Universidad del Quindio - Jugutier Abril 2010

31


Cambiemos en Contador: ◦ “Your time is over!” por “Su tiempo ha terminado”

Especifique un limite de tiempo si lo estima conveniente

Universidad del Quindio - Jugutier Abril 2010

32


Activemos en Otro: ◦ “Incluir SCORM 1.2 functions” ◦ “Barajar el orden de las preguntas cada vez que cargue la página”

Las demás pestañas pueden permanecer tal y como están configuradas.

Universidad del Quindio - Jugutier Abril 2010

33


Genere una página web con el ejercicio ya configurado

◦ Guarde el archivo (.htm) en la carpeta de trabajo

No deje espacios en los nombres de los archivos. ◦ Finalmente vea el resultado en el navegador Universidad del Quindio - Jugutier Abril 2010

34


 

De esta forma cree otras actividades de (auto)evaluación. Experimente los otros tipos de actividades (auto)evaluativas), según los videos sugeridos. Universidad del Quindio - Jugutier Abril 2010

35


 

Ejecute el ReLoad Editor Cree un nuevo “ADL SCORM 2004 Package” y seleccione la carpeta de trabajo

Universidad del Quindio - Jugutier Abril 2010

36


La pantalla obtenida debe ser similar a esta una vez creadas todas la p谩ginas de contenido y de evaluaci贸n.

Universidad del Quindio - Jugutier Abril 2010

37


Arrastre a “Resources” todas las páginas web creadas

Universidad del Quindio - Jugutier Abril 2010

38


Cambie “Organizations” por “Contenido”

Universidad del Quindio - Jugutier Abril 2010

39


Cambie “Item” por “Presentación”

Seleccione en “Referenced element” la página asociada a la presentación “Presentacion.html” Universidad del Quindio - Jugutier Abril 2010

40


Añada un Item al “Contenido”, según la estructura de su contenido y (auto)evaluaciones. Para ello haga clic derecho en el item al que le desea añadir otro… creando así un índice. No olvide especificar “Referenced element” al recurso (página Web) correspondiente

Universidad del Quindio - Jugutier Abril 2010

41


ď ˝

Realice una pre-visualizaciĂłn del objeto

Universidad del Quindio - Jugutier Abril 2010

42


Ahora genere el objeto virtual de aprendizaje

Objeto Virtual de Aprendizaje SCORM

Muchas gracias Julián Esteban Gutiérrez Posada Universidad del Quindio - Jugutier Abril 2010

43

creando un objeto SCORM  

COMO CREAR UN OBJETO TIPO SCORM CON YUDA DE LAS TIC