​​​📝​ Week 12 – JavaScript Libraries and P5

​​JavaScript Exercise Show and Tell

​​Please paste your URL below and submit on canvas.
​​
​​https://janicek1m.github.io/dsgn234/exercises/instruction-js/index.html
​​https://lsmith24.github.io/jsExercise/index.html
​​https://liucath.github.io/exercises/instructions/index.html
​​https://stretler.github.io/exercises/sketch1/index.html
​​(not working) https://beckyree.github.io/becky_art21/exercises/javascript3/
​​https://amymeowzers.github.io/projects/neuralarchive/gesture.html
​​https://jihu8282.github.io/jihukim.github.io/exercise_instruction/index.html
​​https://egretegret.github.io/#/design/dsgn234/jsactivity
​​
​​
​​
​​

​​Readings about Processing

​​
 
Processing: the Software that Shaped Creative Coding
This is part I of the Processing oral history. Read part II here. Computers and design have long been intertwined. This relationship dates back to the 1960s, when computational pioneers used code to create novel forms. Since then, programming’s grip on designers has only tightened, even as it’s bee
eyeondesign.aiga.org
Processing: the Software that Shaped Creative Coding • eyeondesign.aiga.org
​​
​​
 
Processing: the Software that Shaped Creative Coding, Part II
This is part II of the Processing oral history. Read part I here. As Processing became one of the primary environments for creative coding in the early aughts, a community started developing around it. People were eager to use the tool, and a smaller subset of them wanted to help develop the infr
eyeondesign.aiga.org
Processing: the Software that Shaped Creative Coding, Part II • eyeondesign.aiga.org
​​
​​
​​
​​

​​JavaScript Libraries

​​
​​
 
User-uploaded image: giphy.gif
​​
​​
​​Javascript is the foundation of many different libraries. One such library is p5. A library is a JavaScript file that contains a bunch of functions, and those functions accomplish some useful task for your webpage.
​​
​​Most javascript libraries have documentation on how to use them and examples of sites that incorporate them.
​​
​​Libraries are also open source. This means that you can create a JS library on your own and put it into the world. Maybe one day you’ll discover something you find useful, and share it with the world.
​​
​​A couple websites that use p5.js
​​http://midnightcommercial.com/
​​https://spacetypegenerator.com/
​​
​​Other JavaScript Libraries
​​https://threejs.org/
​​https://tonejs.github.io/
​​https://d3js.org/
​​
​​

​​P5.js

​​For today’s activities, we’re going to use a JavaScript library called p5.js. You can use p5.js for artwork, data visualization, or simply in tandem with HTML, CSS and JavaScript
​​
 
​​
​​https://youtu.be/8j0UDiN7my4
​​
​​We’ll be using the P5 editor. Sign up for an account and link to it on your student portfolio: https://editor.p5js.org/
​​
​​→ your url should look like: https://editor.p5js.org/your_username/sketches