Proyecto final multimedia

Ejercicio

Requisitos básicos

El proyecto final que se propone consiste en aplicar los conceptos vistos a lo largo del curso para construir con HTML5, CSS3 y JavaScript una presentación multimedia interactiva en forma de aplicación web. La presentación debe estar estructurada en secciones (posiblemente, pero no necesariamente, distribuidas entre diferentes páginas web) y, además:
  • Debe ofrecer al usuario al menos un menú de opciones principal que permita acceder a las diferentes secciones de la presentación, quizá junto a otros menús que en cada sección faciliten el acceso a sus subsecciones, si es que las hay.
  • Debe incluir al menos una galería de imágenes y al menos una galería de vídeos.
  • Debe hacer uso de archivos de audio, y no sólo como eco sonoro de eventos de ratón en las galerías de imágenes y vídeos.
  • Debe hacer uso de elementos canvas para mostrar contenido multimedia transformado o combinado con diversos tipos de elementos gráficos.
La presentación debe ser sobre un tema elegido por los autores del trabajo. Por ejemplo, se puede construir una biografía interactiva multimedia sobre algún personaje, ya sea una persona real (como un escritor, un director de cine, un cantante o un actor) o un personaje de ficción. También puede tratarse de la historia de un colectivo (como un grupo musical, un equipo deportivo o una organización). Y podéis considerar biografía e historia más como sugerencias que como una restricción: si encontráis cualquier otro tema interesante para vuestro proyecto multimedia, proponédselo a vuestro profesor de prácticas.
La galería de imágenes y la galería de vídeos deben cumplir los requisitos del primer y segundo trabajos evaluables del curso, y se aceptará utilizar en ellas dichos trabajos adaptando el contenido que haga falta para adecuarlo al tema que se haya elegido para de la presentación [1].

Otros aspectos valorables

Se valorará muy positivamente la utilización de JavaScript y de los conceptos estudiados a lo largo del curso para enriquecer el nivel de interactividad de la presentación multimedia. Aunque se aceptarán y valorarán también otras propuestas que cubran esos objetivos, en particular se propone lo siguiente:
  • Añadir a la galería de vídeos una nueva funcionalidad que permita al usuario retroceder a un instante anterior de la reproducción haciendo clic en la imagen del fotograma correspondiente a ese instante. La zona de selección de fotogramas debe tener capacidad para contener al menos seis fotogramas, que podéis distribuir como prefiráis (por ejemplo, en forma matricial, en fila o en columna). Durante la reproducción del vídeo activo, se copiará en ella un fotograma cada treinta segundos. Cuando esté llena, el nuevo fotograma reemplazará al más antiguo. Y cuando se vaya a cambiar el vídeo activo, antes se vaciará la zona de selección de fotogramas.
  • Permitir al usuario aumentar y disminuir la frecuencia con la que se copian fotogramas en la zona de selección de la funcionalidad anterior (por defecto, se hará cada treinta segundos).
No se exige preparar la presentación para funcionar en más de un navegador, pero sí que se debe probar con varios navegadores. Basta con elegir uno entre Chrome, Firefox y Opera, garantizar que todo funciona correctamente con él, e indicar qué aspectos se ha detectado que no funcionan en cada uno de los otros dos (o si todo funciona correctamente). Se debe especificar también la versión utilizada de cada navegador, que debe ser de 2011 o posterior.
Por otra parte, se valorará negativamente cualquier empleo inadecuado de los lenguajes implicados (HTML, CSS y JavaScript) y, en particular:
  • Omitir <!doctype html> o elementos estructurales importantes en HTML.
  • Escribir código HTML no válido (compruébese con html5.validator.nu).
  • Utilizar HTML para controlar aspectos visuales que deberían especificarse en una hoja de estilo.
  • No utilizar manejadores de eventos cuando correspondería hacerlo.
  • Sangrar las líneas de código HTML, CSS o JavaScript sin ningún criterio, de forma que se dificulte la comprensión de ese código en vez de facilitarla resaltando su estructura.
  • Mezclar código de diferente naturaleza en un mismo fichero, es decir, escribir código CSS o JavaScript en ficheros HTML.

Ubicación de la presentación

Todos los ficheros de la presentación, excepto los vídeos a los que se acceda remotamente, deben ubicarse dentro de un directorio ProyectoFinalMultimedia en la cuenta personal UJI de alguno de los autores del trabajo, con los permisos adecuados y en una ubicación que permita a la presentación quedar públicamente accesible en un URL del dominio www4.uji.es [2].

Grupos de trabajo

La carga de trabajo que se propone está pensada para que el proyecto sea llevado a cabo por dos estudiantes que hayan seguido el curso y trabajen cooperativamente. Quienes quieran hacerlo individualmente deberán estar dispuestos a asumir la correspondiente sobrecarga de trabajo. El nivel de exigencia será el mismo para proyectos individuales o por parejas. No se aceptarán proyectos presentados por más de dos autores. Por otra parte, todos los miembros del grupo deberán poder explicar cualquier aspecto del proyecto presentado y ser capaces de modificarlo en el sentido que se les pida en una eventual entrevista de control con el profesor de prácticas.

