Vídeo explicativo

Video descriptivo

Introducción Descarga artículo en PDF

autor_blaster
Responsable
Rafael Ángel Aznar Aparici
Centro escolar
CIPFP Ausiàs March
Dirección
C/Ángel Villena, s/n. 46013 Valencia
Localidad y provincia
Valencia (Valencia)
Web del centro
https://www.ausiasmarch.net/es
Contacto
rafaaznar@gmail.com
Etiquetas
  • Premios 2022
  • FP
  • Informática y Comunicaciones
  • Aprendizaje basado en proyectos
  • Aprendizaje cooperativo
Logotipo del proyecto
Logotipo del proyecto

Un proyecto software es un producto complejo de desarrollar y mantener. Al desarrollar un proyecto para la web debe integración de tecnologías y sincronía entre ellas. Por otra parte, en el entorno laboral, la mayoría de los proyectos software de tamaño medio o grande se desarrollan en grupo. Por esta razón es necesario fomentar el aprendizaje en grupo, ya que potencia en el alumnado valores imprescindibles como el compromiso, la comunicación y la diversidad de enfoques, a la vez que aprenden el oficio. Por ello la metodología de aprendizaje basada en el desarrollo de proyectos (ABP), dejando en segundo plano el mero aprendizaje metódico de la tecnología, motiva a las y los estudiantes para investigar distintas soluciones por ellos mismos y los capacita para afrontar un entorno tecnológico muy cambiante, en el cual deberán ser autónomos para poder estar al día, fomenta la colaboración, el trasvase de conocimientos y de código entre estudiantes, logrando una verdadera experiencia de aprendizaje en grupo.

Esta experiencia ha sido galardonada con el 1º Premio en la categoría FP modalidad A de los “Premios Nacionales a Experiencias Educativas Inspiradoras para el aprendizaje. Convocatoria 2022”.

Esquema de tecnología AJAX
Esquema de tecnología AJAX

Punto de partida

Vista del CIPFP Ausiàs March
Vista del CIPFP Ausiàs March

El proyecto BLASTER es una experiencia educativa que ha sido llevada a cabo en segundo curso del Ciclo Formativo de Grado Superior denominado Desarrollo de aplicaciones web (DAW), en el CIPFP Ausiàs March de Valencia, que actualmente cuenta con unos 27 ciclos formativos, 1600 estudiantes matriculados y alrededor de 140 docentes. En esta experiencia se propone capacitar al alumnado de DAW mediante ABP con los siguientes objetivos:

Vista del CIPFP Ausiàs March
Vista del CIPFP Ausiàs March
Aprendizaje basado en proyectos
Aprendizaje basado en proyectos
  • Aprender de manera práctica. El alumnado debe aprender a desarrollar desarrollando. Aprenden mejor cuando están activamente involucrados en la realización de tareas y proyectos prácticos aplicados. Pero no basta con aprender las tecnologías y la lógica de programación, sino que se busca desarrollar competencias y habilidades muy valoradas en el ámbito laboral, como son la proactividad, la creatividad, la capacidad de aprender con autonomía y la capacidad para comunicarse y para trabajar en equipo.
  • El segundo objetivo es que los y las estudiantes aprendan desarrollando proyectos grupo, potenciando el transvase de conocimientos entre ellos, observando diferentes formas de resolver un problema y mejorando su habilidades sociales. Se intenta simular en clase el entorno laboral para que el alumno desarrolle su capacidad de adaptación a los métodos de trabajo.
  • Por último, se pretende producir a lo largo del tiempo un corpus referencial de aplicaciones web para la consulta técnica. Sabemos que una aplicación web es un producto software complejo y costoso. Las empresas e instituciones invierten muchos recursos en desarrollar este tipo de aplicaciones y, una vez desarrolladas, siguen invirtiendo muchos recursos en mantenerlas. Por desgracia, en entornos académicos es difícil tener acceso a aplicaciones web de carácter didáctico para que los alumnos aprendan. En esta experiencia, los proyectos acabados en cada curso se publican con licencia MIT y sirven de referentes para que los alumnos y alumnas de este curso y cursos posteriores los utilicen de campo de pruebas y aprendan con su estudio. El código de estos proyectos puede ser incorporado a los proyectos personales del alumnado, simplificando y acortando el tiempo de desarrollo de los mismos.

