0 Creative Programming 2
Materials for the course ›Creative Programming‹
Universität für künstlerische und industrielle Gestaltung, Linz
Abteilung für Mediengestaltung Lehramt
Lecturer: Andreas Pirchner
Summer semester 2020
Structure / Quick overview
Introduction to Creative Programming in p5.js
Lecture 1 (03.03.2020): Basics and V-isuals(4,5h)
What can Creative Programming be? – Setup of a p5-Sketch with HTML, CSS, JS – Basic concepts: variables, recursion, branching
Lecture 2 (17.03.2020): OOP / Visualizing Data(4,5h)
Visualizing Data – Retrieving Real-Time Data vie Internet – Object Oriented Programming – Modeling Dynamic Systems
Lecture 3 (31.03.2020): Randomness (4h,5)
Random Walks – Perlin Noise – Chance Operations in P5
Lecture 4 (21.04.2020): Algorithms & Recursion (4,5h)
Recursion – Fractals – Sierpinski Triangle - L-Systems and Trees - Circle Packing Algorithm
Lecture 5 (12.05.2020): Sound / Work on final project/assignment (4h,5)
amplitude analysis – FFT-analysis – mapping sound parameters to visuals – using mic-input for visuals – working with open data sources
List of Assigments
Session 2. OOP/Visualizing Data:
Expand the "Experimental growth" Sketch (this one) by a timeline as seen in the Washington Post article (see image above). Take into account the following aspects:
(1) The timelime shows the amount of infected individuals. So we need a variables that keeps count of how many people are infected or not infected.
(2) People get healthy again after a certain time. Adapt the sketch in a way that people get healthy again after about 8 seconds.
Draw the timeline chart with the values of the variable in real time (of the sketch).
For the ambitious:
(1) Implement that recovered individuals are immune. How does the timeline chart change?
(2) Implement a slider to adjust the amount of social distancing (An explanation of how to use sliders can be found here ). Observe, how the curve of the timeline chart changes.
(3) Implement a variable that holds the probability for infection when to individuals meet. Implement a slider to adjust the variable.
Session 3. Randomness: Perlin Noise and Random Walks
Create a sketch in which an interesting structure is created by a random walk movement that is controlled by Perlin-Noise. Here is the coding challenge for it: Link
Session 4. Random Sierpinski Triangle
Have a shot on the Sierpinski Triangle! Can you come up with a version of it, that doesn't divide the triangle not in the middle of each its sides but choses a random point?
Session 5. Sound/Visuals (final project)
Choose a piece of music and come up with an exciting visualization by using FFT analysis.
This course offers an introduction to p5.js and a framework that allows
to develop basic mobile browser apps. Techniques an strategies are
presented in an art-related context and supported by examples from
Exercises and realizing own ideas help comprehending the presented concepts.