Creaci贸n de Ambientes de Aprendizaje
M. Sc. Juan Carlos Olivares Rojas Marzo 2010
• Introducción • Tecnologías Web
Outline
– Sitio Web – Blog – Wiki – Otros recursos – VLE: moodle
• Desarrollo de un ambiente de aprendizaje con tecnologías Web (100% Proceso-Producto).
Datos de Contacto
• E-mail: jcolivar@itmorelia.edu.mx • MSN: juancarlosolivares@hotmail.com • Web: http://antares.itmorelia.edu.mx/~jcolivar • Twitter: @jcolivares • Facebook: Juan Carlos Olivares Rojas
Mundo Actual
Era Digital
• Sociedad del Conocimiento
• Generación N (NET, Web)
Cambios Educativos
Era Digital
La Tecnología debe de adaptarse a las situaciones pedagógicas, la didáctica y al contexto social
Función de un Profesor
• Docencia
• Investigación • Extensión • Modelo Constructivista Competencias.
basado
en
ra pe rs on al
Naturalista
In t
Interpersonal
l a ic s Mu
LógicaMatemá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
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.
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.
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.
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
Ambientes de Aprendizaje
Plataformas VLE
• Herramientas y recursos: – Foro – Wiki – Mensajes – Sección de tareas – Glosario – Calificaciones – Cuestionarios – Recursos
AVA Docentes interesados en las tecnologías Docentes usuarios de las tecnologías
•Las TIC como apoyo a la práctica docente •Ambientes Virtuales de Aprendizaje
Autores y Desarrolladores Especialistas Innovadores
•Planeación Estratégica •Formación y Actualización Docente •Especializados
NIVELES DE ATENCIÓN
AVA
AVA
Medios de Comunicaci贸n
Evaluaci贸n
Evaluaci贸n
¿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, </BODY> </HTML>
Enlaces, ...
<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.
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
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
– Polaridad negativa y positiva
• Fondos gráficos:
– Evitar su uso – Buscar símil con la impresión
TEXTO
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
¿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/ •
• 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)
• 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.
• 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
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
76
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,
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
Otros Buscadores
• Redes sociales – Ocio:
www.myspace.com,
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
• Favoritos
Herramientas
(marcadores):
www.del.icio.us,
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
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 • Flashcards:
datos:
www.flashcarddb.com,
Referencias
• Litwin,E. comp. (2000) Tecnología Educativa. Buenos Aires, Paidós. • Melonie, Julie (2006) Blogger. Madrid: Anaya Multimedia.
多Preguntas?