Paso a Paso

Tenemos el reto de preparar a un grupo de estudiantes con diversidad de conocimientos iniciales para trabajar en grupo y ser capaces de generar proyectos de software viables. Además, hay que hacerlo en un periodo corto de tiempo de tiempo, ya que el segundo curso de DAW comienza en septiembre y acaba en marzo para que el alumnado pueda hacer las prácticas.

Paso 1: Preparación

Antes de que comience el curso, se debe reflexionar acerca de cómo poner en práctica el proyecto. Es conveniente modificar la programación del curso para fundamentar el aprendizaje basado en proyectos. Hay que diseñar una introducción con una selección de contenidos básicos que permita realizar un primer proyecto sencillo y luego otro proyecto más complejo, ambos en grupo.

Por suerte, la mayoría de aplicaciones para web se pueden simplificar como meros conjuntos de mantenimientos CRUD. Por eso, la primera aplicación propuesta fue un blog llamado blogBUSTER. Como segundo proyecto se eligió desarrollar una tienda virtual, llamada WildCart. Ambos proyectos con tecnología AJAX para aprender a sincronizar back-end y front-end. Es muy importante diseñar bien la base de datos normalizada y la API que se va a implementar en el back-end. También es muy importante establecer una estrategia para la autenticación y el control de la sesión. En esta experiencia se desarrollan dos sesiones de servidor con cookies y posteriormente autenticación mediante el uso del token JWT. Vinculado a la sesión hay que prever cuántos perfiles va a tener cada aplicación web y qué acciones se van a poder ejecutar en cada perfil. Se debe planificar cuántos mantenimientos CRUD se van a desarrollar y, si hay algún proceso transaccional, se debe especificar también. Por último, se ha de diseñar el mapa de rutas del front-end, la jerarquía de componentes enrutados y no enrutados, así como su comunicación y los servicios que se van a necesitar.

Temporalización
Temporalización

Paso 2: Inicio

Alumnado desarrollando
Alumnado desarrollando

En una primera fase del curso, en septiembre y principios de octubre, se nivela a las alumnas y alumnos de conocimientos iniciales para que puedan aprovechar las clases siguientes. En este momento se estudia vocabulario técnico de la materia y algunos conceptos técnicos básicos e importantes de manera somera, como por ejemplo la autenticación básica basada en sesiones de servidor, el acceso a datos en base de datos desde el servidor, las introducciones a los lenguajes Javascript, Typescript y JSON, los frameworks Bootstrap, Angular y Spring Boot, así como la tecnología AJAX para sincronizar el entorno cliente con el entorno servidor.

Paso 3: Proyectos grupales

Alumnado desarrollando en grupo
Alumnado desarrollando en grupo

En octubre se crea una primera aplicación que consiste en una autenticación básica AJAX. Luego esta autenticación se amplía para llegar a ser un blog simplificado, de una sola tabla en la base de datos. En esta experiencia, esa aplicación es un simple blog (blogBUSTER), implementado como un mantenimiento de una sola tabla. Mediante este desarrollo el alumnado aprende cómo se realiza un mantenimiento CRUD completo de una tabla, aislando la complejidad de añadir relaciones con otras tablas.

La aplicación web blogBUSTER es el trampolín para desarrollar un proyecto más complejo, WildCart, que es una aplicación web de tienda online con dos perfiles y múltiples mantenimientos. WildCart es un proyecto que cubre todos los aspectos del aprendizaje del oficio. A partir de la especificación del proyecto se dividen las tareas entre los grupos de estudiantes, que toman como referencia el mantenimiento ya realizado en blogBUSTER y lo replican en el nuevo proyecto. Para la gestión de versiones utilizamos Git sobre GitHUB. Los alumnos forkean y clonan el proyecto e integran en el proyecto principal mediante pull-requests, que equivalen a entregas. En esta fase, a finales de octubre, el alumnado ya debe estar trabajando en las tareas asignadas a los grupos e integrando dentro del proyecto WildCart. Mediante este paso se cumple el objetivo de desarrollar una experiencia de trabajo en grupo simulando el entorno empresarial y crear un código libre de referencia para los alumnos y alumnas, al tiempo que aprenden las bases del desarrollo de proyectos.

