104123 - FONAMENTS DE PROGRAMACIÓ

Tipus d'assignatura: Obligatòria

Coordinador: Rafael Suárez Gómez

Trimestre: Segon trimestre

Crèdits: 4

L'assignatura "Fonaments de Programació" s'emmarca dins de l'àrea Multimèdia del Grau en Mitjans Audiovisuals. En aquesta assignatura s'introdueix als estudiants en l'aprenentatge d'un llenguatge de programació que li permetrà escriure aplicacions web multimèdia amb una interacció de l'usuari augmentada.

Aquesta assignatura és la continuació natural de la precedent "Sistemes Multimèdia" cursada en el primer trimestre.

El llenguatge de programació que s'utilitza és el javascript i en concret la llibreria P5.js amb l'objectiu de facilitar l'escriptura dels programes. Es veuen els fonaments de programació per poder fer petits càlculs, llegir i guardar informació que ha aportat l'usuari i crear transicions i animacions amb els objectes de la interfície gràfica d'usuari. Es treballa la programació en resposta a esdeveniments que ha provocat l'usuari amb el teclat i el ratolí.

Els diversos conceptes treballats en l'assignatura estan pensats per capacitar a l'estudiant en l'aprenentatge i utilització dels conceptes bàsics de la programació.

A nivell general, aquesta assignatura contribueix al resultat d'aprenentatge especificat per a la matèria a la qual pertany (Multimèdia i Animació):

• L'estudiant o estudianta ha de ser capaç de crear petites aplicacions multimèdia interactives a la web: jocs, reproductors de mèdies, animacions, etc.

A un nivell més concret, en acabar l'assignatura l'estudiant o estudianta ha de ser capaç de:

• RAC1: Utilitzar un entorn de programació per la construcció de programes interactius i animats a la web
• RAC2: Escriure programes amb animacions i amb interactivitat
• RAC3: Comprendre i aplicar els conceptes i elements bàsics de la programació
• RAC4: Usar algunes de les llibreries que inclou el llenguatge de programació

L'assignatura té 3h/setmana de teoria i 1h/setmana de pràctiques.

Tots els conceptes teòrics de la matèria s'exposaran en classes de teoria (grups grans). En aquestes classes, i a discreció dels docents impartidors, s'usaran ordinadors per resoldre els exercicis i problemes de caire més pràctic. Així mateix i sempre a discreció dels impartidors, es podrà demanar als estudiants que resolguin, de manera individual o en grup, problemes i/o exercicis breus. Aquestes activitats, que per la seva naturalesa d'optativitat i brevetat no apareixen reflectides a la llista d'activitats, serviran a l'estudiant com a instrument d'autoavaluació del seu assoliment dels continguts de la matèria i podran ser utilitzades per part del docent per a prendre decisions sobre la qualificació final de l'estudiant bo i que mai en detriment de la qualificació numèrica calculada segons el sistema de qualificació indicat.

Els conceptes de caire més pràctic i tot el que en essència es pugui considerar l'aplicació pràctica dels conceptes teòrics seran treballats en grups petits (de laboratori). En les sessions que es programin a aquest efecte es donaran les eines escaients per a resoldre les activitats programades bo i que s'espera que aquestes s'allarguin des del punt de vista temporal, més enllà de les hores de laboratori i que, en conseqüència, els estudiants les hagin de finalitzar durant el temps d'aprenentatge autònom.

Sempre que es consideri escaient es posarà a disposició dels estudiants activitats de caire totalment opcional que l'ajudin a preparar i a preparar-se per a les de caire obligatori.

TEMA 1.- ALGORÍSMICA I PROGRAMACIÓ. EINA DE TREBALL

Aquest bloc docent té una doble finalitat, per un cantó la familiarització de l'estudiant amb l'eina de treball que s'usarà per a la producció d'aplicacions interactives i per l'altra la introducció de conceptes bàsics envers l'algorísmica i la programació.

En aquest contingut es treballa:

1. Introducció a l'algorísmica i la programació

2. Què és JavaScript? Llibreria p5.js

3. Eina de treball: Entorn de Programació

4. Procés de Programació. Llenguatges interpretats vers llenguatges compilats

5. Estructura d'un programa

    5.1 La funció setup()

    5.2. La funció draw(). Animacions

TEMA 2.- PROGRAMACIÓ AMB P5JS. INTERACTIVITAT 

Aquest bloc docent té com a finalitat escriure programes amb P5.js que permetin incloure gràfics, animacions  i interactivitat.

En aquest contingut es treballa:

1. Concepte de variable. Variables d'entorn

2. Interacció amb el ratolí

3. Interacció amb el teclat

4. Concepte d'event. Funcions d'events

5. Eines bàsiques de dibuix

TEMA 3.- PROGRAMACIÓ BÀSICA

Aquest bloc docent té com a finalitat escriure programes amb una animació i/o interactivitat aconseguida fent ús d'una programació bàsica.

En aquest contingut es treballa:

1. Tipus de dades: números, cadenes i booleans

