In this class we will build poetry instruments and try to get good at playing them. By 'instrument ' I mean an interactive work that can be played differently each time, has a learning curve and can be remixed and improvised when performed live. We will build our instruments using Javascript keyboard events to control the text on the screen, and also corresponding sounds, images and animations (depending on how deep you want to go).
-
Play around with some web instruments / poetry instruments
-
Talk about Javascript functions and jQuery Interactivity
-
Try modifying existing instrument code for new results
-
Discuss writing for this medium
-
Introduce core js interactivity functions
- Sound - Blocking and non-blocking
- Images
- jQuery Animation
- Add text letter-by-letter
- Button mash
-
Work on our instruments
-
Perform our instruments and play each other's
- jQuery - core library for interactive websites
- Mousetrap - small library for easily binding keyboard events
- MeSpeak.js - Javascript text-to-speech library
- Freesound.org - great source for sound effects
- Giphy - where else are you gonna find your animated gifs?
- Google Fonts - good source of easy to implement fonts
- Clone this repo or download/extract the zip, and remember the location
- Open the Terminal / command prompt
- Cd (change directory) into the 'poetry-instruments' folder (from the repo)
- Run your http-server
- If you have a Mac, you can run a python http server by typing python -m SimpleHTTPServer
- If you have Python 3 (newest version), you'll have to type python -m http.server
- Open your browser and go to http://localhost:8000/your-project-folder-name
Press Shift+Space to see the code
This Codecademy course covers a lot of the stuff we'll be talking about with javascript and jquery for interactivity.