General information


Subject type: Mandatory

Coordinator: Rafael Suarez Gómez

Trimester: Second term

Credits: 4

Teaching staff: 

Catherine Juan Nadal
Luca-antonio Saavedra Todd 
Montserrat Rabassa Jou 

Skills


Specific skills
  • E1_Design and program the graphical interfaces of static or dynamic web portals, interactive applications and video games, following usability and accessibility criteria

  • E4_Design, plan, edit, program and market interactive multimedia applications

Description


The subject "Fundamentals of Programming" is part of the Multimedia area of ​​the Degree in Audiovisual Media. This course introduces students to learning a programming language that will allow them to write multimedia web applications with increased user interaction.

This subject is the natural continuation of the previous "Multimedia Systems" taken in the first term.

The programming language used is javascript and in particular the P5.js library with the aim of facilitating the writing of programs. You see the basics of programming to be able to make small calculations, read and save information provided by the user and create transitions and animations with the objects of the graphical user interface. Programming is worked on in response to events caused by the user with the keyboard and mouse.

The various concepts worked on in the subject are designed to train students in learning and using the basic concepts of programming.

This subject has methodological and digital resources to make possible its continuity in non-contact mode in the case of being necessary for reasons related to the Covid-19. In this way, the achievement of the same knowledge and skills that are specified in this teaching plan will be ensured.

Learning outcomes


In general, this subject contributes to the learning outcome specified for the subject to which it belongs (Multimedia and Animation):

  • The student must be able to create small interactive multimedia applications on the web: games, media players, animations, etc.

At a more specific level, at the end of the course the student must be able to:

  • RAC1: Use a programming environment to build interactive and animated programs on the web
  • RAC2: Write programs with animations and interactivity
  • RAC3: Understand and apply the basic concepts and elements of programming
  • RAC4: Use some of the libraries included in the programming language

Working methodology


The subject has 3h / week of theory and 1h / week of practice.

All the theoretical concepts of the subject will be exposed in theory classes (large groups). In these classes, and at the discretion of the teachers, computers will be used to solve the exercises and problems of a more practical nature. Likewise, and always at the discretion of the teachers, students may be asked to solve, individually or in groups, short problems and / or exercises. These activities, which due to their optional nature and brevity are not reflected in the list of activities, will serve the student as a tool for self-assessment of their achievement of the contents of the subject and may be used by the teacher. to make decisions about the final grade of the good student and that never to the detriment of the numerical grade calculated according to the indicated grading system.

The more practical concepts and everything that can essentially be considered the practical application of the theoretical concepts will be worked on in small (laboratory) groups. In the sessions scheduled for this purpose, the appropriate tools will be given to solve the scheduled activities well and it is expected that these will be extended from a temporal point of view, beyond the laboratory hours and that, consequently, , students must complete them during the autonomous learning time.

Whenever deemed appropriate, totally optional activities will be made available to students to help them prepare and prepare for the compulsory ones.

Contents


UNIT 1.- ALGORITHM AND PROGRAMMING. WORK TOOL

This teaching block has a dual purpose, on the one hand the familiarization of the student with the work tool that will be used for the production of interactive applications and on the other the introduction of basic concepts towards algorithms and the programming.

This content works on:

1. Introduction to algorithms and programming

2. What is JavaScript? Bookshop p5.js

3. Work tool: CodePen

4. Programming Process. Interpreted languages ​​versus compiled languages

5. Structure of a program

    5.1 The setup () function

    5.2. The draw () function. Animations

 

SUBJECT 2.- PROGRAMMING WITH P5JS. INTERACTIVITY 

This teaching block aims to write programs with P5.js that allow you to include graphics, animations and interactivity.

This content works on:

1. Concept of variable. Environment variables

2. Mouse interaction

3. Keyboard interaction

4. Event concept. Event functions

5. Basic drawing tools

 

SUBJECT 3.- BASIC PROGRAMMING

This teaching block aims to write programs with animation and / or interactivity achieved using a basic programming.

This content works on:


1. Data types: numbers, strings, and booleans

2. Data values
  2.1. Variables: creation, access and modification
  2.2. Constants and literals: creation and access
  2.3. Data scope: local and global

3. Expressions and operators
  3.1. Arithmetic, logical and relational operators
  3.2. Expression evaluation. Order of operations

4. Data inputs and outputs

5. Execution control structures
  5.1. Sequential structure.
  5.2. Conditional structure
  5.3. Iterative structure

 

SUBJECT 4.- ADVANCED PROGRAMMING

This teaching block aims to write programs with animation and / or interactivity achieved using the most advanced programming structures.

This content works on:

1. Structuring the program in functions
  1.1. Avoid code repetition
  1.2. Passing parameters and returning values

2. One-dimensional tables

 

 

Learning activities


A series of activities of an eminently practical nature (short exercises, problems ...) are made available to students, which are the basis of the learning activities of the subject. These activities will have to be solved by the students, often in a non-contact way, following the instructions of the teachers and will also be worked in class, either as examples in the theory sessions or in the laboratory sessions. Although these activities will be optional (teachers will not individually verify the performance by students), they will be essential to achieve the theoretical and practical knowledge of the subject.