2. Valors de les dades
  2.1. Variables: creació, accés i modificació
  2.2. Constants i literals: creació i accés
  2.3. Àmbit de les dades: local i global

3. Expressions i operadors
  3.1. Operadors aritmètics, lògics i relacionals
  3.2. Avaluació d’expressions. Ordre de les operacions

4. Entrades i sortida de dades

5. Estructures de control de l’execució
  5.1. Estructura seqüencial.
  5.2. Estructura condicional
  5.3. Estructura iterativa

TEMA 4.- PROGRAMACIÓ AVANÇADA

Aquest bloc docent té com a finalitat escriure programes amb una animació i/o interactivitat aconseguida fent ús d'estructures de la programació més avançades.

En aquest contingut es treballa:

1. Descomposició funcional
  1.1. Evitar la repetició de codi
  1.2. Procediments: accions i funcions

2. Parametrització
  2.1. Pas de paràmetres
  2.2. Retorn de valors

Es posa a disposició dels estudiants tot un seguit d'activitats de caire eminentment pràctic (exercicis curts, problemes...) que són la base de les activitats d'aprenentatge de l'assignatura. Aquestes activitats els estudiants/es les hauran de resoldre, sovint de manera no presencial, seguint les indicacions dels docents i també seran treballades a classe, ja sia com a exemples en les sessions de teoria, ja sia en les sessions de laboratori. Si bé aquestes activitats tindran caràcter optatiu (els docents no en verificaran de manera individualitzada la realització per part dels estudiants), seran imprescindibles per assolir els coneixements teorico-pràctics de l'assignatura.

Amb l’objectiu de recollir evidència de l’assoliment dels resultats d’aprenentatge esperats es realitzaran les següents activitats de caràcter avaluatiu. Les dues proves escrites són individuals. Serà potestatiu de l'impartidor decidir si les pràctiques es realitzen individualment o en grup de dos estudiants.

