Visualise you Tunes with Code

Challenges


Table of Contents

  1. Create musical visualisations using coding with Javascript
  2. The P5 coding environment
  3. How digital sound works
  4. Coding
  5. Challenges
  6. Reference

Going Further


Take a look at the code in sound.js. Understand how it works. Create your own shapes and characters and get them to move to the music!


Adding your own Music File

To add a music file to the project, we need to upload it

  1. Click the > next to the code window to reveal the list of files:
Add music 1
  1. Select the Upload file option:
Add music 2
  1. Drag your mp3 file onto the window that appears. The environment only allows files smaller than 5Mb
Add music 3
  1. You should see your music file in the file list:
Add music 4

< Prev PageNext Page >Back to resources page

Table of Contents

  1. Create musical visualisations using coding with Javascript
  2. The P5 coding environment
  3. How digital sound works
  4. Coding
  5. Challenges
  6. Reference
©2024 - Think Create Learn Ltd