In order to gather evidence of the achievement of the expected learning outcomes, the following evaluative activities will be carried out. The two written tests are individual. It will be up to the teacher to decide whether the internships are carried out individually or in groups of two students.

 

Two written tests (using, when appropriate, an IDE tool)

The first, WRITTEN TEST I, will focus on the first three contents (interactivity and basic programming) and will provide evidence of RAC2, RC3 and RC4 learning outcomes.

This test asks students to develop software correctly. This has to do with the following common and specific competences (in brackets the most relevant aspects of each competence to which the subject contributes):

  • E4 (programming interactive multimedia applications)
  • E1 (programming graphical web interfaces for interactive applications and video games)

The second test, WRITTEN TEST II, ​​will include all the contents and will give evidence of all the expected learning outcomes. This test asks students for the correct development of software that includes all the contents of the subject. At the level of common and specific competencies, all the above will be relevant for the first test, adding:

  • G5 (develop skills with a high degree of autonomy)
  • G3 (interpret data and reflect on the use of appropriate structures in programming) 

They will be performed five practice sessions using the CodePen environment. The practices are designed for the student to work on the concepts explained and worked on in the theory sessions. During the session the student will have to solve a list of exercises proposed by the teacher and the result of these sessions will have to deliver three practices. The statement of each practice will aim to assess the correct use of the objective contents of the sessions.  

PRACTICE 1: Session 1 and Session 2

In the first session of the first practice the students have a first contact with the environment of development of programs that will have to use in the rest of practices and activities of the asignatura.

In the first part of the first session the teacher is the one who makes the presentation of the environment, showing them those elements that will be most useful to them. In the second part the student is faced with the resolution of several sentences that will incorporate interactivity, the mouse and keyboard will be used to interact with the user.

The second session of this practice is intended for students to practice coding programs of a sequential nature. Due to the nature of the subject, each practice will use all the concepts worked on in the previous ones.

This will allow evidence of RAC1, RAC2, RAC3 and RAC4 learning outcomes to be collected.

PRACTICE 2: Session 3 and Session 4

This practice is intended for students to practice coding programs of a conditional nature in the first session. The second session is intended for students to practice coding programs of an iterative nature.

This practice will incorporate the work with the concepts of the previous sessions.

This will allow evidence of RAC1, RAC2, RAC3 and RAC4 learning outcomes to be collected.

PRACTICE 3: Session 5

This practice is intended for students to practice coding programs that using the different forms of execution incorporate the work with tables.

The goal is for students using all the concepts worked on in the subject to implement an interactive game. In the production of this game the student will have to use all the concepts worked along the term and his delivery will be essential to pass the asignatura.

This will allow evidence of RAC1, RAC2, RAC3 and RAC4 learning outcomes to be collected.

 

At the competence level, the three internships, which will mostly have to be developed in non-contact time, cover all the basic and specific competencies of the subject:

  • E4 (design, edit and program interactive multimedia applications)
  • E1 (apply processes, methods and techniques to develop creativity and in video game programming)
  • G5 (develop learning skills with a high degree of autonomy)
  • G3 (interpret data and reflect on the use of appropriate structures in programming) 

In order to pass (pass) the assessment activities, students must demonstrate:

That they have acquired the theoretical knowledge related to the contents of the subject and that their understanding allows them to put them into practice [MECES-2 point a, point c]

That they can develop solutions to problems that, although they are similar to others seen above, present aspects that are new [MECES-2 point f]

 

Rules for carrying out the activities

For each activity, teachers will be informed of the particular rules and conditions that govern them.

One-on-one activities presuppose the student's commitment to carry them out individually. All activities in which the student does not comply with this commitment will be considered suspended, regardless of their role (sender or receiver). Likewise, the activities to be carried out in groups presuppose the commitment on the part of the students who make it up to carry them out within the group. All activities in which the group has not respected this commitment regardless of its role (sender or receiver) will be considered suspended.

In group activities, the teacher can, based on the information available, customize the grade for each member of the group.

Any undelivered activity will be considered scored with zero points. No late delivery will be accepted.

Evaluation system


The final grade is the weighted sum of the grades for the following activities:

WEIGHT ACTIVITY

WRITTEN TEST AND 20%

WRITTEN TEST II 50%

PRACTICE 1 6%

PRACTICE 2 6%

PRACTICE 3 18%

With the above weights, laboratory (practical) activities have a weight of 30% and theoretical activities have a weight of 70%.

Considerations:

To pass the subject it is essential that the student has a minimum grade of 4 in the PRACTICE 3 activity, otherwise the grade

of the subject will be that of this activity.

If the final mark of the WRITTEN TEST II is not higher than 4 the subject is suspended with the qualification of this activity.

The recovery only makes it possible to recover the qualification of the theoretical activities, WRITTEN TEST I and II, and the same rule described will be applied.

previously.

REFERENCES


Basic

Lauren McCarthy, Casey Reas, Ben Fry. Introduction to p5.js. Marker Media. ISBN: 973-099881309

P5js Reference Guide. https://p5js.org/es/reference/

Complementary

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

Mario Rubiales Gómez. Wev Development Course: HTML, CSS and Javascript. Grupo Anaya General Publications, 2018. ISBN-10: 8441539391

 

HTML, CSS and JavaScript APIs in w3Schools. https://www.w3school.com