ITP Camp 2017

Javascript Audio Visual Art - creating sound and motion reactive systems

Session Leaders: George Gally


Tags: #Javascript #creative coding


Created By: George Gally

How to use particle systems to create audio visual graphics in the browser. Using pure Javascript I'll' show you how to create sound reactive and motion reactive artworks. Previous Javascript knowledge would be an advantage.

=====================================

Workshop Requirements:

  1. Laptop with webcam and working microphone input

  2. Chrome Browser You’ll need to have the latest version of Chrome installed https://www.google.com/chrome/browser/desktop/index.html

  3. Development Text Editor You need to install a text editor. I recommend Atom: https://atom.io/ A good alternative to Atom is Sublime: https://www.sublimetext.com/ (but really, Atom is great)

  4. Live Server: This is going to make your life so much easier and coding so much faster and fun. For Atom, simply go Preferences->Packages and search and install Live Server https://atom.io/packages/atom-live-server For maximum happiness make sure your default browser is Chrome.

  5. A basic understanding of the web and HTML: Again, not really needed, but will go a long way in helping you get more out of the course and make better art.

Here’s two helpful guides: http://htmldog.com/guides/html/beginner/ https://websitesetup.org/html-beginners-guide/

Also a basic primer in colours: http://htmlcolorcodes.com/ http://www.computerhope.com/htmcolor.htm

This is a very very helpful Javascript creative coding primer: http://www.crunchzilla.com/code-monster


Comments

You must be signed in to comment.

Matthew Ortega June 1, 2017, 3:16 pm

Hey George,

Definitely want to take this class, but I saw a note about try to avoid scheduling around the Friday Social Hours so that we can all get together. Would it be good to shift it to another time?

George Gally June 1, 2017, 3:24 pm

@Matthew Ortega happy to shift to another time. actually would prefer to do it during the daytime, so we can have more hours to spend on this, but obviously depending on whether everyone\'s schedule allows for it. so please let me know.

MichelleS June 1, 2017, 6:40 pm

@George Gally On behalf of everyone coming from work, please don\'t move this earlier! Could we take a break from the session to do social hour and come back?

Emeka P June 4, 2017, 12:26 am

Hi George, any updates as to when this class is being rescheduled?

George Gally June 4, 2017, 6:46 pm

@Emeka P i think i should break this class into 2 sessions. motion reactive and audio reactive

Emeka P June 6, 2017, 4:43 pm

@George Gally That sounds great George! Would we do video first to pick up where we left off with Creative Coding, or? Looking forward and will be there either way!!