Información general


  • Tipo de asignatura: Obligatoria
  • Coordinador: Maddalena Fedele
  • Trimestre: 2
  • Créditos: 4
  • Profesorado:

Idiomas de impartición


  • Català

Descripción


La asignatura "Fundamentos de Programación" se enmarca dentro del área Multimedia del Grado en Medios Audiovisuales. En esta asignatura se introduce al alumno en el aprendizaje de un lenguaje de programación que le permitirá escribir aplicaciones web multimedia con una interacción del usuario aumentada.

Esta asignatura es la continuación natural de la precedente "Sistemas Multimedia" cursada en el primer trimestre.

El lenguaje de programación que se utiliza es el javascript, lenguaje estándar en la web. Se ven los fundamentos de programación para poder hacer pequeños cálculos, leer y guardar información que ha aportado el usuario y crear transiciones y animaciones con los objetos de la interfaz gráfica de usuario. Se trabaja la programación en respuesta a eventos que ha provocado el usuario con el teclado y el ratón.

Resultados de aprendizaje


A nivel general, esta asignatura contribuye a los siguientes resultados de aprendizaje (RA) especificados para la materia a la que pertenece (Multimedia):

  • (RA1) Crear pequeños programas en javascript para: validar formularios, recoger datos del usuario y almacenar los datos.
  • (RA2) Crear pequeñas aplicaciones multimedia interactivas en la web: juegos, reproductor de medios, animaciones, etc.

A un nivel más concreto, al finalizar el curso, el estudiante debe ser capaz de:

  • (RAC1) Crear pequeños programas en javascript que recojan y validen los datos del usuario y, posteriormente, hagan unos cálculos con estos datos y se presenten los resultados al usuario de forma adecuada (vinculado a RA1).
  • (RAC2) Escribir programas en javascript que utilizan objetos para almacenar la información (vinculado a RA1).
  • (RAC3) Utilizar el lenguaje javascript y la librería jQuery para dotar a las páginas web de animación e interactividad utilizando el paradigma de programación en respuesta a eventos (vinculado a RA2).
  • (RAC4) Crear pequeñas aplicaciones multimedia interactivas en la web. La interacción más importante será el cambio de la posición de algunos elementos de la interfície gráfica de usuario (vinculado a RA2).
  • (RAC5) Analizar los requerimientos de usabilidad y accesibilidad, recojiendo datos e información de webs similares, con el objetivo de optimizar el diseño de la aplicación y, justificar, reflexivamente, la idoneidad del diseño realizado (vinculado a G3)

 

Metodologia de trabajo


Las horas de aprendizaje dirigido consisten:

• clases teóricas (grupo grande) en las que el profesorado propone y resuelve un problema de programación web y hace una exposición para introducir los contenidos teóricos necesarios para su resolución (learning by example). Convenientemente intercalado y sin previo aviso, se realizan actividades de seguimiento individuales o en grupos dentro de la clase. Estas actividades suelen ser pequeños problemas o ejercicios de comprensión de los contenidos que se están presentando. El alumno dispone y utiliza como material de apoyo, los apuntes de la asignatura que el profesorado pone a su disposición desde el primer día, tanto en formato impreso como en el campus virtual. Esto, permitirá al alumno ir a clase habiendo hecho una lectura previa de los temas y, en clase, concentrarse en las explicaciones del profesor, tomando las notas que crea oportunas para un estudio posterior. La dedicación por parte del estudiante será: 3h/set. x 10set. = 30 horas totales.


• prácticas (grupo pequeño), en laboratorios que disponen de los equipamientos necesarios para la realización de la misma, básicamente ordenadores. Los alumnos se agrupan de dos en dos y comparten el equipamiento y nota de la práctica.La dedicación por parte del estudiante será: 1h/set. x 10set. = 10 horas totales.


Adicionalmente, están contempladas unas actividades dirigidas que consisten en explicaciones, más o menos personalizadas, de las correcciones de las diferentes actividades realizadas por los estudiantes, básicamente los exámenes parciales y las prácticas. La dedicación por parte del estudiante será 5 horas, aproximadament.


