Ambiente sVirtuales de Aprendizaje

Ambientes Virtuales de Aprendizaje M.C. Juan Carlos Olivares Rojas S 8-11 Sal贸n 201

Datos de Contacto

• E-mail: jcolivar@itmorelia.edu.mx • MSN: juancarlosolivares@hotmail.com • Web: http://antares.itmorelia.edu.mx/~jcolivar • Asesorías: Lunes a viernes de 10-12 cubo 33 (pasillo de en medio) Edificio I, Departamento de Sistemas y Computación, Instituto Tecnológico de Morelia.

Agenda

• Introducción (contexto actual) • Ambientes de Aprendizaje • AVA en Tecnologías Web • Diseño de páginas Web

Evaluación

• Construcción de un ambiente virtual de aprendizaje utilizando tecnologías Web. • El curso sirve de “Freidora”. Llegamos crudos, poco cocidos o muy cocidos y salimos fritos.

• Se aplicará la metodología “Bambi”.

Introducción

•

Las Tecnologías de la Información y del Conocimiento han revolucionado todas las áreas del quehacer humano, y la educación no ha sido la excepción.

•

Proyecto Millenium de las Naciones Unidas

•

De la manufactura a la mentefactura

Introducción

• ¿Por qué no aprenden los alumnos universitarios lo que se les quiere enseñar?

• • • • • • •

Problemas personales Excesivo número de alumnos Poco tiempo Recursos Métodos de estudio Desinterés Recargo de actividades

Función de un Profesor

• Docencia

• Investigación • Extensión • Modelo Constructivista Competencias.

basado

• La tecnología es un medio, no es el fin.

en

Introducción

• Brecha Digital

• Educación: conocimiento, actitudes y valores.

habilidades,

• Repetición: favorece un aprendizaje corto • Institución Tecnológica: Ciencia y Tecnología • Las TICs competencia básica: para la vida

er so

Naturalista

In tra p

na l

Interpersonal

Mu

l a c si

Lógica-Matemática

al ci pa Es

o ic l s e ora t s p e n or i c C

Lingüística

Inteligencias Múltiples

Tecnología Educativa • Tecnología Educativa: TICs + Didáctica • La tecnofilia o el “espejismo tecnológico” : cualquier incorporación de tecnología en la enseñanza basta para producir cambios favorables.

• La tecnofobia o la desestimación de la dimensión técnica de la enseñanza.

Era Digital

• Sociedad del Conocimiento

• Generación N (NET, Web)

Era Digital

La Tecnología debe de adaptarse a las situaciones pedagógicas, la didáctica y al contexto social

Curriculum

• Ubicación de las TIC en el curriculum Características del grupo de Alumnos

Objetivos y Metas Estrategias Métodos

Técnicas

Implementación

Evaluación

Medios

Eduación a Distancia

• E-Learning

• B-Learning • El docente crea ambientes de aprendizaje

Innovación Educativa

• Debe ser regla de oro para los que enseñan que todo se presente a cuantos sentidos sea posible • El docente debe de conocer más de su área que de TICs. • Innovación Educativa: el docente aplica nuevos métodos, técnicas y medios con el fin de mejorar el aprendizaje.

Nuevos Estudiantes

Cambios Educativos

Habilidades para el Siglo XXI

Nuevas formas de trabajo

Nuevo Tipo de Escuelas

Uso de TICs en todo

• Copia rápida del pizarrón.

• Solución: utilizar fotografías

Uso de TICs en todo

• Fotocopiado de algún material impreso como un libro.

Uso de TICs en todo

Sociedad del Conocimiento

• El problema actualmente no es tener la información, sino encontrarla.

• El futuro será de los que sepan buscar la información

Problemas de la Tecnología

•85% de los usuarios de web utilizan los buscadores para encontrar información •80% se frustan al no encontrar lo que buscan Señor, esto es una biblioteca, si quiere libros vaya a una librería

Importancia de la Internet

Objetos de Aprendizaje

• Los docentes debemos de aprendizaje” usndo TICs.

crear”objetos

de

• Un objeto de aprendizaje es un recurso didáctico en formato digital, reusable en diversos contextos, puede combinarse con otros para formar nuevos bloques. Está integrado por dos o más elementos (texto, gráficos, audio, video, imágenes, ejercicios…) articulados para generar competencias en quién los utiliza.

Ambientes “Virtuales”