Dues proves escrites (utilitzant, quan s'escaigui, una eina IDE)

La primera, PROVA ESCRITA I,  versarà sobre els tres primers continguts (interactivitat i programació bàsica) i donarà evidència dels resultats d'aprenentatge RAC2, RC3 i RC4.

Aquesta prova demana als estudiants el desenvolupament correcte de software. Això té a veure amb les següents competències comunes i específiques (entre parèntesi els aspectes més rellevants de cada competència a les quals l'assignatura contribueix):

• E4 (programar aplicacions multimèdia interactives)
• E1 (programar interfícies gràfiques de web d'aplicacions interactives i videojocs)

La segona prova, PROVA ESCRITA II,  inclourà tots els continguts i donarà evidència de tots els resultats d'aprenentatge previstos. Aquesta prova demana als estudiants el desenvolupament correcte de software que inclou tots els continguts de l'assignatura. A nivell de competències comunes i específiques seran rellevants totes les esmentades per a la primera prova afegint-hi:

• G5 (desenvolupar habilitats amb un alt grau d'autonomia)
• G3 (interpretar dades i reflexionar sobre l'ús d'estructures adients en la programació) 

Cinc sessions de pràctiques

Es realitzaran cinc sessions de pràctiques usant l'entorn de programació. Aquestes sessions estan pensades per a què l'estudiant treballi els conceptes explicats i treballats a la sessions de teoria. Durant la sessió l'estudiant haurà de resoldre una llista d'exercicis proposats pel professor i del resultat d'aquestes sessions s'hauran de lliurar exercicis i una pràctica dividida en dues parts. L'enunciat dels lliuraments tindrà com a objectiu valorar l'ús correcte dels continguts objectiu de les sessions.  

Sessió 1

A aquesta primera sessió els estudiants tenen un primer contacte amb l'entorn de desenvolupament de programes que hauran d'utilitzar en la resta de pràctiques i activitats de l'assignatura.

En la primera part de la sessió el professor és qui fa la presentació de l'entorn, mostrant-los aquells elements que els seran de més utilitat. A la segona part l'estudiant s'enfronta a la resolució de diversos enunciats que incorporaran interactivitat, s'usarà el ratolí i el teclat per interactuar amb l'usuari.

Amb això es podrà recollir evidència dels resultats d'aprenentatge RAC1 i RAC2.

Sessió 2

Aquesta sessió està destinada a que els estudiants practiquin la codificació de programes de naturalesa seqüencial. Per la naturalesa de l'assignatura, en cada sessió usaran tots els conceptes treballats en les anteriors. Al final d'aquesta sessió  els estudiants hauran de resoldre individualment un exercici que formarà part de l'avaluació de l'assignatura. 

Amb això es podrà recollir evidència dels resultats d'aprenentatge RAC1, RAC2, RAC3 i RAC4.

Sessió 3

Aquesta sessió està destinada a que els estudiants practiquin la codificació de programes de naturalesa condicional.

Aquesta sessió incorporarà el treball amb els conceptes de les sessions anteriors. Al final de la sessió els estudiants hauran de resoldre individualment un exercici que formarà part de l'avaluació de l'assignatura. A més, s'encarregarà la programació d'un JOC INTERACTIU: Part 1, que l'haurà de lliurar a l'inici de la sessió 5.

Amb això es podrà recollir evidència dels resultats d'aprenentatge RAC1, RAC2, RAC3 i RAC4.

Sessió 4

Aquesta sessió està destinada a que els estudiants practiquin la codificació de programes de naturalesa iterativa.

Al final de la sessió els estudiants hauran de resoldre individualment un exercici que formarà part de l'avaluació de l'assignatura. En aquesta sessió l'estudiant pot resoldre les dubtes que li hagin sorgit vers el joc interactiu que se li va encarregar a la sessió anterior JOC INTERACTIU: Part 1  i que haurà de lliurar a l'inici de la sessió 5.

Amb això es podrà recollir evidència dels resultats d'aprenentatge RAC1, RAC2, RAC3 i RAC4.

Sessió 5

Aquesta sessió està destinada a que els estudiants practiquin la codificació de programes aplicant la descomposició funcional, codificant procediments parametritzats i usant les diferents formes d'execució. 

Al final de la sessió els estudiants hauran de resoldre individualment un exercici que formarà part de l'avaluació de l'assignatura. A més, s'encarregarà l'ampliació del joc interactiu lliurat, JOC INTERACTIU: Part 2, afegint noves funcionalitats.  S'haurà de lliurar al final del trimestre.

Amb això es podrà recollir evidència dels resultats d'aprenentatge RAC1, RAC2, RAC3 i RAC4.

A nivell competencial els lliuraments, que majoritàriament s'hauran de desenvolupar en temps no presencial, cobreixen totes les competències bàsiques i específiques de l'assignatura:

• E4 (dissenyar, editar i programar aplicacions multimèdia interactives)
• E1 (aplicar processos, mètodes i tècniques per a desenvolupar la creativitat i en la programació de videojocs)
• G5 (desenvolupar habilitats d'aprenentatge amb un alt grau d'autonomia)
• G3 (interpretar dades i reflexionar sobre l'ús d'estructures adients en la programació) 

Per tal de superar (aprovar) les activitats avaluatives, els estudiants hauran de demostrar:

Que han adquirit els coneixements teòrics relatius als continguts de l’assignatura i que la seva comprensió els permet de portar-los a la pràctica [MECES-2 punt a, punt c]

Que poden desenvolupar solucions a problemes que, si bé són semblants a d’altres vistos anteriorment, presenten aspectes que són nous [MECES-2 punt f]

Normes de realització de les activitats

Per a cada activitat, els docents n'informaran de les normes i condicions particulars que les regeixin.

Les activitats unipersonals pressuposen el compromís de l'estudiant de realitzar-les de manera individual. Es consideraran suspeses totes aquelles activitats en què l'estudiant no s'ajusti a aquest compromís, independentment del seu paper (emissor o receptor). Igualment, les activitats que s'hagin de realitzar en grups pressuposen el compromís per part dels estudiants que l'integren de realitzar-les en el si del grup. Es consideraran suspeses totes aquelles activitats en què el grup no hagi respectat aquest compromís amb independència del seu paper (emissor o receptor).

En les activitats realitzades en grup el docent pot, en base a la informació de què disposi, personalitzar la qualificació per a cada integrant del grup.

Qualsevol activitat no lliurada es considerarà puntuada amb zero punts. No s'acceptarà cap lliurament fora de termini.

La qualificació final és la suma ponderada de les qualificacions de les següents activitats:

ACTIVITAT PES

PROVA ESCRITA I 20%

PROVA ESCRITA II 50%

PRÀCTICA EXERCICIS INDIVIDUALS 5%

PRÀCTICA: JOC INTERACTIU PART 1 8%

PRÀCTICA;  JOC INTERACTIU PART 2 17%

Amb les ponderacions anteriors, les activitats de laboratori (exercicis i pràctiques) tenen un pes del 30% i les activitats de caire teòric tenen un pes del 70%.

Consideracions:

Per superar l'assignatura és imprescindible que l'estudiant tingui una qualificació mínima de 4 en els exercicis individuals de les sessions, i també en cadascuna de les parts del joc interactiu lliurades a la part de pràctiques.

Si la nota final de la PROVA ESCRITA II no és superior a 4 l'assignatura queda suspesa amb la qualificació d'aquesta activitat.

La recuperació només possibilita recuperar la qualificació de les activitats teòriques: PROVA ESCRITA I i II. Si la qualificació de l'examen de recuperació és 4  o superior i la ponderació amb la qualificació de pràctiques iguala o supera el 5 l'assignatura queda aprovada amb una qualificació de 5.

Lauren McCarthy, Casey Reas, Ben Fry. Introducción a p5.js. Marker Media. ISBN: 973-099881309

P5js Guia de referencia. https://p5js.org/es/reference/

Montse Rabassa, Lina Juan. Transparències i exercicis de classe. Publicació interna de l'ESUPT

JavaScript 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

API HTML, CSS i JavaScript en w3Schools. https://www.w3school.com