Dentro de las horas de aprendizaje autónomo se consideran las horas que el alumno dedica a hacer una lectura previa de los apuntes para la clase teórica correspondiente, realización de ejercicios y trabajos propuestos fuera del aula, estudio de manuales necesarios para poder hacer las prácticas, redacción de los informes de las prácticas y trabajos, resolución de cuestionarios de autoaprendizaje, estudio y preparación de los exámenes parciales, etc. La dedicación por parte del estudiante será 40 horas totales, aproximadamente.

Contenidos


Título contenido 1: Programación básica en javascript.

Descripción:

En este contenido se trabaja:

1.1. ¿Qué es un programa?
1.2. Estructura de un programa javascript. Concepto de función.
1.3. Entrada y salida de datos.
1.3.1. E/S con ventanas: prompt, confirm / alert
1.3.2. E/S con formularios.
1.4. Tipo de datos: números, strings y booleanos.
1.5. Valores de los datos.
1.5.1. Variables: creación, acceso y modificación.
1.5.2. Constantes y literales: creación y acceso.
1.5.3. Ámbito de los datos: local y global.
1.6. Expresiones y operadores.
1.6.1. Operadores aritméticos, lógicos y relacionales.
1.6.2. Evaluación de expresiones. Orden de las operaciones.
1.6.3. Objeto Math
1.7. Estructuras de control de la ejecución.
1.7.1. Estructura secuencial.
1.7.2. Estructura condicional: if ..., if ... else ..., if ... else if ...
1.7.3. Estructura iterativa: for
1.8. Estructuración del programa en funciones.
1.8.1. Evitar escribir código repetido.
1.8.2. Paso de parámetros y retorno de valores.
1.9. Ejercicios.

Actividades vinculadas:

actividad 1: Entorno de desarrollo web.
actividad 2: Juego de adivinar un número.
actividad 5: Examen primer parcial.
actividad 6: Examen final.


Título contenido 2: Colecciones de datos.

Descripción:

En este contenido se trabaja:

2.1. Objetos.
2.1.1. Propiedades y métodos
2.1.2. Creación de objetos.
2.1.3. Acceso a las propiedades y métodos
2.3. Objeto String
2.4. Objeto Date
2.5. Ejercicios

Actividades vinculadas:

actividad 3: Aplicación con selección del usuario.
actividad 4: Juego interactivo.
actividad 5: Examen primer parcial.
actividad 6: Examen final.
 

Título contenido 3: HTML Dinámico (DHTML).

Descripción:

En este contenido se trabaja:

3.1. Modelo de Objetos del Documento (DOM).
3.2. Introducción a la librería jQuery.
3.3. Acceso y modificación del DOM con jQuery.
3.3.1. Selectores: básicos, avanzados y filtros.
3.3.2. Añadir, cambiar y borrar elementos HTML.
3.3.3. Leer y cambiar propiedades CSS
3.3.4. Efectos jQuery: mostrar/ocultar, animaciones.
3.4. Programación en respuesta a eventos del usuario.
3.4.1. Modelo de eventos básico.
3.4.2. Obtención de información del evento (objeto Event)
3.4.3. Modelo de eventos de jQuery.
3.5. Audio y video interactivo.
3.6. Juegos interactivos.
3.7. Temporización: setInterval () y setTimeout ()
3.8. Colisiones.
3.9. Ejercicios.

Actividades vinculadas:

actividad 3: Test de autoevaluación.
actividad 4: Juego interactivo.
actividad 6: Examen final.

Actividades de aprendizaje


Con el objetivo de recoger evidencias del logro de los resultados de aprendizaje esperados se realizarán 6 actividades con carácter de evaluación.