• Más que ambientes virtuales (modalidad a distancia, presencial o b-learning) es el uso de TICs para desarrollar ambientes de aprendizaje que ayuden a los alumnos.

• Aplicación informática diseñada para facilitar la comunicación pedagógica entre los participantes en un proceso educativo.

AVA = Otro Modelo Pedagógico • El AVA está concebido para el aprendizaje.

– El alumno no es receptor pasivo.

– El aprendizaje es algo que el alumno elabora y no algo que el alumno recibe (la “enseñanza”).

– No se aprende todo, ni sólo, lo que se enseña.

• El Modelo Pedagógico es el Constructivismo Social

Consideraciones

• TIC´s no virtualizan la Educación • TIC´s no implican Educación a Distancia • AVA no omite práctica docente • AVA no implica disminución de costos • Aula Virtual es diferente a Sala de tutoría

Multimedia

• La retención de información por vía auditiva (radio) retiene un 20%, por vía audiovisual (tv) un 40%. La información que se adquiere vía audiovisual y con la cual es posible interactuar (como es el caso de Multimedia) se logra retener un 75%. Multimedia es, por encima de cualquier otra cosa que se pueda decir sobre él "la herramienta de comunicación más poderosa que existe”.

¿Qué es una página Web?

• Archivo de (hiper)texto

• Indica al navegador qué y cómo presentar la información (hipermedia) – Texto

– Colores, imágenes, ...

– Enlaces

• Codificado en lenguaje HTML

Pรกginas Web

Elementos de una Página Web Título Dirección(URL) Banner Título

Tabla / Herramientas de navegación

Herramienta de Navegación Herramienta de búsqueda Enlaces con gráficos Contenido Enlaces Marcos

Pie de página / Derechos de autor

¿Cómo crear páginas Web?

• Editor de texto (Notepad, Wordpad)

• Aplicación compatible con HTML (Word, PowerPoint) • Editor de páginas Web (Composer) • Gestor de Webs (FrontPage, DreamWeaver)

El lenguaje HTML

• Etiquetas

<center>

Inicio de etiqueta

................ Elementos a los que afecta </center> Cierre de etiqueta

â&#x20AC;˘ Atributos

<table border="0" width="80%" ...> .............

</table>

Estructura de un documento HTML

<HTML> <HEAD> <TITLE>Título</TITLE> </HEAD> <BODY> Texto del documento, Gráficos, Enlaces, ... </BODY> </HTML>

<A

Direcciones URL

HREF = “http://www.upv.es”>

Universidad Politécnica de Valencia </A> <A HREF = “mailto:jlhueso@mat.upv.es? tema”>

Inclusión de imágenes

• Enlace a la imagen

<IMG SRC = “imagen.gif” ALT = “Texto”> </IMG>

• La imagen como enlace

<A HREF = “dirección de destino”> <IMG SRC = “imagen.gif”> </IMG> </A>

Colores en una página

• Texto normal

<BODY TEXT = “black”>

• Texto del enlace

<BODY LINK = “blue”>

• Enlace visitado

<BODY VLINK = “#rrggbb”>

• Enlace activo (en descarga) <BODY ALINK = “#rrggbb”>

• Color

Fondo de la página

– <BODY BGCOLOR = “white”>

• Imagen

– <BODY BACKGROUND = “imagen.gif”>

Sitio Web

• Un sitio Web puede ser visto como una carpeta de la cual se tiene un documento raíz del cual dependen otros elementos.

• Este contenido puede ejecutarse de manera local o en un servidor.

Estructura de un Sitio Web ¿Cómo llego? ¿Puedo ver el sitio? ¿Dónde estoy? ¿Qué puedo hacer? ¿Cómo lo hago? ¿Para qué me sirve?

Buscabilidad

Visibilidad

Estética/ Diseño

Utilidad

Fidelidad

Diseño de una Web Educativa

• La web tiene que tener una estructura lógica.

• Tiene que enlazar ideas (hiperenlaces).

• La web debe potenciar significativo y activo.

el

aprendizaje

• La web debe ser un medio para ser explorado.

Diseño de una Web Educativa

• La web debe ser algo dinámico y cambiante.

• Los objetivos deben de ser claramente explicados en la página de inicio.

• Resumen introductorio.

• Mapa de navegación.

• Contenidos bien estructurados.

Diseño de una Web Educativa

• No es conveniente repetir contenidos.

• Datos de referencia como el correo del autor y la fecha de la última actualización.

