Ambientes Virtuales de Aprendizaje

1
Ambientes Virtuales de Aprendizaje

• M.C. Juan Carlos Olivares Rojas
• S 8-11 Salón 201

2
Datos de Contacto

• E-mail jcolivar_at_itmorelia.edu.mx
• MSN juancarlosolivares_at_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.

3
Agenda

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

4
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.

5
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

6
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

7
Función de un Profesor

• Docencia
• Investigación
• Extensión
• Modelo Constructivista basado en Competencias.
• La tecnología es un medio, no es el fin.

8
Introducción

• Brecha Digital
• Educación conocimiento, habilidades, actitudes y
  valores.
• Repetición favorece un aprendizaje corto
• Institución Tecnológica Ciencia y Tecnología
• Las TICs competencia básica para la vida

9
Inteligencias Múltiples
Lingüística
Naturalista
Musical
Intrapersonal
Lógica-Matemática
Interpersonal
Cinestesico-corporal
Espacial
10
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.

11
Era Digital

• Sociedad del Conocimiento
• Generación N (NET, Web)

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

• Ubicación de las TIC en el curriculum

Características del grupo de Alumnos
Objetivos y Metas
Implementación
Evaluación
14
Eduación a Distancia

• E-Learning
• B-Learning
• El docente crea ambientes de aprendizaje

15
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.

16
Nuevos Estudiantes
17
Cambios Educativos
18
Habilidades para el Siglo XXI
19
Nuevas formas de trabajo
20
Nuevo Tipo de Escuelas
21
Uso de TICs en todo

• Copia rápida del pizarrón.
• Solución utilizar fotografías

22
Uso de TICs en todo

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

23
Uso de TICs en todo
24
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

25
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

26
Importancia de la Internet
27
Objetos de Aprendizaje

• Los docentes debemos de crearobjetos de
  aprendizaje usndo TICs.
• 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.

28
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.

29
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

30
Consideraciones

• TICs no virtualizan la Educación
• TICs 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

31
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.

32
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

33
Páginas Web
34
Elementos de una Página Web
Título
Dirección(URL)
Banner
Título
Herramienta de Navegación
Herramienta de búsqueda
Enlaces con gráficos
Tabla / Herramientas de navegación
Contenido
Enlaces
Marcos
Pie de página / Derechos de autor
35
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)

36
El lenguaje HTML

• Etiquetas
• ltcentergt Inicio de etiqueta
• ................ Elementos a los que afecta
• lt/centergt Cierre de etiqueta
• Atributos
• lttable border"0" width"80" ...gt
• .............
• lt/tablegt

37
Estructura de un documento HTML

• ltHTMLgt
• ltHEADgt
• ltTITLEgtTítulolt/TITLEgt
• lt/HEADgt
• ltBODYgt
• Texto del documento, Gráficos, Enlaces, ...
• lt/BODYgt
• lt/HTMLgt

38
Direcciones URL

• ltA HREF http//www.upv.esgt
• Universidad Politécnica de Valencia
• lt/Agt
• ltA HREF mailtojlhueso_at_mat.upv.es?temagt

39
Inclusión de imágenes

• Enlace a la imagen
• ltIMG SRC imagen.gif ALT Textogt lt/IMGgt
• La imagen como enlace
• ltA HREF dirección de destinogt
• ltIMG SRC imagen.gifgt lt/IMGgt lt/Agt

40
Colores en una página

• Texto normal
• ltBODY TEXT blackgt
• Texto del enlace
• ltBODY LINK bluegt
• Enlace visitado
• ltBODY VLINK rrggbbgt
• Enlace activo (en descarga)
• ltBODY ALINK rrggbbgt

41
Fondo de la página

• Color
• ltBODY BGCOLOR whitegt
• Imagen
• ltBODY BACKGROUND imagen.gifgt

42
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.

43
Estructura de un Sitio Web
Estética/ Diseño
Buscabilidad
Cómo llego?
Visibilidad
Puedo ver el sitio?
Dónde estoy?
Utilidad
Qué puedo hacer?
Cómo lo hago?
Fidelidad
Para qué me sirve?
44
Diseño de una Web Educativa

• La web tiene que tener una estructura lógica.
• Tiene que enlazar ideas (hiperenlaces).
• La web debe potenciar el aprendizaje
  significativo y activo.
• La web debe ser un medio para ser explorado.

45
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.

46
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 tecnología excesivamente puntera.

47
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.

48
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.

49
Lectura en la Web

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

4
3
2
1
4
Web
Jerarquía visual
50
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
51
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

52
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.

53
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?

54
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?

55
Test para un buen Sitio Web