Para superar (aprobar) las actividades evaluativas, los estudiantes deberán demostrar:

  • Que han adquirido los conocimientos teóricos, prácticos y metodológicos relativos a los contenidos de la asignatura y que su comprensión les permite llevarlos a la práctica [MECES-2 punto a, punto b]
  • Que pueden desarrollar soluciones a problemas que, si bien similares a otros vistos anteriormente, presentan aspectos que son nuevos [MECES-2 punto d]

En relación a la competencia básica asignada a la asignatura, ésta queda cubierta especialmente en cuanto a los aspectos que se explicitan:

  • G3 (recopilar e interpretar datos e informaciones para fundamentar sus juicios y en su caso reflexionar sobre aspectos sociales, científicos o éticos [MECES-2 punto c]). Los estudiantes deben demostrar:
    • que ante diferentes soluciones a un problema, sean capaces de recopilar datos e información de ejemplos similares que les permita decidir, justificadamente, qué solución es la óptima.
    • que se tienen en cuenta el grado de usabilitat y accesibilidad de la aplicación, recogiendo datos empíricos, a fin de decidir optimizaciones del diseño de la aplicación.

Todas las actividades de la asignatura contribuyen al logro progresivo de la competencia específica de la asignatura, más concretamente, en los siguientes aspectos:

  • E1: Programar las interfaces gráficas de portales web estáticos y aplicaciones interactivas siguiendo criterios de usabilidad y accesibilidad.

 

Título de la actividad 1: Entorno de desarrollo web.

Descripción general:

Práctica de laboratorio. Realización en grupo de dos personas.

En esta actividad se presenta el entorno de desarrollo web que se usará en la asignatura. El alumno se familiarizará en la edición del programa así como la prueba y depuración del mismo. Se utilizarán las herramientas de desarrollo consola (para ver los errores de programación), depurador (para ejecutar paso a paso el programa) y el inspector de variables (para ver la traza del programa).

Material de soporte:

Enunciado de la práctica con el código fuente del programa que hay que escribir, probar y depurar.

El software necesario es: Adobe Dreamweaver o JetBrains WebStorm.

Entregable y vínculos con la evaluación:

El estudiante, entrega a través de la intranet, la página web con el programa implementado para que se pueda probar en el navegador.

El resultado de la actividad tendrá una ponderación de 6% correspondiente a la calificación final.

Objetivos específicos:

Al finalizar la actividad el estudiante debe ser capaz de:

• usar el entorno de desarrollo para escribir, probar y depurar un programa web escrito en javascript.

Vinculación con los resultados de aprendizaje y competèncias de la asignatura:

  • Esta actividad es una evidencia de los resultados de aprendizaje: RAC1 y RAC2.
  • Esta actividad contribuye al logro de la competencia específica E1.

 

Título de la actividad 2: Aplicación con E/S textual.

Descripción general:

Práctica de laboratorio. Realización en grupo de dos personas.

Hay que desarrollar un programa web en el que el usuario aporta información (texto y números) de forma textual i la aplicación hará unos cálculos e informará al usuario de los resultados obtenidos.

Material de soporte:

Enunciado de la práctica.

El software necesario es: Adobe Dreamweaver o JetBrains WebStorm.

Entregable y vínculos con la evaluación:

El estudiante, entrega a través de la intranet, la página web con el programa implementado para que se pueda probar en el navegador.

El resultado de la actividad tendrá una ponderación de 6% correspondiente a la calificación final.

Objetivos específicos:

Al finalizar la actividad el estudiante debe ser capaz de:

• Desarrollar un programa web en javascript que recoja información aportada por el usuario y haga una serie de cálculos informando al usuario de sus resultados.

Vinculación con los resultados de aprendizaje y competèncias de la asignatura:

  • Esta actividad es una evidencia de los resultados de aprendizaje: RAC1 y RAC2.
  • Esta actividad contribuye al logro de la competencia específica E1.

 

Título de la actividad 3: Aplicación con selección del usuario.

Descripción general:

Práctica de laboratorio. Realización en grupo de dos personas.

