ID404a
Programming Interactivity II

Faculty
Ricardo Mendieta
Head of Digital, Harbour.Space
Course length
Duration
Total hours
Credits
Language
Course type
Fee for single course
Fee for degree students
Skills you’ll learn
Overview
This course deepens into programming, diving into user interactions, physics, motion, sound, and inputs. Students will obtain a solid foundation of programming that will allow them to create interactive experiences and animations. Learning how to create printable artwork, navigate a real-time generated 3D environment or detect user poses with a webcam are just a few themes that will allow students to create interactions within a screen or an interactive installation where their creativity is the limit, while extending their knowledge of programming through fun and interactive exercises. The final project will be a real-time creative coding experiment on a theme of the students’ choosing.
Learning highlights
- Learn to draw vectors and manipulate images by code
- Understand how physics and maths are used to create movement
- Learn to visualize data structures in a creative way
- Learn how to create artwork with code for offline and online media
- Increase knowledge of programming fundamentals and methodologies
- Discover how 3D interactive experiences are built
- Discover creative ways of using different inputs and outputs for interactive experiences
Course outline
15 classes
Class 1
Drawing with code
- HTML Canvas
- Drawing shapes
- Drawing images
- Creating Masks
- *Exercise
Class 2
Physics Fundamentals I
- Coordinate Systems
- Vectors
- Translation
- Drag
- Proximity
- *Exercise
Class 3
Physics Fundamentals II
- Attraction
- Gravity
- Resting Position
- Bounds
- *Exercise
Class 4
Creating Particles Systems
- How does a Particle system work?
- Harmonic Random Movement
- Perlin Noise
- *Exercise
Class 5
Practice Session
Class 6
Sound and Audio
- Interactions and Sound
- Music Visualizations
- Generating sound with code
- *Exercise
Class 7
Pixels and Images
- Image effects
- Manipulating pixels
- *Exercise
Class 8
Exploring the third dimension
- THREE.js
- Cameras
- Materials
- Meshes
- *Exercise
Class 9
Interactive Data Visualization
- D3 Library
- Layouts
- Selections
- Geomapping
- *Exercise
Class 10
Practice Session
Class 11
Creating Printable Artworks
- Canvas Sketch
- PenPlotter files
- *Exercise
Class 12
Camera and Interactivity
- Using cameras as input
- Detecting colors
- Detecting user poses
- *Exercise
Class 13
Wrapping it Up
- The class will debate the final assignment topic
- Work on the final assignment
Class 14
Work on final assignment, ask the teacher questions.
Class 15
Final assignment presentation and evaluation
A career in web design requires different degrees of interaction with developers, sometimes even moving into a frontend developer career. Getting familiar with the basics of programming and acquiring essential knowledge of Web Development will improve how you communicate with the developer members of your team to create better projects more efficiently. In this course, we will learn the principles of interactivity with code. Using Javascript, HTML, and CSS, a parallax scrollable landing page will be created that will challenge our creativity.
See full profileApply for this course
Programming Interactivity II
by Ricardo Mendieta
Total hours
45 Hours
Dates
Nov 30 - Dec 18, 2020
Fee for single course
€1500
Fee for degree students
€750
How to secure your spot
Complete the form below to kickstart your application
Schedule your Harbour.Space interview
If successful, get ready to join us on campus
FAQ
Will I receive a certificate after completion?
Yes. Upon completion of the course, you will receive a certificate signed by the director of the program your course belonged to.
Do I need a visa?
This depends on your case. Please check with the Spanish or Thai consulate in your country of residence about visa requirements. We will do our part to provide you with the necessary documents, such as the Certificate of Enrollment.
Can I get a discount?
Yes. The easiest way to enroll in a course at a discounted price is to register for multiple courses. Registering for multiple courses will reduce the cost per individual course. Please ask the Admissions Office for more information about the other kinds of discounts we offer and what you can do to receive one.