Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.


Creative Programming with Javascript

Goldsmiths University of London via Kadenze


Creative Programming with Javascript aims to enhance student skills and experience in the development of software for the creation and manipulation of sounds and images, both in real and non-real time. The course explores the intersection and similarities between sound and image signal processing through the exploration of combined audiovisual approaches. As such it is suitable for those with a strong interest in creative technologies from either an engineering or creative arts background.

This course extends the principles of creative engineering for use in arts, games, and more general interaction scenarios so that students can develop their own projects through the use of computational approaches to audiovisual processing. The lessons will be taught using Javascript. It is recommended that students have some experience with using Processing and some background in digital audio and/or digital image manipulation before taking this course.

Materials on how to use Javascript will be made available, and we will be using bespoke tools and libraries to make this a lot easier. At first we will use ready made code to apply creative techniques. Following this, you’ll be expected to develop your own code based on what you’ve learned. Throughout this process, you should pick up some great skills.

We will spend the first few sessions exploring Digital Audio Signal Processing. This will cover synthesis, sequencing, filtering, sample loading and playback, panning and rudimentary analysis. Following this we’ll be looking at audiovisual interaction using video and 3D graphics.


Session 1: Introduction To The Course: What Is Creative Programming? 
Introduction to Digital Audio in C++. In this session we will get started using an IDE, and then download the current version of Maximilian. We’ll be going through some of the examples, and building some really basic music software to get us started. Some of the most important things you will learn in this session include how simple waveforms can be used to create more complex ones, and how signals can be used to make sound, or to control sound, depending on how those signals are scaled. Session 2: Sound Synthesis And Control 
Building on the previous session's introduction, we will be learning more about waveforms and their construction, and looking at additive synthesis. After this we’ll be exploring how we can use simple statements to make an efficient metronome object that can be used to make things happen. At the end of the session, you will have all built synthesizers in C++ and made them play things that sound like music. Session 3: Real-Time Recursive Filters, LFOs, And Sample Playback 
In this session we will learn how to use Maximilian’s built-in filters to create a subtractive synthesizer and an LFO, and get some insight into how these work. We will also learn how to load in a sample and play it back. Session 4: Building A Drum Machine/Sample Playback Device, Manipulating Samples, And Using Envelopes 
During the first half of the lesson we will be working to create a drum machine using sample players and sequencer skills from the previous session. Following this we will be looking at various ways of manipulating sample playback to create interesting effects, and learn how to use basic envelope generators to control parameters. We will also look at an advanced example demonstrating how to create a polyphonic music device. Session 5: Audio Visual Composition: Contemporary Work By Audiovisual Creatives 
In this session we will look at the work of contemporary AV artists and talk about what inspires them, showing examples of their work and discussing what approaches they take to audiovisual composition. We will also briefly introduce openFrameworks, and begin to explore the fundamentals of algorithmic computer graphics design in C++. Session 6: Using OpenFrameworks With Maximilian 
This session will be a basic introduction on how to use openFrameworks in more detail, and how to augment it with Maximilian. We will look at the main openFrameworks methods, and demonstrate how to incorporate your existing audio DSP code and projects into openFrameworks to make interactive music applications that use graphics, mouse and keyboard interaction. Session 7: Audiovisual Synthesis Using OpenFrameworks 
This session will look at how to get basic information from our sound algorithms and use it to map graphical parameters to make basic audiovisual synthesizers. We will explore a range of generative drawing techniques including the geometric systems, non-linear systems and noise. We will also look at controlling generative drawing through audio, and using graphics parameters to control sound. Session 8: VJ/DJ Techniques And Audiovisual Sampling 
In this session we will be using audio signals to control aspects of a video signal using sampled footage and sound files. This means loading a video, understanding how to control a video, and then understanding how to map audio signals into a range that make them useful for video processing. Session 9: Audio Features And Their Uses: FFT/IFFT/MFCC/Convolution 
In this session we’ll be visualizing audio features using Maximilian’s FFT libs in openFrameworks. Here we can do great effects with not much coding, but getting started is a headache, and the FFT is always tough to conceptualize. Session 10: Video Manipulation And Analysis 
In this session we will look at an example that allows you to edit the pixels from a movie or a webcam, to create a background subtraction system for doing basic homegrown computer vision. This project also demonstrates how to load a char buffer into a sound object and play it like a sample. Lots of fun I’m sure you will agree. We will also introduce frag shaders as a mechanism for manipulating images.

Taught by

Mick Grierson


4.0 rating, based on 4 Class Central reviews

Start your review of Creative Programming with Javascript

  • Anonymous

    Anonymous completed this course.

    Unfortunately this course is a struggle to get through. The videos are out of date in comparison to the "codecircle" site that Mick uses for the coding, so even in the first video's you'll fail to get sound generated as codecircle is now on a secur…
  • Anonymous

    Anonymous completed this course.

    I actually found this course by accident. When I saw the preview, I was absolutely mesmerized (what’s the name of that song!?!). Anyway, the course was a little different from the video. (You’re gonna have to try REALLY hard to create avant-garde vi…
  • Anonymous

    Anonymous completed this course.

    I've liked the course and the teacher, the only thing that I would improve is the software used. The JS library is not packaged and available through npm, therefore, it is complicated to integrate it in projects more complex than the sketches done in the exercises.
    For the rest, I would suggest this course to anyone who wants to know more about sound and reactive graphics
  • Leon Fedden

    Leon Fedden is taking this course right now.

    Brilliant course and instructors; a great introduction to sonic and graphical art via the computer. Would recommend it to anyone thinking of learning more about how to programmatically generate audio or visuals

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.