Hay que desarrollar un programa web que facilite al usuario un test de autoevaluación o encuesta. Se dispondrán de 10 preguntas con 4 posibles respuestas (sólo una de buena) que el usuario deberá responder una a una. Se dará la posibilidad de cambiar las respuestas hasta dar por terminado el test. Una vez el usuario da por terminado el test, el programa informa de los resultados correctos e incorrectos así como la nota alcanzada. Una pregunta respuesta mal, resto 1/3 de punto.

La interfaz gráfica del usuario será a través de un formulario que habrá que validar.

Material de soporte:

Enunciado de la práctica.

El software necesario es: Adobe Dreamweaver o JetBrains WebStorm.

Entregable y vínculos con la evaluación:

El estudiante, entrega a través de la intranet, la página web con el programa implementado para que se pueda probar en el navegador.

El resultado de la actividad tendrá una ponderación de 6% correspondiente a la calificación final.

Objetivos específicos:

Al finalizar la actividad el estudiante debe ser capaz de:

• Desarrollar un programa web en javascript que gestione colecciones de datos en objetos (preguntas y respuestas del test de autoevaluación), pida información al usuario a través de formularios, valide los datos aportados por el usuario y haga una serie de cálculos informando al usuario de sus resultados.

Vinculación con los resultados de aprendizaje y competèncias de la asignatura:

  • Esta actividad es una evidencia de los resultados de aprendizaje: RAC2 y RAC3.
  • Esta actividad contribuye al logro de la competencia específica E1 i contribuye a evaluar la competencia básica G3.

 

Título de la actividad 4: Juego interactivo.

Descripción general:

Práctica de laboratorio. Realización en grupo de dos personas.

Deberá completarse el código de un programa javascript (+ jQuery) que permita implementar un juego interactivo. La interacción de los usuarios será a través del teclado o ratón. Al inicio del juego, el programa presentará un menú de configuración del juego. La interfaz debe adaptarse a estos valores de configuración que ha entrado el usuario.

Material de soporte:

Enunciado de la práctica. Código del esqueleto del programa y HTML + CSS de la interfaz gráfica de usuario.

El software necesario es: Adobe Dreamweaver o JetBrains WebStorm.

Entregable y vínculos con la evaluación:

El estudiante, entrega a través de la intranet, la página web con el programa implementado para que se pueda probar en el navegador.

El resultado de la actividad tendrá una ponderación de 12% correspondiente a la calificación final.

Objetivos específicos:

Al finalizar la actividad el estudiante debe ser capaz de:

• Desarrollar un programa web en javascript que interaccione con el usuario a través del teclado o ratón, pida información al usuario a través de formularios y adapte la interfaz gráfica de usuario de acuerdo con los datos aportados por el usuario.

Vinculación con los resultados de aprendizaje y competèncias de la asignatura:

  • Esta actividad es una evidencia de los resultados de aprendizaje: RAC2, RAC3 y RAC4.
  • Esta actividad contribuye al logro de la competencia específica E1 i contribuye a evaluar la competencia básica G3.

 

Título de la actividad 5: Examen parcial.

Descripción general:

Examen parcial individual.

Se realiza un examen donde se evalúa los conocimientos de los contenidos 1 y 2. Esta prueba consta de una parte de cuestiones sobre conceptos asociados a los objetivos de aprendizaje de la asignatura en cuanto al conocimiento y comprensión, y de un conjunto de ejercicios de aplicación. El estudiante dispone de 2 horas para la realización de la prueba dentro de su horario habitual de clase. Una vez realizado el examen, el profesor explicará la resolución en el grupo.

Material de soporte:

Enunciado de la prueba.

Entregable y vínculos con la evaluación:

Resultado de la prueba.

El resultado de la actividad tendrá una ponderación de 21% correspondiente a la calificación final.

Vinculación con los resultados de aprendizaje y competèncias de la asignatura:

  • Esta actividad es una evidencia de los resultados de aprendizaje: RAC1 y RAC2.
  • Esta actividad contribuye al logro de la competencia específica E1

 