• Se debe cuidar mucho la “usabilidad” de la página.

• No utilizar puntera.

tecnología

excesivamente

Lectura en la Web

• Si bien es cierto que un documento Web es una página con hipertexto, ésta presenta sus características especiales: • Los usuarios no leen, “escanean” las páginas.

• El mejor texto para la web es el periodístico clásico: encabezado y cuerpo. Debe ser corto y directo.

Lectura en la Web

• Destaque palabras clave.

• Incluya subtítulos informativos.

• Use listas con puntos o viñetas.

• Desarrolle una idea por párrafo.

• Reduzca a la mitad o menos el numero de palabras usadas en texto convencional.

Lectura en la Web

• La Web es “user-driven”: la gente quiere moverse, usar el mouse.

4

2

1

3

4

Jerarquía visual

Web

Diseño Web

• Diagramación:

– Leer un texto de ancho moderado – Texto en tabla autoajustable a las dimensiones del browser

• Color de la fuente-fondo

TEXTO

– Polaridad negativa y positiva

• Fondos gráficos:

– Evitar su uso – Buscar símil con la impresión

TEXTO

Consejos para mejorar la Web

• Evite los códigos HTML que no sean estándar (nuevos plug-ins, por ejemplo).

• El tiempo de respuesta es más importante que un diseño atractivo (8 segundos promedio por página).

• Evite usar vínculos (links) hacia afuera de su sitio

Consejos para mejorar la Web

• No use marcos (frames).

• Cuide la legibilidad de los textos: alto contraste, fuentes sans serif (Arial, Verdana o Tahoma), no use todo en mayúsculas, ni texto intermitente o en movimiento.

• Trozos de audio y video no deben superar los 60 segundos.

Test para un buen Sitio Web

• ¿Comunica de forma inmediata el objetivo del sitio a los usuarios?

• ¿El usuario está informado constantemente acerca de su ubicación?

• ¿El sitio se adapta al mundo de sus usuarios, su lenguaje y sus conocimientos?

Test para un buen Sitio Web

• ¿El usuario posee el control sobre lo que pasa en el sitio?

• ¿El sitio es consistente internamente y respeta estándares externos?

• ¿El diseño ayuda a prevenir posibles errores?

• ¿La página facilita y optimiza el acceso a los usuarios?

Test para un buen Sitio Web

• ¿Hay información irrelevante?

• ¿La navegación redescubierta?

es

recordada

más

que

• ¿El usuario recibe ayuda cuando lo necesita?

AVA con Tecnologías Web

• Existen varias formas de poder explotar la Web para fines educativos: • • • • •

Sitios Web de Cursos Académicos Sistemas de Gestión de Aprendizaje (LMS) Edublogs Wikis Webquest

Moodle

• Herramienta para la construcción de entornos virtuales de aprendizaje.

• Basado en el constructivismo social.

• Permite al docente construir ambientes donde los alumnos puedan el analizar, investigar, colaborar, compartir, construir y generar conocimiento.

Moodle

• Herramientas disponibles en moodle: • Comunicación (chat, foros, diarios).

• Trabajo colaborativo (lecciones, materiales).

• Evaluación (encuestas, talleres, tareas)

cuestionarios,

• Seguimiento (registro de actividades de los usuarios)

Entornos Virtuales de Aprendizaje

• Moodle - http://moodle.org

• Claroline - http://www.claroline.net • Dokeos - http://www.dokeos.com • Atutor - http://www.atutor.ca • .LRN - http://dotlrn.org • Sakai - http://www.sakaiproject.org/ • Blackboard http://www.blackboard.com/us/index.aspx

-

• WebCT - http://www.webct.com • Ilias http://www.ilias.uni-koeln.de/ios/index-e.html

-

Estándares y Proyectos Relacionados • IMS Global Learning Consortium http://www.imsglobal.org • ADL (SCORM) http://www.adlnet.org/ • EML http://eml.ou.nl • OKI http://web.mit.edu/oki • OpenCourseWare

Blog

• Un blog puede definirse como un diario online disponible a través de la Web. • Es el sustituto más fácil de implementar para tener un sitio Web. • Es un área de creciente desarrollo por lo que ya existen buscadores especializados: http://www.google.es/blogsearch, http://technorati.com/, http://www.blogpulse.com/

Blog

• Blogger: www.blogger.com • Google page creator: www.googlepages.com • Edublogs: http://edublogs.org • Wordpress: http://wordpress.org • Microblogging: www.twitter.com

