VMCREATIVE: Herramienta didáctica de apoyo al proceso de enseñanza y aprendizaje de los conceptos básicos de vectores y matrices Autor: Oscar Andrés Montenegro B. Director: Ing. Luis Carlos Díaz Ch. MSc. Buenas tardes. Mi nombre es OM y a continuación se va a hacer la presentación del proyecto VMCreative cuyo director es el Ing. Luis Carlos Díaz Chaparro.

Agenda Contexto Objetivo general Proceso Definición de requerimientos y caracterización de la herramienta Definición de la metáfora Implementación Conclusiones y trabajos futuros La agenda que se va a llevar para esta presentación consiste: En primer lugar, en explicar el marco general sobre el cual está encaminado el proyecto. Para después hacer mención del objetivo general que se pretende conseguir. Posteriormente, se explicarán los pasos seguidos para el desarrollo de la herramienta. Finalmente se mostrarán las conclusiones y unas sugerencias para seguir con este proyecto.

Contexto Creado por ISTAR Problemas: Interés Lectura Notación Carencias sistema educativo Proyecto Software Tangible Proyectos anteriores: INPOORACTIVA TAVA La programación es una actividad que requiere de mucha organización mental para poder plasmarla en una aplicación. Pero al momento de aprender, los estudiantes cuentan con muchos problemas para poder entender los conceptos apropiadamente. Entre ellos están: Diversidad de intereses ya que la programación no es una actividad rutinaria en algunos estudiantes. No tener unos hábitos de lectura desarrollados Carencias en el sistema educativo ya que los estudiantes, al salir de sus respectivas secundarias, no salen lo suficientemente bien preparados para enfrentar las primeras materias de sus carreras. Objetivo: Hacer metáforas y representaciones visuales para complementar procesos de E-A

Agenda Objetivo general Contexto Proceso Definición de requerimientos y caracterización de la herramienta Definición de la metáfora Implementación Conclusiones y trabajos futuros

Objetivo general Desarrollar una herramienta de software que contribuya al proceso de enseñanza y aprendizaje de los conceptos básicos, declaración, ordenamiento y búsquedas en vectores y matrices por medio de metáforas y representaciones visuales.

Agenda Contexto Objetivo general Proceso Definición de requerimientos y caracterización de la herramienta Requerimientos Restricciones del micromundo Actividades básicas de interacción Actividades significativas de aprendizaje Definición de la metáfora Implementación Conclusiones y trabajos futuros

Requerimientos - Entrevistas Contexto Problemas más comunes para enseñar la cátedra de Fundamentos de Programación Representaciones visuales Sugerencias al momento de realizar la representación visual de la aplicación. Contenido de la herramienta Temas Lenguaje de los ejemplos Uso de texto Ejemplos Pruebas Objetivos Tamaño de la muestra Población a la que va orientada

Requerimientos - Bibliografía relevante NOMBRE DE LA UNIVERSIDAD NOMBRE DE LA ASIGNATURA BIBLIOGRAFÍA EN COMÚN Pontificia Universidad Javeriana Pensamiento algorítmico JOYANES, L., Problemas de Metodología de la Programación, Ed. McGraw Hill,1990. JOYANES, L., Programación en C, 1ª ed. Ed. McGraw Hill, 2001. BECERRA C. Algoritmos Conceptos Básicos. Ed. César Becerra, 1996. MATA TOLEDO, R., Introducción a la programación, McGraw Hill, 2001 DEITEL H.M., Como Programar en C/C++, Segunda Edición. Prentice Hall. 1995 Universidad de los Andes Algoritmos y Programación I Universidad Nacional de Colombia Fundamentos de Programación

Restricciones del micromundo El código para los ejemplos debe ser en C++ y no puede ser modificado. Uso de la menor cantidad posible de texto Los contenidos deben ser explicados a partir de la representación visual. No utilizar bloques de memoria para explicar un contenido. Mostrar una modalidad de ordenamiento y búsqueda. Utilizar una dimensión máxima de 3 columnas para los vectores y de 3 filas y 3 columnas para las matrices. El código que se genera para los ejemplos debe ser en C++ y no puede ser modificado. El contenido que se presenta debe mostrar la menor cantidad de texto posible. Todos los contenidos deben ser explicados a partir del uso de la representación visual. Ninguna sección de la aplicación debe apoyarse en el tema de posiciones de memoria para explicar su contenido. Para explicar el funcionamiento de ordenamientos y búsquedas, en términos del alcance del presente proyecto, es suficiente con mostrar una de las modalidades que cada uno maneja. Para el tema de vectores, bastará con utilizar una dimensión máxima de 3 columnas, mientras que en el caso de las matrices se considerará una dimensión de máximo 3 filas y 3 columnas.