Evaluación

Puntuación

Con este proyecto, en principio, cada alumno puede obtener hasta 7 puntos que se sumarán a las notas de los dos trabajos evaluables propuestos durante el curso para obtener su nota de prácticas NP (véase el temario de la asignatura en el LLEU, sección "Evaluación"). Si el resultado de la suma es mayor que 10, la nota NP será 10.
Por otra parte, para no imposibilitar que alcance el sobresaliente en actas un hipotético alumno que, aun sin haber estado siguiendo el curso durante los trabajos evaluables anteriores, se haga acreedor de la máxima nota tanto en este proyecto como en el examen final de teoría, la fórmula concreta con la que se calculará la nota de prácticas será
NP = mín(10, máx(TE1+TE2+PFM, 8,5×(PFM/7)))
donde
  • 0 ≤ TE1 ≤ 2 (primer trabajo evaluable)
  • 0 ≤ TE2 ≤ 3 (segundo trabajo evaluable)
  • 0 ≤ PFM ≤ 7 (proyecto final multimedia)
Esta fórmula se aplicará tanto en primera convocatoria como, si ha lugar, en segunda. En ambos casos, las notas TE1 y TE2 hacen referencia a los trabajos entregados, respectivamente, en noviembre y diciembre de 2011.
Los 7 puntos que pueden obtenerse como máxima nota en este proyecto se desglosan como sigue:
  • Hasta 5 puntos por los requisitos básicos:
    • Hasta 1 punto por una galería de imágenes como la que se pedía en el primer trabajo evaluable.
    • Hasta 1,5 puntos por una galería de vídeos como la se pedía en el segundo trabajo evaluable.
    • Hasta 1,5 puntos por utilizar elementos canvas para añadir nuevas características a la visualización de contenido multimedia [3].
    • Hasta 1 punto por otros aspectos relacionados con el acabado de la presentación: estructura, menús, audio adicional...
  • Hasta 2  puntos por otros aspectos que se valoren positivamente:
    • Hasta 1,5 puntos por añadir a la galería de vídeos la funcionalidad básica de navegación por fotogramas propuesta.
    • Hasta 0,3 puntos por completarla con la posibilidad de modificar la frecuencia de copia de fotogramas a la zona de selección.
    • Hasta 0,2 puntos por probar la presentación en varios navegadores.
    • Hasta 1 punto por otras formas (distintas de las explícitamente propuestas en este enunciado) de enriquecer mediante JavaScript y el uso de elementos canvas el nivel de interactividad de la presentación multimedia, siempre que con ello no se superen los 2  puntos de este bloque de puntuación.
Y, obviamente, no respetar escrupulosamente cualquier requisito del trabajo (técnico o formal) no contemplado en este desglose supondría una penalización en la calificación que intentaríamos ajustar a la magnitud de la falta.

Entrega

El plazo de entrega finaliza a las 23.55 del próximo 24 de enero, martes, para la primera convocatoria ordinaria. Para la segunda, el plazo finalizará el sábado 30 de junio de 2012.
Lo que debéis hacer en cada caso antes de que concluya el correspondiente plazo es lo siguiente
  1. Comprobad una vez más el correcto funcionamiento de la presentación, mediante el correspondiente URL de www4.uji.es, en el navegador que hayáis elegido.
  2. Descargad y cumplimentad este fichero de texto: datos-entrega-3.txt.
  3. Copiad el fichero datos-entrega-3.txt debidamente cumplimentado a vuestro directorio ProyectoFinalMultimedia antes de abordar el siguiente paso.
  4. Empaquetad como ZIP o TGZ el directorio ProyectoFinalMultimedia (recordad: incluyendo datos-entrega-3.txt) y ya no volváis a tocar ese directorio hasta que finalice el proceso de evaluación.
  5. Entregad ProyectoFinalMultimedia.zip o ProyectoFinalMultimedia.tgz del modo elegido por vuestro profesor, que es el siguiente:

Entrevista de control

Finalmente, vuestro profesor de prácticas podrá pediros una entrevista para asegurarse de que no sólo sois los autores de lo que habéis entregado, sino que entendéis perfectamente todo lo que habéis hecho.
Nota [1]: También se aceptará utilizar JavaScript en la galería de imágenes, aunque en el primer trabajo no se permitiera, en caso de que se desee añadirle alguna nueva funcionalidad o, por ejemplo, conseguir que se comporte de forma correcta independientemente del número de imágenes incluidas en el HTML.
Nota [2]: No obstante, si creéis que existe alguna razón justificada para que vuestro proyecto en particular no sea público, exponed el caso a vuestro profesor de prácticas no más tarde del viernes 20 de enero.
Nota [3]: Por ejemplo, una forma de contribuir a este apartado de la puntuación sería dotar a la galería de vídeos de botones que permitieran decidir en cada momento si la reproducción del vídeo activo se visualiza tal cual (en color), como en un televisor en blanco y negro (niveles de gris) o con apariencia de foto antigua (tonalidades color sepia).