¿Qué es una WebQuest?

• Actividad de investigación que se basa en informaciones obtenidas de recursos existentes en Internet.

• Recursos preseleccionados por el docente para asegurar el empleo del tiempo en usar la información y no en buscarla.

Estructura de una Webquest INTRODUCCIÓN INTRODUCCIÓN TAREA

PROCESO

EVALUACIÓN

CONCLUSIÓN

RECURSOS

Carácterísticas de Webquest

• Promueve un pensamiento creativo o crítico que comprende solución de problemas, juicio, análisis o síntesis.

• No es una hoja de trabajo para responder a cuestiones concretas.

• Promueve el trabajo y la discusión grupal.

• Plantea problemas abiertos, con varias posibles soluciones.

Duración de una Webquest

• Según su diseño y objetivos de una semana a un mes.

• Si tenemos limitaciones de tiempo dificultades prácticas: MINIQUEST

y/o

MiniQuest

• Se pueden construir en tan sólo tres a cuatro horas.

• Se realizan en una o dos sesiones de clase.

• Su estructura se reduce a sólo tres pasos: - escenario - tarea - producto

Ejemplos de WebQuests

1. El agua y su ciclo 2. Do帽ana

3. Deporte y discapacidad 4. Un fin de semana en Londres 5. Bullying 6. Peligro, Bacterias!

7. Componer una canci贸n 8. Compramos un coche

Wiki

• Es una herramienta colaborativa con la cual se pueden construir conceptos.

• Generalmente se asocia a la Web en la cual pueden contribuir usuarios registrados y anónimos.

• Ejemplos: • http://es.wikipedia.org/wiki/Wikipedia • http://www.wikilengua.org

Wikis

• Wikcionario: http://es.wiktionary.org/wiki/Portada • Wikiquote: http://es.wikiquote.org/wiki/Portada • Wikinoticías: http://es.wikinews.org/wiki/Portada • Servicios gratuitos de wikis: • Wikispaces http://www.wikispaces.com/

Tarea

• Definir su tipo de ava y las características del mismo.

• Recopilar documentos que ayuden a la definición • Próxima sesión: aun no definida probablemente el primer sábado de octubre.

Recursos Web Ăştiles para los procesos de EnseĂąanzaAprendizaje M.C. Juan Carlos Olivares Rojas

Google

• Es un buscador Web creado como proyecto de Doctorado por Sergei Bryn y Larry Page* • Actualmente es una de las empresas más importantes del mundo.

• Google significa una cifra de un 1 con 100 ceros.

Mitos de Google

• Google “lo sabe todo”

• Si no está en Google es que no está en la Web • Si no está en su primera página de resultados, es que no me interesa • No hay otras fuentes de información en la Web (que merezcan la pena)

Google

• La visión de la empresa es “Organizar la información del mundo y hacerla accesible y útil universalmente” • Tienen patentado un algoritmo de búsqueda muy eficiente: PageRank • Tiene una interfaz muy sencilla de utilizar pero sólo realiza búsquedas básicas.

Google

• El botón voy a tener suerte encuentra la mejor opción.

• Es accesible desde cualquier dispositivo.

• Permite realizar búsqueda de imágenes, grupos, directorios, noticias, artículos (google académico).

• Para sacarle el mayor provecho hay que utilizar la búsqueda avanzada.

Búsqueda avanzada

• http://www.google.com/advanced_search

Otros Buscadores

• Vivisimo: http://www.vivisimo.com • Scirus: http://www.scirus.com • Alltheweb: http://www.alltheweb.com • Ask Jeeves: http://www.askjeeves.com • Alexa: http://www.alexa.com • A9: http://www.a9.com

Otros buscadores

• Por grupos: clusty http://www.clusty.com

(vivisimo)

• Centíficos: scirus • De propósito general: Alltheweb, Ask Jeeves, Alexa, A9, Teoma • Directorios: yahoo, proyecto opendirectory

Bivitec

• El proyecto Bivitec (Biblioteca Virtual Tecnológica) es un portal educativo en donde se concentran una gran variedad de servicios educativos como buscadores, base de datos, revistas, tesis (proyecto triangulum), etc.

• Se accede desde la dirección http://www.bivitec.edu.mx y se necesita crear una cuenta. Hay que pertenecer al SNEST para tener acceso a toda la funcionalidad del portal.

