Interactive Environments

Sustainable Development Goals (SDG)

• 4. Quality education
• 5. Gender equality

Objectives

The main objective of this subject is to provide students with knowledge of the language and concepts of interactive graphic and audiovisual creation based on code and algorithms generated in real time with p5.js and with elements of hardware that allow physical interaction with users.

Learning outcomes

• Acquire the skills and knowledge to participate in multidisciplinary projects that mix programming, interaction design and visual design.
• You obtain generic knowledge that gives you more creative freedom in creating installations and interactive environments beyond the usual use of computers and commercial programs.
• Contributes, with programming skills and interactive environment design, to structuring processes and projects to solve complex problems in an orderly manner, individually or in a team.
• It applies generative graphics, sensor solutions, image processing, sound generation, etc. to projects to take advantage of the specificities and advantages of interactive environments in the field of multimedia.
• Is able to design graphically sketches, storyboards and basic style guides, to explain and show the idea of the project before programming.

Competencies

General skills

• Combine scientific knowledge with technical skill and technological resources to deal with difficulties in professional practice.
• Desire to take part in lifelong learning, innovate, create value and acquire new knowledge.

Specific skills

• Analyze, design and implement applications for the web, mobile devices, video games or general purposes, using programming languages ​​​​and development tools.
• Conceptualize, design, implement and assess interfaces and interaction schemes, putting into practice standard models of assessment.

Basic skills

• Students can apply their knowledge to their work or vocation in a professional manner and have competencies typically demonstrated through drafting and defending arguments and solving problems in their field of study.
• Students have developed the learning skills necessary to undertake further studies with a high degree of independent learning.

Core skills

• Display professional skills in complex multidisciplinary contexts, working in networked teams, whether face-to-face or online, through use of information and communication technology.
• Use oral, written and audiovisual forms of communication, in one's own language and in foreign languages, with a high standard of use, form and content.

Content

• Interactive projects in digital art
• Interaction design for interactive systems
• Software with p5.js
• Mobile interaction and generative drawing
• Interaction with the midi controller and mapping
• Tangible interfaces with Makey Makey or Arduino
• Interaction with the whole or partial body, with Kinect, leap motion or webcams
• Alternative disciplines for interactive installations (machine learning, data visualization...)

Evaluation

The grade is calculated based on the following activities:

• Programming exercises (individual): 20%
• Individual practices: 20%
• Group practice: 10%
• Final subject project (by groups): 40%
• Follow-up of the subject (individual): 10%

The practicals and the project are mandatory to pass the subject. In case of failure, the student has the possibility of submitting an individual practical to make up the difference. Only the final project can be made up.

Methodology

• Carrying out practical work while developing theoretical concepts.
• Cooperative learning in group work.
• Preparation of a final project in which several of the techniques learned in continuous assessment work are applied.

Bibliography

Key references

• Bohnacker H., Gross B., Laub J., Lazzeroni C., Lee J., Poldervaart N. (2018). Generative Design: Creative Coding on the Web (2 ed.). http://www.generative-gestaltung.de/2/.
• McCarthy L., Reas C., Fry B. (2018). Introducción a p5.js: Making Interactive graphics in JavaScript and Processing. Maker Media, Ink.
• Shiffman D. (2019). The Coding Train. https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA.
• Varis (2020). OpenProcessing. Retrieved from https://www.openprocessing.org/
• Varis (2020). p5.js. Retrieved from https://p5js.org/es/

Further reading

Teachers will provide complementary bibliography and compulsory reading throughout the course via the Virtual Campus.