Lo normal es que el desarrollo de WildCart dure todo noviembre y sólo se vea interrumpido por el final de la primera evaluación, a finales de noviembre. Antes de la evaluación, todo el alumnado ya debe haber aportado código al proyecto varias veces trabajando en grupo. En diciembre es el momento de acabar el proyecto y llevar el mismo a un estado estable. Para ello es importante que el profesorado revise el estilo de codificación y refactorice el proyecto para que el código sea sencillo y uniforme, ya que los y las estudiantes van a tener este proyecto como referente para su proyecto personal.

Finalmente el software queda publicado con licencia MIT para que todo el alumnado pueda consultarlo y así aprender e incorporar partes del código del proyecto en sus propios proyectos personales.

Paso 4: Proyectos personales

Alumna desarrollando el proyecto individual
Alumna desarrollando el proyecto individual

Al contrario de otras especialidades de FP, donde las 40 horas del Módulo de Proyecto en segundo curso pueden ser suficientes para desarrollar un proyecto, los proyectos de aplicaciones web mínimamente viables cuestan de desarrollar entre 200 y 400 horas como mínimo. Por esta razón es conveniente adaptar las programaciones en los módulos, para incluir durante la segunda evaluación el inicio de los proyectos que en junio se presentarán ante el tribunal para superar el Módulo de Proyecto. La experiencia es un éxito, ya que el alumnado dispone de más tiempo de tutorización, a la vez que les sirve para superar los contenidos de los módulos de segundo curso, y se benefician de todo el código generado por el profesorado y por los compañeros y compañeras dentro del proyecto WildCart durante la primera evaluación, ya que, como hemos dicho, se publica con licencia MIT.

Entonces, a la vuelta de Navidad, el alumnado comienza el desarrollo de sus proyectos personales. En este período de tiempo comprendido entre los meses de enero y febrero, las alumnas y alumnos eligen un título de proyecto y una tecnología con la que van a desarrollarlo. Ahora el profesorado ya no desarrolla contenidos para toda la clase, sino que el aula se ha de convertir en un espacio de colaboración entre estudiantes y de tutorización individual por parte del profesorado. Esta fase dura aproximadamente hasta mediados de febrero, momento en el que los y las estudiantes exponen sus proyectos en clase delante de sus iguales. La actividad sirve además para practicar la presentación de estos proyectos delante del tribunal en el Módulo de Proyecto, que se realizará en junio, y también para adquirir destrezas comunicativas de cara al entorno laboral. El profesorado debe dar consejos acerca de cómo comunicar eficazmente y valorar el trabajo del alumnado.

En la experiencia, tras la evaluación, los alumnos y alumnas accedieron a las prácticas formativas en puestos de trabajo, logrando altos niveles de contratación. Finalmente, la mayoría de estudiantes presentaron sus proyectos en junio ante el tribunal y obtuvieron su título.

Evaluamos

Esquema de evaluación
Esquema de evaluación

Se recomienda evaluar los resultados de aprendizaje en dos fases: una primera fase objetiva mediante rúbricas e indicadores y una segunda fase más subjetiva mediante autoevaluación.

Evaluación con el profesor
Evaluación con el profesor

Primera fase: rúbricas e indicadores

En una primera fase el profesorado prepara una rúbrica con indicadores objetivos de los proyectos. Algunos de estos ítems pueden ser, por ejemplo, el número de tablas o colecciones en la base de datos, el número de end-points en la API, el número de líneas de código, el número de clases, la complejidad ciclomática, etc. De la rúbrica y los indicadores se obtiene un número objetivo para cada proyecto. Estos números se comparan y se asignan proporcionalmente las calificaciones. Los indicadores se pueden obtener con herramientas de inspección como Sonarqube.

Desgraciadamente este método no tiene en cuenta valores subjetivos como la usabilidad de la aplicación o el acabado estético. Tampoco tiene en cuenta factores sociales como por ejemplo la proactividad o la ayuda prestada a las compañeras y compañeros. Por ello esta calificación se tiene que tomar como una referencia objetiva en comparación con el grupo y debe ser ajustada a la alta o a la baja durante la segunda fase.