Actividades básicas de interacción Reproducir contenido Detener animación de un ejemplo Retrasar animación del ejemplo hasta el inicio Adelantar animación hasta el final Mostrar contenido del tema Seleccionar posición de un vector o matriz Mostrar valor de un vector o matriz Validar ejemplo Objetivo específico cumplido: Especificar los requerimientos que deberá tener la herramienta didáctica teniendo en cuenta la definición de la metáfora y las actividades significativas de aprendizaje.

Actividades significativas del aprendizaje Identificar los elementos básicos para llamar un arreglo, sabiendo diferenciar entre los casos de vectores y matrices. Diferenciar el significado de términos como posición, subíndice y valor e identificarlos al momento de ver un pedazo de código relacionado. Declarar vectores y matrices. Escribir valores sobre alguna posición del vector o matriz. Leer los valores que hay en una posición del vector o matriz. Inicializar vectores y matrices Distinguir las modalidades de la inicialización de vectores matrices. Explicar el funcionamiento del ordenamiento en modalidad burbuja. Explicar el funcionamiento de la búsqueda en modalidad lineal.

Agenda Definición de la metáfora Selección Elementos Contexto Objetivo general Proceso Definición de requerimientos y caracterización de la herramienta Definición de la metáfora Selección Elementos Tipos de datos elegidos Implementación Conclusiones y trabajos futuros

Representación de la metáfora – Selección Posibilidades

Representación de la metáfora – Selección (cont.) Norman (Apropiación, naturalidad, relación) Tversky (Congruencia, aprehensión) Criterios Empate técnico cajas, caja de huevos, cubeta de hielo Se eligió la caja de huevos Resultados Representación posiciones del vector o matriz -> solo se puede mostrar la primera fila. Dificultad para mostrar nombre del vector o matriz. Justificación Norman: Refleja la naturalidad con que la metáfora se relaciona con el tema: no dice ni más ni menos y no se necesita improvisar. Tversky: Relaciona más el contenido del tema con la estructura de la metáfora.

Representación de la metáfora - Elementos Valor del vector o matríz en la posición 1 Posición del vector o matriz Índice de la posición Nombre del vector o matríz

Representación de la metáfora – Tipos de datos elegidos Objetivo específico cumplido: Definir metáforas o abstracciones visuales sobre los conceptos básicos de vectores y matrices y un conjunto de actividades significativas de aprendizaje relacionadas con el tema.

Agenda Implementación Contexto Objetivo general Proceso Definición de requerimientos y caracterización de la herramienta Definición de la metáfora Implementación Prácticas de Ingeniería de Software aplicadas Mapa de navegación Uso del DJProject Pruebas Conclusiones y trabajos futuros

Prácticas de Ingeniería de Software implementadas Uso de metodologías: Espiral + LUCID Uso de documentos: SRS SAD Guión Uso de repositorios: http://code.google.com/p/vmcreative/ http://code.google.com/p/vmcreative-p2/ Cabe recordar que LUCID se utilizó para la interfaz gráfica como complemento al modelo en espiral. Para los repositorios, se utilizó Google Code Project Hosting y como conexión se utilizó la herramienta Tortoise SVN 1.5.8. Ambos con licencia GPL. LUCID: Logical User Centered Interaction Design o Diseño de Interacciones Lógicas Centradas en el Usuario. Es un framework para manejar el proceso de diseño de una interfaz de manera que se garantice o por lo menos se generar usabilidad en el software a implementar [3]. Objetivo específico cumplido: Desarrollar un prototipo funcional de la herramienta didáctica cumpliendo los requerimientos identificados y aplicando prácticas recomendadas de Ingeniería de Software.

Mapa de navegación VMCreative

Implementación – Uso del DJProject ¿Qué es? Proyecto creado por Christopher Deckers con el fin de: Dar soporte a la toma de eventos Mejorar interacción del usuario Mejorar comunicación de componentes de otra naturaleza Características Uso de la librería NativeSwing Uso de la librería SwingSuite Uso de la librería Sweet Las características principales del proyecto DJProject son: El uso de la librería NativeSwing que hace las veces de puente de comunicación entre los componentes Swing y componentes nativos como Flash y Web haciendo el paso de mensajes. Posee una librería llamada Swing Suite que ofrece componentes para la creación de interfaces de usuario. Dentro de estos componentes incluyen campos de texto y de números, botones de combo y enlaces. Posee una librería llamada Sweet que contiene un navegador Web, un Flash Player y manejar sombreados de línea cuando se pretenda mostrar código. Ventajas Mejoras del proyecto a partir de hilos Reproduce animaciones en Flash Edita texto HTML en contenedor Java Reproduce elementos multimedia

