Memoria ID-0184. Ayudas de la Universidad de Salamanca para la innovación docente, curso 2016-2017

Blanco Rodríguez, Francisco Javier

Curto Diego, María Belén

Moreno Montero, Ángeles María

Moreno Rodilla, Vidal

Polo Martín, María José

Álvarez Navia, Iván

Álvarez Rosado, Susana

Spanish

Gestion del Repositorio Documental de la Universidad de Salamanca

Informe final  de  ejecución del  Proyecto  de  Innovación y Mejora Docente  realizadodurante el curso académico 2016-2017 en el Departamento de Informática y Automáticade la Facultad de Ciencias, financiado mediante la convocatoria de 2016 del Programade Mejora de la Calidad- Plan Estratégico General 2013-2018.ID2016/184Entorno Virtual para la docencia on-line de Estructuras de Datos Miembros del Equipo de Trabajo: María José Polo MartínÁngeles María Moreno MonteroIván Álvarez NaviaSusana Álvarez RosadoBelén Curto DiegoVidal Moreno RodillaFrancisco Javier Blanco RodríguezDepartamento de Informática y Automática.Facultad de Ciencias de la Universidad de Salamanca.Plaza de los Caídos S/N, 37008El  objetivo  principal  del  proyecto  es  la  creación  de  una  aplicación  web  para  lavisualización del comportamiento de diferentes algoritmos sobre varias estructuras dedatos, principalmente árboles, que se estudian en la asignatura Estructuras de Datos yAlgoritmos II. Esta asignatura se enmarcan dentro de la materia de Programación en elGrado  de  Ingeniería  Informática.  Complementan  la  formación  obtenida  en  lasasignaturas de primer curso y proporcionan una base para asignaturas posteriores, comoRedes de Computadores.1IntroducciónEn este proyecto se ha diseñado y desarrollado una aplicación web para la visualizaciónon-line del comportamiento de diferentes algoritmos sobre varias estructuras de datos.Se han introducido algunas mejoras al software educativo que se desarrolló dentro delproyecto Herramienta para el aprendizaje visual y dinámico de estructuras de datos [9].Esta herramienta consiste en una aplicación de escritorio que el estudiante tiene quedescargarse e instalar en su ordenador. La mejora principal ha consistido en convertiresta herramienta en una aplicación web. De esta forma se aumenta la disponibilidad,accesibilidad  y facilidad  de  uso a  los  contenidos  prácticos  que  cubre  la  aplicación.Además se han ampliado algunas funcionalidades que se habían echado en falta en laaplicación de escritorio anterior. La ampliación de estas funcionalidades surgen comoresultado de los guiones de prácticas elaborados en el desarrollo del proyecto Creaciónde material para prácticas de estructuras de Datos Complejas [10].Contexto de desarrolloEn la asignatura de Estructuras de Datos y Algoritmo II se presentan al estudiante grancantidad de algoritmos que manejan estructuras de datos, [7], [2], [1], [8], como árbolesy  grafos.  Su  aprendizaje  plantea  ciertas  dificultades  a  los  estudiantes  de  IngenieríaInformática. Con la herramienta de escritorio utilizada en cursos previos se ha facilitadoeste aprendizaje, pues permite aplicar los algoritmos a nuevos ejemplos, comprobar elresultado de casos más complejos y ver de forma dinámica la evolución del algoritmosobre un ejemplo concreto [9]. En  las  sesiones  prácticas  se  pasa  del  diseño  y  análisis  de  los  algoritmos,  a  suimplementación en un lenguaje de programación y, a su posterior ejecución y prueba.Para ello el estudiante dispone de una serie de guiones de prácticas desarrollados en elproyecto Creación de material para prácticas de estructuras de Datos Complejas [10].Estos  guiones  sirven  al  estudiante  como  directriz  y  le  permiten  una  comprensiónescalonada de los conceptos estudiados en teoría. A los guiones de prácticas se ha idoañadiendo material de apoyo para su realización, principalmente código fuente para quelas  prácticas se  centren en la  implementación de los  algoritmos estudiados.  En estesentido  hemos  considerado  interesante  que  la  aplicación  fuera  capaz  de  generar  elcódigo fuente de los ejemplos que muestra de manera visual. De esta forma, una vezimplementado el algoritmo, se dispone de los mismos ejemplos y es  posible concluircon las fases de ejecución y prueba. La idea es poder aplicar su propio algoritmo almismo ejemplo de prueba generado por la aplicación visual y, de esta forma, constatarel resultado veraz o no de su implementación. Se plantea una nueva funcionalidad queno estaba diseñada en la aplicación de escritorio, la necesidad de obtener en código Clos mismos ejemplos que la herramienta visual muestra. 2Además,  la  herramienta  visual  de  escritorio  permite  visualizar  la  ejecución  delalgoritmo paso paso sobre el ejemplo. Para ayudar a la comprensión de los algoritmos,se plantea la posibilidad no solo de mostrar el propio algoritmo, sino que la ejecuciónpaso a paso se muestre sobre él. Esta nueva funcionalidad ayudará a la comprensión delos  algoritmos y resulta  especialmente importante  en la  ejecución de los  algoritmosrecursivos que, aún siendo sencillos de implementar, presentan muchas dificultades alos estudiantes en el seguimiento de su ejecución.Objetivos del proyectoEn la fase inicial del proyecto quedaron definidos los objetivos del mismo. El objetivoprincipal ha sido la conversión de una aplicación de escritorio en una aplicación web, deforma  que  puede  utilizarse  a  través  de  cualquier  navegador  que  permita  acceso  aInternet, es decir, ya no es necesario descargar ni instalar ningún tipo de archivo ennuestro ordenador para trabajar con la aplicación.  La mayoría de objetivos ya estabandefinidos en el proyecto de partida, en esta etapa, por tanto, se ha definido la mejora delproyecto y las posibles ampliaciones. Como objetivo comunes de la aplicación de escritorio y la aplicación web, rescatamoslos  objetivos  que  se  plantearon  en  la  aplicación  de  escritorio.  Por  cada  estructuraestudiada la herramienta debía permitir la realización de diferentes actividades:• Estudio de ejemplos proporcionados por el profesor• Posibilidad de generar ejemplos específicos por parte del estudiante y ejemplosaleatorios automáticos • Posibilidad de guardar,  modificar y recuperar los ejemplos generados para suposterior visualización y estudio• Análisis  por  parte  del  estudiante  de  los  ejemplos  generados  mediante  laejecución paso a paso de todos los algoritmos estudiados en clase• Verificación de la comprensión de los algoritmos aplicados a los ejemplos: elresultado final que proporcione la aplicación es correcto y permite verificar losresultados esperados por el estudiante.En esta  fase,  desarrollada  durante  los  meses  de  Septiembre  y  Octubre  de  2016,  sedecidió ampliar algunas funcionalidades visuales respecto a la versión de escritorio. Eneste sentido se añadieron dos funcionalidades nuevas:• Posibilidad de añadir a la ejecución paso a paso el seguimiento no solo en el ejemplo gráfico sino también en la  línea de ejecución del algoritmo en ese momento3• Posibilidad de generar los fichero en lenguaje de programación C para que el estudiante pueda aplicar los algoritmos que implementa en prácticas a los ejemplo que visualiza en la propia aplicaciónDescripción de la AplicaciónEn el análisis, diseño y desarrollo de la aplicación, fases 2 y 3, se ha seguido el ProcesoUnificado[4]  y  se  ha  utilizado  el  lenguaje  de  modelado  UML.  Se  ha  redefinidocompletamente la interfaz del usuario, pero sigue mostrando claramente las diferentesopciones en cuanto a tipo de estructura, algoritmo a presentar, tipo de ejecución, etc. - figura 1 -En la  figura  1  pueden  observase  las  tres  partes  principales  en  que  está  dividida  lainterfaz: parte superior o menú, ventana principal a la izquierda en al que se mostrará elejemplo de la estructura elegida y ventana secundaria a la derecha en la que se mostrarávisualmente el algoritmo. 4- figura2-La  figura  2  muestra  el  menú  principal  desplegado  en  sus  diferentes  opciones.  Sinembargo, dependiendo del dispositivo y del zoom elegido en el navegador, la interfaz dela  aplicación  puede  adaptarse  para  una  mejor  visibilidad.  La  figura  2  muestra  unaposible  adaptación  que  se  genera  de  forma  automática  al  aumentar  el  zoom en  elnavegador. Si el zoom disminuye las diferentes opciones del menú se muestran  en lazona superior, donde van apareciendo diferentes líneas de menú, según las opcioneselegidas (figura 3).Este menú permite acceder de forma rápida y sencilla a las diferentes estructuras dedatos que maneja la aplicación. Una vez elegida la estructura a estudiar, aparecen otraslíneas de menús como muestra la figura 3 y, dependiendo de las opciones elegidas vanapareciendo las estructuras y algoritmos en las ventanas principal y secundaria de laaplicación.  En  este  caso  se  ha  elegido  la  estructura  Árboles  Binarios  en  el  menúprincipal,  se  ha  generado  un  árbol  aleatorio  eligiendo  esta  opción  en  el  menúintermedio.  El  árbol  aleatorio  generado  puede  verse  en  la  ventana  principal  y  elalgoritmo aplicado en la ventana secundaria. El menú inferior permite seleccionar elmodo de ejecución y también crear los ficheros que guarden la simulación y generen elcódigo C que permita crear el árbol generado aleatoriamente en la ventana principal. Enla parte de la derecha se muestra el algoritmo aplicado a la estructura y si se seleccionala ejecución paso a paso, va resaltando la línea concreta que se va ejecutando en cadamomento.5- figura 3 -La interfaz ha cambiado respecto a la aplicación de escritorio pero se siguen teniendolas mismas funcionalidades. Además pueden observase las dos funcionalidades nuevas.La posibilidad de generar código C, segundo botón del menú inferior y; el seguimientodel algoritmo, si se elige el botón paso a paso, en la parte derecha de la interfaz.El código C correspondiente al árbol de la figura 3 puede observarse en la figura 4.  Estafigura muestra que la aplicación genera una función en código C que el estudiante puedeincluir  a  su propio  código de  manera  fácil  y  que  le  permite  trabajar  con la  mismaestructura que visualiza en la herramienta. La inclusión puede ser copiando y pegando elcódigo C generado en sus  propios  ficheros  de implementación o creando un nuevofichero que puede compilar y enlazar en su proyecto de prácticas de manera rápida ysencilla.6- figura 4 -ConclusionesSe ha desarrollado una aplicación web para la visualización del comportamiento de losalgoritmos que se presentan en la asignatura  Estructuras de Datos y Algoritmos II. Laaplicación se ha presentado en las clases prácticas de la asignatura y, aunque todavía nose ha podido probar completamente y analizar los resultados obtenidos, ha servido paradetectar algunos fallos y errores que estamos intentado subsanar para el próximo curso. La utilización de la aplicación web ha aportado algunas ventajas en el estudio de laasignatura de Estructuras de Datos y Algoritmos, sobre todo en el tema de árboles quees en el que más incidencia hemos hecho. En este sentido, podemos indicar que su usofavorece el proceso educativo, pues permite la obtención on-line de material docente.En las clases presenciales este material permite plasmar los contenidos de las mismas,intercalando de forma paulatina, algoritmos teóricos con ejemplos prácticos. Por otrolado,  la  aplicación  está  disponible  para  el  estudio  individual  y  no  presencial  delestudiante.  Con ella  podrá  simular  los  algoritmos  que  va  estudiando  y  aplicarlos  aejemplos  concretos.  Con  la  nueva  funcionalidad  añadida,  los  ejemplos  simuladospueden obtenerse en código fuente y servir como entrada a los algoritmos reales que elalumno implementa.  Es  una herramienta,  por tanto,  que permite  el  autoestudio y laautoevaluación.La aplicación  web,  complementa  la  metodología  docente  y  el  material  de  prácticaselaborado para esta asignatura como parte del proyecto [10]. Recordamos que una de las7mejoras que proponíamos para este proyecto era la aportación de material adicional.Principalmente la inclusión de código fuente para que el estudiante, a la hora de realizarlas prácticas, pudiera centrarse en la implementación de los algoritmos que ha estudiadoy analizado. La herramienta, como hemos visto, permite generar parte de este código,pues de forma automática permite obtener funciones en C que crean los ejemplos quevisualmente  se  muestran.  Esta  aportación  ha  resultado  muy  interesante  para  losalumnos, pues permite, a través del mismo ejemplo, estudiar y analizar el algoritmoteórico y después seguir trabajando con el mismo ejemplo, en las sesiones de prácticas.Sin la herramienta el estudiante debía generar este código, lo cual restaba tiempo paradedicar a los objetivos principales de la asignatura. Por otra parte, la obtención de formaautomática evita posibles errores en la codificación.Referencias[1]  A.  V.  Aho,  J.  E.  Hopcroft,  and  J.  Ullman.  Estructuras  de  datos  y  algoritmos.Addison-Wesley Iberoamericana, 1988.[2] O. Cairó and S. Guardati. Estructuras de datos.McGraw-Hill, 2006.[3]  E.  W.  Dijkstra.  A note  on two problems in  connection  with  graphs.  NumericheMathematics, 1:269-171,October 1959.[4] I. Jacobson, J. Rumbaugh, and G. Booch.  El Proceso Unificado de desarrollo desoftware. Addison Wesley,2000.[5] I.J. James Rumbaugh and G. Booch. El Lenguaje Unificado de Modelado. Manualde Referencia. Addison Wesley, 2000.[6] Polo Martín, M.J.; Moreno Montero, A.M.; Iglesias Alonso, C. Experiencias en eluso de Técnicas de Visualización en el aprendizaje de Estructuras de Datos. PrimerasJornadas  de  Innovación  Docente  en  la  Universidad  de  Salamanca,  pg.  276.Noviembre,2011.[7] M. Weiss. Estructuras de datos y algoritmos. Pearson Education, 1995.[8] N. Wirth. Algoritmos y estructuras de datos=Programas. Ediciones del Castillo, 1980.[9] ID11/150 Herramienta para el aprendizaje visual y dinámico de estructuras de datos[10] ID2012/193 Creación de material para prácticas de Estructuras de Datos Complejas8

Entorno Virtual para la docencia on-line de Estructuras de Datos

Entorno Virtual para la docencia on-line de Estructuras de Datos

Abstract

Similar works

Full text

Available Versions

Gestion del Repositorio Documental de la Universidad de Salamanca