Segunda fase: autoevaluación

Para evaluar subjetivamente los proyectos se recomienda usar la autoevaluación. Para ello se recomienda usar la actividad Taller de Moodle o similar. Se trata de una herramienta configurable para que el alumnado realice la autoevaluación. Alternativamente se propone crear un cuestionario para captar los datos y una hoja de cálculo para tratarlos. El alumnado evalúa a todos los compañeros y compañeras, pero se les pide que tengan en cuenta factores que no se recogen en la primera fase, como la interacción entre iguales, la ayuda recibida, la estética de su proyecto, etc.

Evaluación del proyecto

El proyecto educativo se puede evaluar haciendo un seguimiento de los resultados obtenidos dentro de las calificaciones del Módulo de Proyecto. Este módulo se evalúa anualmente en la convocatoria de junio y diciembre con los proyectos presentados y es de esperar que las calificaciones mejoren respecto de cursos anteriores. Otro instrumento es la encuesta anónima que mide el índice de satisfacción de los y las estudiantes cuando termina el curso. La mayoría muestran aceptación, con sugerencias de mejora para aplicarlas en cursos posteriores. También es de interés tantear el grado de satisfacción de las empresas de prácticas con el alumnado del centro, que es muy alto y se refleja en el alto número de contrataciones. Por último, nuestro centro realiza encuestas de seguimiento de antiguos estudiantes y su grado de ocupación es de los más altos del centro.

Conclusiones

Desarrollo en grupo
Desarrollo en grupo

Por una parte, el éxito de esta experiencia viene dado por el alto nivel de los proyectos presentados en el Módulo de Proyecto. Cuando el alumnado accede en marzo a las prácticas en empresa, la mayoría han desarrollado el 80% de su proyecto personal, que presentarán al tribunal en junio, en el Módulo de Proyecto. Durante las prácticas, el alumno acaba el 20% restante del proyecto, escribe una memoria y genera un vídeo para la entrega. Nuestro mayor orgullo es exhibir un nivel alto en los proyectos realizados por los y las estudiantes, que coincide con niveles altos de aprendizajes adquiridos en su desarrollo.

Por otra parte, el profesorado ha de redefinir su rol. Tenemos una importante tarea de planificación del curso, especificando los proyectos para que sean asumibles por el alumnado. Al principio de curso es muy importante presentar la hoja de ruta a las alumnas y alumnos y que se comprometan con el estilo de aprendizaje. En las primeras semanas se debe partir de los conocimientos iniciales e ir afianzando contenidos muy básicos. A medida que pasa el tiempo, el profesorado cada vez utiliza menos tiempo de explicación, hasta que pasa a ejercer un papel de tutor de apoyo a los problemas puntuales que puedan surgir en sus proyectos personales durante la última parte de curso.

El proyecto WildCart generado en la experiencia queda para su estudio por parte del futuro alumnado de otros cursos, pero se aconseja al docente que en cada curso se vuelva a generar un proyecto de similar dimensión, ya que el aprendizaje consiste en recorrer el camino de desarrollar un proyecto.

La ventaja de disponer de un proyecto ya desarrollado como WildCart es que sirve para ejemplificar al alumnado de manera práctica cómo se resuelven los problemas que aparecen en el desarrollo de los proyectos. Se recomienda a las y los docentes del ciclo que creen su propio corpus de proyectos abiertos desarrollados en clase porque les otorgará una perspectiva histórica y un referente técnico para ejemplificar al alumnado.

Mantenimiento de usuarios en WildCart
Mantenimiento de usuarios en WildCart

¿Te animas?

A continuación, te ofrezco unas directrices para ayudarte a poner en marcha el proyecto:

Respecto a la planificación

  • El profesorado debe diseñar los proyectos bajo un enfoque constructivista de manera que sean comprensibles para los alumnos y alumnas, porque presentar un proyecto demasiado complejo es desmotivador. Al principio, con un proyecto simple y fácil de entender, los y las estudiantes pueden adquirir seguridad, aparte de una comprensión sólida de los conceptos fundamentales. Luego se deben abordar los contenidos más complejos y difíciles en un proyecto más avanzado.
  • Aprender a desarrollar una aplicación web AJAX desde cero es un reto integrador que requiere de conocimientos en muchos campos. En numerosas ocasiones hay que repasar conocimientos que se daban por aprendidos.
  • Es muy importante documentar, tanto para planificar como para reflexionar sobre el trabajo realizado. La documentación ayuda a colaborar. Por ejemplo, una correcta especificación de una API de back-end es necesaria para poder colaborar entre alumnado y profesorado que desarrollan el back-end y alumnado y profesorado que desarrollan el front-end.

Respecto a los proyectos grupales

  • La mayoría de desarrollos de proyectos se realizan en equipo. Se debe potenciar el desarrollo en grupo con metodologías ágiles simulando el entorno empresarial.
  • Una vez asignadas las tareas hay que dejar que el alumnado interaccione libremente para que haya transvase de conocimientos.
  • En la ejecución de los proyectos se sigue la estrategia de aprender el contenido de manera práctica cuando aparece, que es cuando la o el estudiante tiene la motivación de aprenderlo para aplicarlo. Si es necesario, se ha de parar el desarrollo en grupo de la clase y estudiar el problema todos juntos.
  • No importa tanto el nivel de acabado del producto ni la tecnología usada, sino el camino recorrido en el desarrollo del proyecto. Hay muchos aprendizajes tácitos que se adquieren desarrollando en grupo.
Alumno desarrollando
Alumno desarrollando

Respecto a los proyectos individuales

  • Durante la última parte de curso, cuando se desarrollan los proyectos personales, es cuando el alumnado más aprende porque se encuentra muy motivado. Y esa motivación aparece al dejarle elegir libremente el título del proyecto y la tecnología con que desarrolla el mismo. También motiva mucho al alumnado el ver que es capaz de ir construyendo partes de su proyecto que funcionan, volcando su creatividad en su proyecto personal sobre los conocimientos básicos que previamente ha adquirido. En el proyecto personal, cada estudiante profundiza en aprendizajes más focalizados según sus intereses o su motivación.
  • El profesorado no penalizamos la copia de código libre y su incorporación en los proyectos de los y las estudiantes, siempre que se comprenda cómo funciona el código que se está utilizando y cómo se relaciona con el resto del proyecto. Al contrario, incentivamos la incorporación de código de proyectos previos, que hace que los nuevos proyectos se simplifiquen y se acorte su desarrollo.
  • El alumnado técnicamente más avanzado suele cambiar de tecnologías, mientras que el resto tienden a usar la misma que se ha empleado en los dos primeros periodos del curso, porque se sienten más seguros. La ventaja es que independientemente de la tecnología elegida, cada estudiante puede profundizar en aprendizajes específicos según sus intereses o su motivación. Pensemos que la tecnología evoluciona tan rápido en el desarrollo web que lo importante no es saber una u otra tecnología, sino la capacidad de mantenerse tecnológicamente actualizado por sí mismo.
  • Durante el desarrollo de los proyectos individuales el profesorado pasa a ejercer un papel de tutorización, orientando al alumnado en el desarrollo de su proyecto personal mediante consejos y ayudándole a solucionar sus problemas técnicos. Pero, a la vez, debemos evitar una excesiva dependencia del alumnado respecto del profesorado: exigimos al alumnado que antes de pedir ayuda al docente haya intentado buscar soluciones con tenacidad.
  • Es conveniente plantear revisiones obligatorias (milestones) de los proyectos cada dos semanas al menos, para que no haya sorpresas.

Materiales complementarios

Alumno desarrollando
Alumno desarrollando

He diseñado una página web dentro de mi cuenta de GitHub para mantener vivo el proyecto BLASTER. Como estoy continuamente modificando proyectos y añadiendo software he decidido centralizar la información del estado del proyecto en esa página. Puedes acceder a la misma mediante cualquiera de estos dos enlaces:

https://rafaelaznar.github.io/blaster.md

https://github.com/rafaelaznar/rafaelaznar.github.io/blob/master/assets/blaster.md

Todos los programas en BLASTER están publicados con licencia MIT y puedes usarlos con tu alumnado de la manera que quieras para que aprendan. Puedes colaborar con la mejora de los proyectos publicados en GitHub o diseñar y construir tus propios proyectos con el alumnado.

