Programming Digital Media

Examples for Programming Digital Media class at Louisiana State University, Spring 2020

• email: [email protected]
• Office hours: 1pm to 3pm Monday in the Digital Media Center (2006)
• Zoom
  • We will be using zoom to meet during our normal class time
  • Please email to schedule a personal meeting if you need it
• Ask for help on the Discord
  • you can post a question about anything related to the class and one of your classmate or I will answer it.

---

Lectures

Tone.js

• 2-13-20 - Web audio basics and sound file players - slides, textbook
• 2-18-20 - Adding effects and intro to synthesis - slides, textbook
• 2-20-20 - 20-27-20 - Making synthesizers from scratch - slides
• 3-3-20 - Scheduling signals and LFOs - slides
• 3-5-20 - Instruments and Sequencers - slides, textbook
• 3-9-20 - Sound Effects and Sequencers - slides

Arduino

Video tutorials and notes

• Digital out - notes
  • Blink - blink an LED [video, code, circuit diagram]
  • Morse code introduction - how to do the morse code assignment. [video]
• Analog Out (Pulse Width Modulation) - notes
  • Tate's Fading tutorial - fade an LED [video, code]
  • Simron's fading tutorial - this covers the same information but might be useful for reinforcement. [video]
  • PWM game introduction - more PWM details and also introduces using a potentiometer. [video]
• Analog Input
  • Potentiometer - control the rate of blinking of the LED [video, code]
    • Note: the intro to this was cut off but the circuit that is already there is from the blink tutorial. The thing i'm holding is a potentiometer that allows analog input between 0v and 5v.
  • Photoresistor - control circuit with light [video, code]
    • Note: I was referring to the serial monitor through this video but didn't realize that it wasn't recording the screen. You should be able to see it on your computer.
• Digital Input
  • turn an LED on and off with a button. [video pt 1]
  • the code for the button example [video pt 2, code]
• Fading machine with states
  • Fade LED automatically or manually - press one button and the LED fades up and down automatically, press the other button and then you can fade the LED manually with a potentiometer. If nothing is pressed then the LED is off. [video, code ]
  • with toggle buttons - updated version of the previous example but now with toggle buttons instead of momentary buttons. [video, code]
  • debouncing buttons - an example of debouncing a button to fix unpredictable button presses. Debouncing is when you set a threshold of time when only the first press gets recorded, everything else is ignored. This ensures that noise in a circuit is filtered out when necessary. [video, code]
• Serial communication (Arduino <---> p5.js)
  • Basic setup - Arduino --> p5.js [video, code]
  • p5.js --> Arduino [video, code]
  • Heart game [video]
  • Paint game with Arduino [video]

Resources

• Starter templates
  • download - shows a basic example project with Tone.js and p5 with a button and slider
    • click the green button to download
  • p5 web editor - if you still can't run a local server. After you're finished click on file -> download to get the zip to turn in your project.
    • warning: there may be a file size limit, try to use smaller and shorter samples

Context not starting?

Try:

function startContext() {
  console.log("Tone is: ", Tone.context.state)
  document.body.addEventListener("click", () => {
    Tone.context.resume();
    console.log("Tone is: ", Tone.context.state);
  });
}

startContext(); 

That has stopped working for some students, if it does try this instead:

function mousePressed() {
  if(Tone.context.state === 'suspended') {
    Tone.context.resume();
  }
}

This if statement could go anywhere where the user can trigger it with an event.

Tone.js

Basics

• Tone.js Github - main repository
• Tone.js API - documentation
• Tone.js Wiki - covers a few things not explained in the API, ex. Time, envelopes
• Tone.js Google Group - ask a question here if you can't get it answered in class
• PDM Online Textbook - in development for highschool class but covers all necessary material

Extras

• Interactive Presets - use to experiment and find new sounds, do not copy presets from here else you add something unique to them.
• Make music with Tone - some tutorials for making more traditional music with Tone
• tone-rhythm - very helpful for making musical phrases with tone
  • Ex. Maria - play Maria with tone. This requires knowledge of importing from npm with the 'import' keyword. It will not work with a script tag.
• Algorithmic Music Tutorial - uses p5 sound but many of the creative ideas are transferable to Tone.js

---

Inspiration

• Hackpact - Algorithmic audiovisual sonification studies

Digital Audio

• Digital Sound and Music - explanations and definitions of all things digital sound

JS Basics

Still having trouble with some basics?

• freeCodeCamp
• codecademy
• MDN web docs Javascript - includes some tutorials and the standard javascript reference
• stackoverflow - find answers or ask questions to javacript related things.