Título de la actividad 6: Examen final.

Descripción general:

Examen final individual.

Se realiza un único examen final donde se evalúa los conocimientos de los contenidos 1, 2 y 3 . Esta prueba consta de una parte de cuestiones sobre conceptos asociados a los objetivos de aprendizaje de la asignatura en cuanto al conocimiento y comprensión, y de un conjunto de ejercicios de aplicación. El estudiante dispone de 3 horas para la realización de la prueba en el periodo de exámenes finales establecido por el Jefe de estudios. Una vez realizado el examen, el profesor publicará la resolución.

Esta actividad es una evidencia de los resultados de aprendizaje: RA1, RA2, RA3 y RA4.

Material de soporte:

Enunciado de la prueba.

Entregable y vínculos con la evaluación:

Resultado de la prueba.

El resultado de la actividad tendrá una ponderación de 49% correspondiente a la calificación final.

Vinculación con los resultados de aprendizaje y competèncias de la asignatura:

  • Esta actividad es una evidencia de los resultados de aprendizaje: RAC1, RAC2, RAC3 y RAC4.
  • Esta actividad contribuye al logro de la competencia específica E1

Sistema de evaluación


La calificación final se obtiene de la siguiente ponderación de las calificaciones parciales:

NotaFinal = 0.7 NotaTeoría + 0.3 NotaPrácticas

NotaPrácticas se obtiene con la media aritmética de las tres actividades de carácter práctico realizadas durante el curso. La actividad 4 pondera el doble que las otras actividades prácticas.

La NotaTeoría se obtiene con la realización de dos exámenes,
                  NotaTeoría = 0.3 NotaParcial + 0.7 NotaExamen_Final

En el NotaParcial_1 evalúa los conocimientos de los contenidos 1 y 2. Esta prueba tienen una duración de 1.5h y se realizan dentro del horario de clase, a mitad de trimestre (semana 5, aproximadamente).

En el NotaExamen_Final es un único examen donde se evalúa todos los conocimientos de los contenidos de la asignatura. Tendrá una duración de 3 horas, dentro del periodo de exámenes finales que establece el Jefe de Estudios. Es necesaria una nota mínima de 5 en este examen para poder aprobar la asignatura.

Si finalmente, el alumno no ha obtenido una NotaFinal superior o igual a 5.0, el alumno podrá presentarse a un único examen de recuperación de NotaTeoria (70% de la NotaFinal), dentro del periodo de exámenes de recuperación que establece el Jefe de Estudios. Los alumnos que tengan una calificación final de "No Presentado" en la primera convocatoria, no podrán presentarse al examen de recuperación.Es necesaria una nota mínima de 5 en este Examen de Recuperación" para poder aprobar la asignatura.
 
Normas de realización de las actividades:

Las actividades "práctica de laboratorio" se realizarán en grupos de dos personas. Si no se realiza alguna de las actividades de prácticas, se considerará no puntuada. El estudiante obtendrá una calificación de No presentado a NotaPrácticas si hay alguna actividad de prácticas no puntuadas.

La realización de las actividades prácticas es obligatoria. Es decir, una calificación de "No presentado" a NotaPrácticas, no permitirá aplicar la ponderación con la NotaTeoría y, por tanto, la calificación final de la asignatura será de "No Presentado".

Bibliografía


Básica

David Sawyer McFarland. Javascript & jQuery. The missing manual. (2nd edition). O’Reilly Media. ISBN: 978-1-4493-9902-3

JavasScript Guide. MDN. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide

Mario Rubiales Gómez. Curso de Desarrollo Wev: HTML, CSS y Javascript. Grupo Anaya Publicaciones Generales, 2018. ISBN-10: 8441539391

 


Complementaria

Edgar d'Andrea Font. Javascript. Curso de Programación. Info Book Ediciones. ISBN: 978-84-15033-01-1

Natalie MacLees. jQuery for designers. Packt Publishing. ISBN: 978-1-84951-670-9