La filosofía BLASTER no es crear tutoriales ni asistentes, sino proyectos mínimamente viables construidos en clase y revisados donde las y los docentes tengamos una base de casos de uso tecnológico para ayudar a nuestro alumnado.

Si quieres unirte a BLASTER, crea la página web de tu proyecto educativo, publica los proyectos de clase con licencia MIT y te enlazaré en la página de BLASTER para crear una red. Estoy a tu disposición para resolver dudas, orientar o colaborar en proyectos de desarrollo web didácticos.

Herramientas digitales empleadas en la experiencia:

  • Sistema operativo.
  • Herramienta para proyectar la pantalla en ordenadores del alumnado.
  • Libre Office. Paquete de software de oficina.
  • Gestor de versiones.
  • Visual Studio Code. IDE para la Programación del entorno cliente y servidor.
  • Programación del entorno servidor.
  • Programación del entorno cliente.
  • Lenguaje de programación.
  • Spring Boot. Framework para el desarrollo Java en entorno servidor.
  • Servidor web HTTP de páginas web.
  • Sistema gestor de bases de datos.
  • Lenguaje de programación.
  • phpMyAdmin. Administrador de MySQL a través de páginas PHP.
  • Navegador web y entorno de herramientas de inspección.
  • Mozilla Firefox. Navegador y entorno de herramientas de inspección.
  • Plataforma de desarrollo colaborativo para alojar proyectos utilizando el sistema de control de versiones Git.
  • Gestión de entregas de ejercicios y realización de tests.
  • Contenedor de información para el alumno.
  • Google Drive. Control de tareas mediante hoja de cálculo.
  • Google meet. Videoconferencias.
  • OBS studio. Captura de video en el escritorio.
  • Tratamiento de vídeo.
  • Tratamiento de vídeo.

Producción final creada por el alumnado:

Se trata de la aplicación web WildCart, una tienda virtual. Su código fuente se puede consultar y descargar en:

Así pues,la experiencia BLASTER y la creación de la tienda virtual WildCart se usó en múltiples proyectos del alumnado en el Módulo de Proyectos. A continuación se presentan algunos de los proyectos:

  • Bookaneros, de Jose Eulogio Primo Gil. Este proyecto consiste en el desarrollo de una aplicación web, cuyo principal objetivo es dar una opción y la posibilidad a los amantes de la lectura de tener un recurso para poder buscar información, dar a conocer sus opiniones a los demás usuarios, valorar sus libros favoritos y los no tanto. Además de dar la oportunidad a la entidad o cliente que lo adquiera de tener en sus manos una aplicación web para administrar toda la información sobre libros y usuarios de una forma sencilla y cómoda. Puedes acceder a la memoria del proyecto aquí.
  • Sheyras, de Jose Vicente Peña Tatay. Sheyras es un foro similar a Reddit y Stackoverflow donde los usuarios pueden interactuar escribiendo entradas, votando o comentando. Puedes acceder a la memoria del proyecto aquí.
  • LittleAdopt, de Elen Mikayelyan. LittleAdopt es una aplicación web donde los usuarios podrán adoptar animales rescatados y cuidados. La aplicación contiene interfaz de usuario y de administrador, donde el admin se encargará de asignar a un animal un adoptante. Puedes acceder a la memoria del proyecto aquí.
  • The Reef Shop, de Antonio José Gil Martínez. Es aplicación web que puede ser descrita principalmente como una tienda online para la venta de peces. Puedes acceder a la memoria del proyecto aquí.
  • HouseMania, de Pere Villanueva Peyró. Es una aplicación web para la gestión de viviendas de una inmobiliaria, la cual se puede utilizar para buscar viviendas y ponerte en contacto con los vendedores. Puedes acceder a la memoria del proyecto aquí.
  • EMATCH, de José Francisco Santos Sierra. Es una plataforma web desarrollada como gestor de partidas competitivas de League of Legends externo a la plataforma oficial. Puedes acceder a la memoria del proyecto aquí.
  • Reach Your Goals, de Héctor Bargues Raga. Web de reservas y compra de servicios o clases de un gimnasio. Puedes acceder a la memoria del proyecto aquí.