Pruebas - Descripción ¿A quién está dirigido? Estudiantes que están cursando la asignatura Pensamiento Algorítmico Objetivos de la aplicación Usabilidad Congruencia con los conocimientos impartidos Fortalezas Debilidades Proceso Solicitud a los profesores para ejecutar las pruebas Inducción a los estudiantes a la prueba Exploración de la herramienta (30-40 min.) Recolección de resultados Estructura de la prueba Usabilidad y apariencia Teoría Complemento

Pruebas – Resultados y retroalimentación

Pruebas – Resultados y retroalimentación Fortalezas Ideas claras Completo en temas Ejemplos concretos Bien en pruebas de escritorio Fácil de usar Debilidades Claridad en el uso de botones Más ejemplos Sugerencias Aclarar navegación Manual de uso Gráfica más estructurada de la caja de huevos Detalles Cursos tomados: 2 Total estudiantes: 27 Profesores que tomaron la prueba: 2 Objetivo específico cumplido: Realizar pruebas piloto de usabilidad de la herramienta didáctica sobre una muestra significativa de estudiantes que estén, o ya hayan cursado, la asignatura Pensamiento Algorítmico.

Agenda Conclusiones Ventajas de VMCreative Trabajos futuros Contexto Objetivo general Proceso Definición de requerimientos y caracterización de la herramienta Definición de la metáfora Implementación Conclusiones Ventajas de VMCreative Trabajos futuros

Ventajas de VMCreative Herramienta educativa Informativa Instructiva Motivadora Reflexiva Lúdica Estilos de aprendizaje Visual Kinestésico Relacional Como herramienta educativa: Informativa: Transmitir un conocimiento. Instructiva: Llevar un hilo conductor que orienta al estudiante en su proceso de adquisición del conocimiento. Motivadora: Incitar al estudiante a preguntarse qué hace la aplicación en determinada instancia facilitando el proceso de retroalimentación. Reflexiva: Dar el espacio al estudiante para que piense en cada una de las acciones o frases que observa y dar la oportunidad para medir estos conocimientos por medio de una retroalimentación. Lúdica: La aplicación emite el conocimiento desde un enfoque un poco más ligero involucrando imágenes y movimiento causando que el usuario se sienta más atraído por lo que ve y tenga más probabilidades de captar el concepto más eficientemente. Como estilo de aprendizaje: Visual: Con el uso de gráficas, se estimula es hemisferio izquierdo del cerebro de manera que el estudiante tenga más probabilidad de memorizar los conceptos. Kinestésico: El aprendizaje se da gracias a la interacción con el contexto en el cual se desenvuelve la aplicación. Relacional: El estudiante puede reflexionar y obtener conclusiones significativas a partir de su experiencia con la aplicación.

Conclusiones Desarrollo completo de la herramienta Selección de la metáfora y representaciones visuales claves para el proyecto. La actividad de requerimientos facilitó el diseño y el desarrollo. Combinación de metodologías Uso del DJProject facilitó la implementación del prototipo Éxito en las pruebas respecto a las expectativas Se realizó completamente la herramienta de software planteada logrando incluir todos los temas y fases de desarrollo que inicialmente se habían propuesto. La selección de la metáfora y representaciones visuales y la metodología seguida fueron claves para que la realización del proyecto fuera completa. La actividad de recolección de requerimientos (realización conjunta de una investigación, entrevistas y caracterización de la herramienta) facilitó mucho el diseño y desarrollo de la aplicación. Combinar dos o más metodologías puede volver el desarrollo de una aplicación más compleja, pero es posible sacar provecho a cada una de ellas si se miran las fortalezas y debilidades de cada una de ellas para compensarlas. El uso del DJProject fue clave para el desarrollo completo del prototipo de la aplicación. El resultado de las pruebas de usabilidad de la herramienta mostró que se cumplieron las expectativas puestas sobre el prototipo de la aplicación.

Trabajo futuro Elección representación visual Desarrollo de compilador Incluir multimedia Elección de lenguaje Tener la posibilidad que el programa tenga una opción que le permita elegir al usuario cuál representación visual quiere utilizar. Desarrollo de un compilador que muestre el resultado del código introducido y la representación visual correspondiente. Permitir la oportunidad de incluir elementos multimedia de más complejidad. Ejemplo: Videos y sonido. Dar la posibilidad al usuario de elegir en qué lenguaje quiere que los ejemplos sean representados.

Gracias por la atención… ¿¿¿¿Preguntas???