• Hay información irrelevante?
• La navegación es recordada más que
  redescubierta?
• El usuario recibe ayuda cuando lo necesita?

56
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

57
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.

58
Moodle

• Herramientas disponibles en moodle
• Comunicación (chat, foros, diarios).
• Trabajo colaborativo (lecciones, materiales).
• Evaluación (encuestas, cuestionarios, talleres,
  tareas)
• Seguimiento (registro de actividades de los
  usuarios)

59
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.as
  px
• WebCT - http//www.webct.com
• Ilias - http//www.ilias.uni-koeln.de/ios/index-e.
  html

60
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
• http//ocw.mit.edu/

61
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/

62
Blog

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

63
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.

64
Estructura de una Webquest

• INTRODUCCIÓN

TAREA
PROCESO
RECURSOS
EVALUACIÓN
CONCLUSIÓN
65
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.

66
Duración de una Webquest

• Según su diseño y objetivos de una semana a un
  mes.
• Si tenemos limitaciones de tiempo y/o
  dificultades prácticas MINIQUEST

67
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

68
Ejemplos de WebQuests

• El agua y su ciclo
• Doñana
• Deporte y discapacidad
• Un fin de semana en Londres
• Bullying
• Peligro, Bacterias!
• Componer una canción
• Compramos un coche

69
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

70
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/
• Wiki.mailxmail http//wiki.mailxmail.com/
• PBWiki http//pbwiki.com/

71
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.

72
Recursos Web útiles para los procesos de
Enseñanza-Aprendizaje

• M.C. Juan Carlos Olivares Rojas

73
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.

74
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)

75
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.

76
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.

77
Búsqueda avanzada

• http//www.google.com/advanced_search

78
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
• Teoma http//www.teoma.com

79
Otros buscadores

• Por grupos clusty (vivisimo) http//www.clusty.co
  m
• Centíficos scirus
• De propósito general Alltheweb, Ask Jeeves,
  Alexa, A9, Teoma
• Directorios yahoo, proyecto opendirectory

80
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.ed
  u.mx y se necesita crear una cuenta. Hay que
  pertenecer al SNEST para tener acceso a toda la
  funcionalidad del portal.

81
Optimización de Búsquedas
82
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 páginas temáticamente
  relacionadas.

83
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.

84
Comandos Google

• Define muestra la definición de un término
• Operadores relacionales OR, AND y NOT
• Se puede utilizar de calculadora 45
• 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
  página (título)

85
Otras Búsquedas de Google

• Google Coop Buscador personalizado.www.google.co
  m/coop
• Herramientas de Idioma de Googlehttp//www.google
  .com/language_tools?hlES
• Búsqueda de Documentos Académicoshttp//scholar.g
  oogle.com/schhp?hles
• Búsqueda en Libroshttp//www.google.com/books?hl
  es

86
Otros Buscadores

• Agregar URL en Google http//www.google.es/addurl
  
• 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

87
Otros Buscadores

• Redes sociales
• Ocio www.myspace.com, www.hi5.com,
  www.facebook.com
• Profesionales www.linkedin.com
• Descarga de software www.softonic.com,
  www.tucows.com, www.download.com
• P2P Ares, eMule, BitTorrent
• Mapas http//maps.google.com/

88
Herramientas Básicas

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

89
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
• Mapas conceptuales www.cmaptools.com

90
Herramientas

• Favoritos (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

91
Herramientas

• Calendario www.google.com/calendar?hles
• 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).

92
Otras herramientas

• Otras aplicaciones portableshttp//portableapps.
  com/apps
• Imágenes
• http//galeria.educar.org
• www.openclipart.org
• http//school.discoveryeducation.com/clipart
• http//www.hellasmultimedia.com/webimages/educatio
  n/education_images.htm

93
Otras heramientas

• Notas
• www.notefish.com
• www.fleck.com
• www.stickis.com
• www.mystickies.com
• Filtrado de contenido (Inteligencia Collectiva,
  Folskonomía)
• www.digg.com
• www.meneame.com

94
Otras Herramientas

• Ver varias cuentas de correo www.jumptomail.com
• Diagramas en línea www.gliffy.com
• Correo electrónico grande www.mailbigfile.com,
  www.send-large-file.com
• Compartir archivos www.foldershare.com,

95
Otras Herramientas

• Almacenamiento en Línea SkyDrive, www.xdrive.com
• 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

96
Otras herramientas

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

97
Referencias

• Litwin,E. comp. (2000) Tecnología Educativa.
  Buenos Aires, Paidós.
• Melonie, Julie (2006) Blogger. Madrid Anaya
  Multimedia.

98
Preguntas?