Optimizaci贸n de B煤squedas

81

Comandos en Google

• Site: sirve para encontrar información en un sitio determinado.

• Filetype: para encontrar la información en un solo formato.

• Link: muestra los sitios Web que contienen a un sitio predeterminado.

• Related: par encontrar temáticamente relacionadas.

páginas

Comandos en Google

• Año .. Año: busca información comprendida en un rango de fechas.

• “Frase”: encuentra la frase exacta.

• +: sirve para encontrar exactamente una palabra sin sus variantes.

• -: excluye términos en la búsqueda.

Comandos Google

• Define: muestra la definición de un término • Operadores relacionales: OR, AND y NOT • Se puede utilizar de calculadora: 4*5 • Conversión de moneda: 100 eur a usd • También se puede buscar por: Idioma, País, Contenido presente sólo en alguna parte de la

Otras Búsquedas de Google

• Google Coop: Buscador www.google.com/coop

personalizado.

• Herramientas de Idioma de Google http://www.google.com/language_tools?hl=ES • Búsqueda de Documentos Académicos http://scholar.google.com/schhp?hl=es • Búsqueda en http://www.google.com/books?hl=es

Libros

Otros Buscadores

• Agregar URL en http://www.google.es/addurl

Google:

• Yahoo Search: http://search.yahoo.com • Live: www.live.com ahora (www.bing.com) • Metabuscadores: copernico, www.scitopia.org • Buscadores de Libros: www.amazon.com

Otros Buscadores

• Redes sociales

www.myspace.com, – Ocio: www.facebook.com

www.hi5.com,

– Profesionales: www.linkedin.com

• Descarga de software: www.softonic.com, www.tucows.com, www.download.com • P2P: Ares, eMule, BitTorrent

Herramientas Básicas

• Correo Electrónico: institucional y personal • Chat / Mensajero Instantáneo • Herramientas de Productividad* • Búsqueda de Información**

Herramientas Multimedia

• Imágenes: www.flickr.com

• Videos: www.youtube.com, www.schooltube.com, www.teachertube.com

• Presentaciones: www.slideshare.com • Ofimática: http://docs.google.com

Herramientas

(marcadores): www.del.icio.us, • Favoritos www.google.com/bookmarks/ • Sindicación de contenidos: www.bloglines.com • Citas académicas: www.citeulike.com • Línea del tiempo: www.xtimeLine.com

Herramientas

• Calendario: www.google.com/calendar?hl=es • Swftools: Convierte archivos pdf, imágenes y videos a presentaciones flash, combinar varias presentaciones flash en una sola y extraer videos, audios e imágenes de estas. (www.swftools.org).

Media Convert (www.media-convert.com).

• Cool PDF Reader y Pdf2exe: Convierten archivos pdf en programas ejecutables y permite extraer su contenido en un archivo de texto. (www.pdf2exe.com).

Otras herramientas

• Otras aplicaciones http://portableapps.com/apps • • • • •

portables:

Imágenes: http://galeria.educar.org www.openclipart.org http://school.discoveryeducation.com/clipart http://www.hellasmultimedia.com/webimag es/education/education_images.htm

• • • • •

Otras heramientas

Notas: www.notefish.com www.fleck.com www.stickis.com www.mystickies.com

• Filtrado de contenido Collectiva, Folskonomía): • www.digg.com • www.meneame.com

(Inteligencia

Otras Herramientas

• Ver varias cuentas www.jumptomail.com

de

correo:

• Diagramas en línea: www.gliffy.com • Correo electrónico grande: www.mailbigfile.com, www.send-largefile.com • Compartir archivos: www.foldershare.com,

Otras Herramientas

• Almacenamiento www.xdrive.com

en

Línea:

SkyDrive,

• Gestión de Proyectos: www.basecamphq.com, www.assembla.org • Knowledge Hub: “Perlas o Diamantes de Información” http://khub.itesm.mx • Open CourseWare: http://ocw.universia.net

Otras herramientas

• Manipulación de actividades con palabras: http://wordle.net • Lluvia de ideas: www.mywebspiration.com • Organización de www.rememberthemilk.com, http://evernote.com

datos:

• Flashcards: www.flashcarddb.com, www.flashcardexchange.com

Referencias

• Litwin,E. comp.

(2000) Tecnología Educativa. Buenos Aires, Paidós.

• Melonie, Julie (2006) Blogger. Madrid: Anaya Multimedia.

多Preguntas?