├── .gitignore ├── Austin-190426 ├── 00-Exercises │ ├── exercise_01 │ │ └── exercise_01.pde │ ├── exercise_02 │ │ └── exercise_02.pde │ ├── exercise_03 │ │ ├── data │ │ │ ├── pia22332.jpg │ │ │ └── pia22512.jpg │ │ └── exercise_03.pde │ └── exercise_04 │ │ └── exercise_04.pde ├── 01-Shape │ ├── sketch_01_circle_line │ │ └── sketch_01_circle_line.pde │ ├── sketch_02_fill_stroke │ │ └── sketch_02_fill_stroke.pde │ ├── sketch_03_drawing_order │ │ └── sketch_03_drawing_order.pde │ └── sketch_04_alpha │ │ └── sketch_04_alpha.pde ├── 02-Draw │ ├── sketch_01_mouse │ │ └── sketch_01_mouse.pde │ ├── sketch_02_nobackground │ │ └── sketch_02_nobackground.pde │ ├── sketch_03_mousepressed │ │ └── sketch_03_mousepressed.pde │ ├── sketch_04_pmouse │ │ └── sketch_04_pmouse.pde │ ├── sketch_05_keypressed │ │ └── sketch_05_keypressed.pde │ ├── sketch_06_random │ │ └── sketch_06_random.pde │ ├── sketch_07_thickness │ │ └── sketch_07_thickness.pde │ └── sketch_08_smooth │ │ └── sketch_08_smooth.pde ├── 03-Image │ ├── sketch_01_draw_image │ │ ├── data │ │ │ ├── pia22332.jpg │ │ │ └── pia22512.jpg │ │ └── sketch_01_draw_image.pde │ ├── sketch_02_image_size │ │ ├── data │ │ │ ├── pia22332.jpg │ │ │ └── pia22512.jpg │ │ └── sketch_02_image_size.pde │ └── sketch_03_image_alpha │ │ ├── data │ │ ├── pia22332.jpg │ │ └── pia22512.jpg │ │ └── sketch_03_image_alpha.pde ├── 04-Layers │ ├── sketch_01_layer │ │ └── sketch_01_layer.pde │ └── sketch_02_saveimage │ │ └── sketch_02_saveimage.pde ├── 05-Rotoscope-Demo │ ├── sketch_01_loadframes │ │ ├── data │ │ │ ├── cube-12fps-0000.png │ │ │ ├── cube-12fps-0001.png │ │ │ ├── cube-12fps-0002.png │ │ │ ├── cube-12fps-0003.png │ │ │ ├── cube-12fps-0004.png │ │ │ ├── cube-12fps-0005.png │ │ │ ├── cube-12fps-0006.png │ │ │ ├── cube-12fps-0007.png │ │ │ ├── cube-12fps-0008.png │ │ │ ├── cube-12fps-0009.png │ │ │ ├── cube-12fps-0010.png │ │ │ └── cube-12fps-0011.png │ │ └── sketch_01_loadframes.pde │ ├── sketch_02_savedrawings │ │ ├── animation-0000.png │ │ ├── animation-0001.png │ │ ├── animation-0002.png │ │ ├── animation-0003.png │ │ ├── animation-0004.png │ │ ├── animation-0005.png │ │ ├── animation-0006.png │ │ ├── animation-0007.png │ │ ├── animation-0008.png │ │ ├── animation-0009.png │ │ ├── animation-0010.png │ │ ├── animation-0011.png │ │ ├── data │ │ │ ├── cube-12fps-0000.png │ │ │ ├── cube-12fps-0001.png │ │ │ ├── cube-12fps-0002.png │ │ │ ├── cube-12fps-0003.png │ │ │ ├── cube-12fps-0004.png │ │ │ ├── cube-12fps-0005.png │ │ │ ├── cube-12fps-0006.png │ │ │ ├── cube-12fps-0007.png │ │ │ ├── cube-12fps-0008.png │ │ │ ├── cube-12fps-0009.png │ │ │ ├── cube-12fps-0010.png │ │ │ └── cube-12fps-0011.png │ │ └── sketch_02_savedrawings.pde │ └── sketch_03_colorselector │ │ ├── data │ │ └── colors.png │ │ └── sketch_03_colorselector.pde └── 06-Xtra │ ├── cube_createvideo_12fps │ └── cube_createvideo_12fps.pde │ ├── cube_createvideo_24fps │ └── cube_createvideo_24fps.pde │ └── video_loop │ ├── data │ └── cube-spin.mp4 │ └── video_loop.pde ├── Hammer-120323 ├── HammerField │ ├── FlowField.pde │ ├── HammerField.pde │ ├── KeyCapture.pde │ └── Particle.pde ├── README.md └── Steps │ ├── A_Line │ └── A_Line.pde │ ├── B_Line │ └── B_Line.pde │ ├── C_Field │ └── C_Field.pde │ ├── D_RandomField │ └── D_RandomField.pde │ ├── E_NoiseField │ └── E_NoiseField.pde │ └── F_Particle │ ├── F_Particle.pde │ ├── FlowField.pde │ ├── KeyCapture.pde │ └── Particle.pde ├── README.md └── TTZ-190811 ├── Outline-01.txt ├── assemble ├── a-zine.pdf └── template.pdf └── code ├── Bonus └── RandomBook │ ├── RandomBook.pde │ └── RandomBook.pdf ├── Page_01 ├── TTZ_P1_01 │ └── TTZ_P1_01.pde ├── TTZ_P1_02 │ ├── TTZ_P1_02.pde │ └── page_1.pdf └── TTZ_P1_03 │ ├── TTZ_P1_03.pde │ └── page_1.pdf ├── Page_02 ├── TTZ_P2_01 │ ├── TTZ_P2_01.pde │ └── page_2.pdf └── TTZ_P2_02 │ ├── TTZ_P2_02.pde │ └── page_2.pdf ├── Page_03 └── TTZ_P3_01 │ ├── TTZ_P3_01.pde │ └── page_3.pdf ├── Page_04 └── TTZ_P4_01 │ ├── TTZ_P4_01.pde │ └── page_4.pdf ├── Page_05 ├── TTZ_P5_01 │ ├── TTZ_P5_01.pde │ └── page_5.pdf ├── TTZ_P5_02 │ ├── TTZ_P5_02.pde │ └── page_5.pdf └── TTZ_P5_03 │ ├── TTZ_P5_03.pde │ └── page_5.pdf ├── Page_06 ├── TTZ_P6_01 │ └── TTZ_P6_01.pde └── TTZ_P6_02 │ ├── TTZ_P6_02.pde │ └── page_6.pdf └── Page_Cover ├── TTZ_Cover_01 ├── TTZ_Cover_01.pde └── cover.pdf ├── TTZ_Cover_02_Fonts └── TTZ_Cover_02_Fonts.pde └── TTZ_Cover_03 ├── TTZ_Cover_03.pde ├── cover.pdf └── data └── ZXX False.otf /.gitignore: -------------------------------------------------------------------------------- 1 | # Ignore this stuff 2 | .DS_Store 3 | -------------------------------------------------------------------------------- /Austin-190426/00-Exercises/exercise_01/exercise_01.pde: -------------------------------------------------------------------------------- 1 | size(1280, 720); 2 | 3 | background(176, 176, 176); 4 | 5 | noStroke(); 6 | fill(0, 0, 0); 7 | ellipse(120, 150, 100, 100); 8 | ellipse(220, 150, 100, 100); 9 | 10 | strokeWeight(10); 11 | stroke(255, 255, 255); 12 | line(340, 150, 340, 640); 13 | line(440, 150, 440, 640); 14 | -------------------------------------------------------------------------------- /Austin-190426/00-Exercises/exercise_02/exercise_02.pde: -------------------------------------------------------------------------------- 1 | color c1 = color(51, 51, 51); 2 | color c2 = color(204, 204, 204); 3 | 4 | void setup() { 5 | size(1280, 720); 6 | background(255, 255, 255); 7 | } 8 | 9 | void draw() { 10 | if (mousePressed) { 11 | float d = dist(mouseX, mouseY, pmouseX, pmouseY); 12 | noStroke(); 13 | fill(c1); 14 | ellipse(mouseX, mouseY, d, d); 15 | } else { 16 | noStroke(); 17 | fill(c2); 18 | ellipse(mouseX, mouseY, 3, 3); 19 | } 20 | } 21 | 22 | void keyPressed() { 23 | if (key == '1') { 24 | // Do something here 25 | } else if (key == '2') { 26 | // Do something here 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /Austin-190426/00-Exercises/exercise_03/data/pia22332.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/00-Exercises/exercise_03/data/pia22332.jpg -------------------------------------------------------------------------------- /Austin-190426/00-Exercises/exercise_03/data/pia22512.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/00-Exercises/exercise_03/data/pia22512.jpg -------------------------------------------------------------------------------- /Austin-190426/00-Exercises/exercise_03/exercise_03.pde: -------------------------------------------------------------------------------- 1 | PImage img1; 2 | PImage img2; 3 | 4 | void setup() { 5 | size(1280, 720); 6 | // Place images in the "data" folder 7 | // in the sketch folder 8 | img1 = loadImage("pia22512.jpg"); 9 | img2 = loadImage("pia22332.jpg"); 10 | } 11 | 12 | void draw() { 13 | background(255); 14 | image(img1, 0, 30); 15 | image(img2, 640, 30); 16 | } 17 | -------------------------------------------------------------------------------- /Austin-190426/00-Exercises/exercise_04/exercise_04.pde: -------------------------------------------------------------------------------- 1 | PGraphics layer; 2 | int tool = 1; 3 | 4 | void setup() { 5 | size(720, 480); 6 | layer = createGraphics(width, height); 7 | layer.beginDraw(); 8 | layer.background(149, 222, 234); 9 | layer.endDraw(); 10 | } 11 | 12 | void draw() { 13 | if (mousePressed) { 14 | layer.beginDraw(); 15 | layer.noStroke(); 16 | if (tool == 1) { 17 | tool1(); 18 | } else if (tool == 2) { 19 | tool2(); 20 | } 21 | layer.endDraw(); 22 | } 23 | image(layer, 0, 0); 24 | } 25 | 26 | void tool1() { 27 | layer.strokeWeight(1); 28 | layer.stroke(0, 0, 0); 29 | layer.line(mouseX, mouseY, pmouseX, pmouseY); 30 | } 31 | 32 | void tool2() { 33 | layer.strokeWeight(12); 34 | layer.stroke(255, 255, 255); 35 | layer.line(mouseX, mouseY, pmouseX, pmouseY); 36 | } 37 | 38 | void keyPressed() { 39 | if (key == '1') { 40 | tool = 1; 41 | } 42 | if (key == '2') { 43 | tool = 2; 44 | } 45 | } 46 | -------------------------------------------------------------------------------- /Austin-190426/01-Shape/sketch_01_circle_line/sketch_01_circle_line.pde: -------------------------------------------------------------------------------- 1 | size(720, 480); 2 | ellipse(360, 240, 360, 360); 3 | line(120, 60, 600, 420); 4 | -------------------------------------------------------------------------------- /Austin-190426/01-Shape/sketch_02_fill_stroke/sketch_02_fill_stroke.pde: -------------------------------------------------------------------------------- 1 | size(720, 480); 2 | 3 | background(136, 211, 237); 4 | 5 | fill(28, 120, 152); 6 | noStroke(); 7 | ellipse(360, 240, 360, 360); 8 | 9 | stroke(215, 229, 234); 10 | strokeWeight(18); 11 | line(120, 60, 600, 420); 12 | -------------------------------------------------------------------------------- /Austin-190426/01-Shape/sketch_03_drawing_order/sketch_03_drawing_order.pde: -------------------------------------------------------------------------------- 1 | size(720, 480); 2 | 3 | background(136, 211, 237); 4 | 5 | stroke(215, 229, 234); 6 | strokeWeight(18); 7 | line(120, 60, 600, 420); 8 | 9 | fill(28, 120, 152); 10 | noStroke(); 11 | ellipse(360, 240, 360, 360); 12 | -------------------------------------------------------------------------------- /Austin-190426/01-Shape/sketch_04_alpha/sketch_04_alpha.pde: -------------------------------------------------------------------------------- 1 | size(720, 480); 2 | 3 | background(136, 211, 237); 4 | 5 | stroke(215, 229, 234); 6 | strokeWeight(18); 7 | line(120, 60, 600, 420); 8 | 9 | fill(28, 120, 152, 102); 10 | noStroke(); 11 | ellipse(360, 240, 360, 360); 12 | -------------------------------------------------------------------------------- /Austin-190426/02-Draw/sketch_01_mouse/sketch_01_mouse.pde: -------------------------------------------------------------------------------- 1 | void setup() { 2 | size(720, 480); 3 | } 4 | 5 | void draw() { 6 | background(204, 204, 204); 7 | ellipse(mouseX, mouseY, 360, 360); 8 | } 9 | -------------------------------------------------------------------------------- /Austin-190426/02-Draw/sketch_02_nobackground/sketch_02_nobackground.pde: -------------------------------------------------------------------------------- 1 | void setup() { 2 | size(720, 480); 3 | } 4 | 5 | void draw() { 6 | //background(204, 204, 204); 7 | ellipse(mouseX, mouseY, 360, 360); 8 | } 9 | -------------------------------------------------------------------------------- /Austin-190426/02-Draw/sketch_03_mousepressed/sketch_03_mousepressed.pde: -------------------------------------------------------------------------------- 1 | void setup() { 2 | size(720, 480); 3 | } 4 | 5 | void draw() { 6 | //background(204, 204, 204); 7 | if (mousePressed) { 8 | ellipse(mouseX, mouseY, 360, 360); 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /Austin-190426/02-Draw/sketch_04_pmouse/sketch_04_pmouse.pde: -------------------------------------------------------------------------------- 1 | void setup() { 2 | size(720, 480); 3 | strokeWeight(6); 4 | } 5 | 6 | void draw() { 7 | //background(204, 204, 204); 8 | if (mousePressed) { 9 | line(mouseX, mouseY, pmouseX, pmouseY); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /Austin-190426/02-Draw/sketch_05_keypressed/sketch_05_keypressed.pde: -------------------------------------------------------------------------------- 1 | color c = color(0, 0, 0); 2 | 3 | void setup() { 4 | size(720, 480); 5 | strokeWeight(6); 6 | background(176, 176, 176); 7 | } 8 | 9 | void draw() { 10 | if (mousePressed) { 11 | stroke(c); 12 | line(mouseX, mouseY, pmouseX, pmouseY); 13 | } 14 | } 15 | 16 | void keyPressed() { 17 | if (key == '1') { 18 | c = color(255, 255, 255); 19 | } else if (key == '2') { 20 | c = color(0, 0, 0); 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /Austin-190426/02-Draw/sketch_06_random/sketch_06_random.pde: -------------------------------------------------------------------------------- 1 | void setup() { 2 | size(720, 480); 3 | background(176, 176, 176); 4 | } 5 | 6 | void draw() { 7 | if (mousePressed) { 8 | noStroke(); 9 | fill(0, 0, 0); 10 | float rx = random(-10, 10); 11 | float ry = random(-10, 10); 12 | ellipse(mouseX+rx, mouseY+ry, 6, 6); 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /Austin-190426/02-Draw/sketch_07_thickness/sketch_07_thickness.pde: -------------------------------------------------------------------------------- 1 | void setup() { 2 | size(720, 480); 3 | background(176, 176, 176); 4 | } 5 | 6 | void draw() { 7 | if (mousePressed) { 8 | float thick = dist(mouseX, mouseY, pmouseX, pmouseY); 9 | strokeWeight(thick); 10 | stroke(0, 0, 0); 11 | line(mouseX, mouseY, pmouseX, pmouseY); 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /Austin-190426/02-Draw/sketch_08_smooth/sketch_08_smooth.pde: -------------------------------------------------------------------------------- 1 | float thick = 1; 2 | 3 | void setup() { 4 | size(720, 480); 5 | background(176, 176, 176); 6 | } 7 | 8 | void draw() { 9 | if (mousePressed) { 10 | float targetThick = dist(mouseX, mouseY, pmouseX, pmouseY); 11 | thick += (targetThick - thick) * 0.05; 12 | strokeWeight(thick); 13 | stroke(0, 0, 0); 14 | line(mouseX, mouseY, pmouseX, pmouseY); 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /Austin-190426/03-Image/sketch_01_draw_image/data/pia22332.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/03-Image/sketch_01_draw_image/data/pia22332.jpg -------------------------------------------------------------------------------- /Austin-190426/03-Image/sketch_01_draw_image/data/pia22512.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/03-Image/sketch_01_draw_image/data/pia22512.jpg -------------------------------------------------------------------------------- /Austin-190426/03-Image/sketch_01_draw_image/sketch_01_draw_image.pde: -------------------------------------------------------------------------------- 1 | PImage img; 2 | 3 | void setup() { 4 | size(720, 480); 5 | // Place image in the "data" folder 6 | // in the sketch folder, see 7 | // Sketch > Show Sketch Folder 8 | img = loadImage("pia22512.jpg"); 9 | } 10 | 11 | void draw() { 12 | image(img, 0, 0); 13 | } 14 | -------------------------------------------------------------------------------- /Austin-190426/03-Image/sketch_02_image_size/data/pia22332.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/03-Image/sketch_02_image_size/data/pia22332.jpg -------------------------------------------------------------------------------- /Austin-190426/03-Image/sketch_02_image_size/data/pia22512.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/03-Image/sketch_02_image_size/data/pia22512.jpg -------------------------------------------------------------------------------- /Austin-190426/03-Image/sketch_02_image_size/sketch_02_image_size.pde: -------------------------------------------------------------------------------- 1 | PImage img; 2 | 3 | void setup() { 4 | size(720, 480); 5 | img = loadImage("pia22512.jpg"); 6 | } 7 | 8 | void draw() { 9 | background(255); 10 | image(img, 50, 60, 200, 300); 11 | image(img, 250, 120, 500, 300); 12 | } 13 | -------------------------------------------------------------------------------- /Austin-190426/03-Image/sketch_03_image_alpha/data/pia22332.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/03-Image/sketch_03_image_alpha/data/pia22332.jpg -------------------------------------------------------------------------------- /Austin-190426/03-Image/sketch_03_image_alpha/data/pia22512.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/03-Image/sketch_03_image_alpha/data/pia22512.jpg -------------------------------------------------------------------------------- /Austin-190426/03-Image/sketch_03_image_alpha/sketch_03_image_alpha.pde: -------------------------------------------------------------------------------- 1 | PImage img; 2 | 3 | void setup() { 4 | size(720, 480); 5 | // Place image in the "data" folder 6 | // in the sketch folder 7 | img = loadImage("pia22512.jpg"); 8 | } 9 | 10 | void draw() { 11 | background(255); 12 | tint(204, 255, 0); 13 | image(img, 50, 60, 200, 300); 14 | tint(255, 255, 255, 102); 15 | image(img, 250, 120, 500, 300); 16 | image(img, 250, 220, 500, 300); 17 | } 18 | -------------------------------------------------------------------------------- /Austin-190426/04-Layers/sketch_01_layer/sketch_01_layer.pde: -------------------------------------------------------------------------------- 1 | PGraphics layer; 2 | 3 | void setup() { 4 | size(720, 480); 5 | layer = createGraphics(width, height); 6 | layer.beginDraw(); 7 | layer.background(149, 222, 234); 8 | layer.endDraw(); 9 | } 10 | 11 | void draw() { 12 | if (mousePressed) { 13 | layer.beginDraw(); 14 | layer.stroke(0, 0, 0); 15 | layer.line(mouseX, mouseY, pmouseX, pmouseY); 16 | layer.endDraw(); 17 | } 18 | image(layer, 0, 0); 19 | } 20 | -------------------------------------------------------------------------------- /Austin-190426/04-Layers/sketch_02_saveimage/sketch_02_saveimage.pde: -------------------------------------------------------------------------------- 1 | PGraphics layer; 2 | int frame = 0; 3 | 4 | void setup() { 5 | size(720, 480); 6 | layer = createGraphics(width, height); 7 | layer.beginDraw(); 8 | layer.background(149, 222, 234); 9 | layer.endDraw(); 10 | } 11 | 12 | void draw() { 13 | if (mousePressed) { 14 | layer.beginDraw(); 15 | layer.stroke(0, 0, 0); 16 | layer.line(mouseX, mouseY, pmouseX, pmouseY); 17 | layer.endDraw(); 18 | } 19 | image(layer, 0, 0); 20 | } 21 | 22 | void keyPressed() { 23 | if (key == ' ') { 24 | layer.save("test-" + nf(frame, 4) + ".png"); 25 | frame++; // Add 1 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0000.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0000.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0001.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0001.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0002.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0002.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0003.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0003.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0004.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0004.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0005.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0005.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0006.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0006.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0007.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0007.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0008.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0008.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0009.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0009.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0010.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0010.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0011.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/data/cube-12fps-0011.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_01_loadframes/sketch_01_loadframes.pde: -------------------------------------------------------------------------------- 1 | String filenamePrefix = "cube-12fps-"; 2 | int totalFrames = 12; 3 | PImage frame; 4 | int currentFrame = 0; 5 | 6 | void setup() { 7 | size(720, 480); 8 | loadFrame(); 9 | } 10 | 11 | void draw() { 12 | image(frame, 0, 0, width, height); 13 | } 14 | 15 | void keyPressed() { 16 | if (key == CODED) { 17 | if (keyCode == LEFT) { // Left arrow key 18 | currentFrame--; 19 | if (currentFrame < 0) { 20 | currentFrame = totalFrames - 1; 21 | } 22 | loadFrame(); 23 | } else if (keyCode == RIGHT) { // Right arrow key 24 | currentFrame++; 25 | if (currentFrame >= totalFrames) { 26 | currentFrame = 0; 27 | } 28 | loadFrame(); 29 | } 30 | } 31 | } 32 | 33 | void loadFrame() { 34 | String filename = filenamePrefix + nf(currentFrame, 4) + ".png"; 35 | frame = loadImage(filename); 36 | println(currentFrame + " / " + (totalFrames-1)); 37 | } 38 | -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0000.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0000.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0001.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0001.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0002.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0002.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0003.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0003.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0004.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0004.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0005.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0005.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0006.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0006.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0007.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0007.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0008.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0008.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0009.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0009.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0010.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0010.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0011.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/animation-0011.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0000.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0000.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0001.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0001.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0002.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0002.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0003.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0003.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0004.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0004.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0005.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0005.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0006.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0006.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0007.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0007.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0008.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0008.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0009.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0009.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0010.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0010.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0011.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/data/cube-12fps-0011.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_02_savedrawings/sketch_02_savedrawings.pde: -------------------------------------------------------------------------------- 1 | String videoPrefix = "cube-12fps-"; 2 | int totalFrames = 12; 3 | PImage videoFrame; 4 | 5 | String drawingPrefix = "animation-"; 6 | PImage drawing; 7 | 8 | int currentFrame = 0; 9 | boolean showVideo = true; 10 | 11 | PGraphics d; // Drawing layer 12 | 13 | void setup() { 14 | size(720, 480); 15 | d = createGraphics(width, height); 16 | loadFrame(); 17 | loadDrawing(); 18 | } 19 | 20 | void draw() { 21 | background(153); 22 | if (showVideo) { 23 | image(videoFrame, 0, 0, width, height); 24 | } 25 | d.beginDraw(); 26 | d.stroke(0); 27 | d.strokeWeight(3); 28 | if (mousePressed) { 29 | d.line(mouseX, mouseY, pmouseX, pmouseY); 30 | } 31 | d.endDraw(); 32 | image(d, 0, 0, width, height); 33 | } 34 | 35 | void keyPressed() { 36 | if (key == ' ' ) { 37 | showVideo = !showVideo; 38 | } 39 | if (key == CODED) { 40 | if (keyCode == LEFT) { // Left arrow key 41 | saveAnimationFrame(); 42 | currentFrame--; 43 | if (currentFrame < 0) { 44 | currentFrame = totalFrames - 1; 45 | } 46 | loadFrame(); 47 | loadDrawing(); 48 | } else if (keyCode == RIGHT) { // Right arrow key 49 | saveAnimationFrame(); 50 | currentFrame++; 51 | if (currentFrame >= totalFrames) { 52 | currentFrame = 0; 53 | } 54 | loadFrame(); 55 | loadDrawing(); 56 | } 57 | } 58 | } 59 | 60 | void saveAnimationFrame() { 61 | d.save(drawingPrefix + nf(currentFrame, 4) + ".png"); 62 | // Clear the drawing layer 63 | d.beginDraw(); 64 | d.clear(); 65 | d.endDraw(); 66 | } 67 | 68 | void loadFrame() { 69 | String filename = videoPrefix + nf(currentFrame, 4) + ".png"; 70 | videoFrame = loadImage(filename); 71 | println(currentFrame + " / " + (totalFrames-1)); 72 | } 73 | 74 | void loadDrawing() { 75 | try { 76 | String filename = drawingPrefix + nf(currentFrame, 4) + ".png"; 77 | drawing = loadImage(filename); 78 | d.beginDraw(); 79 | d.image(drawing, 0, 0, width, height); 80 | d.endDraw(); 81 | } 82 | catch (Exception e) { 83 | println("Computer says 'No!' " + e); 84 | } 85 | } 86 | -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_03_colorselector/data/colors.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/05-Rotoscope-Demo/sketch_03_colorselector/data/colors.png -------------------------------------------------------------------------------- /Austin-190426/05-Rotoscope-Demo/sketch_03_colorselector/sketch_03_colorselector.pde: -------------------------------------------------------------------------------- 1 | PImage selector; 2 | int sx = 728; 3 | int sy = 6; 4 | color scolor; 5 | 6 | PGraphics drawlayer; 7 | 8 | void setup() { 9 | size(760, 480); 10 | drawlayer = createGraphics(720, 480); 11 | drawlayer.beginDraw(); 12 | drawlayer.background(255, 255, 255); 13 | drawlayer.endDraw(); 14 | selector = loadImage("colors.png"); 15 | scolor = color(0, 0, 0); 16 | background(255, 255, 255); 17 | } 18 | 19 | void draw() { 20 | background(51, 51, 51); 21 | 22 | drawlayer.beginDraw(); 23 | if (mousePressed) { 24 | drawlayer.strokeWeight(4); 25 | drawlayer.stroke(scolor); 26 | drawlayer.line(mouseX, mouseY, pmouseX, pmouseY); 27 | } 28 | drawlayer.endDraw(); 29 | image(drawlayer, 0, 0); 30 | 31 | // Draw the color selector 32 | image(selector, sx, sy); 33 | } 34 | 35 | void keyPressed() { 36 | if (key == ' ') { 37 | drawlayer.save("test-" + nf(frameCount, 4) + ".png"); 38 | } 39 | } 40 | 41 | void mousePressed() { 42 | if (overSelector()) { 43 | scolor = selector.get(mouseX-sx, mouseY-sy); 44 | } 45 | } 46 | 47 | boolean overSelector() { 48 | if (mouseX > sx && mouseX < sx+selector.width && 49 | mouseY > sy && mouseY < sy+selector.height) { 50 | return true; 51 | } else { 52 | return false; 53 | } 54 | } 55 | -------------------------------------------------------------------------------- /Austin-190426/06-Xtra/cube_createvideo_12fps/cube_createvideo_12fps.pde: -------------------------------------------------------------------------------- 1 | float angle = 0; 2 | 3 | void setup() { 4 | size(720, 480, P3D); 5 | smooth(8); 6 | noStroke(); 7 | colorMode(RGB, 1); 8 | } 9 | 10 | void draw() { 11 | background(0.5); 12 | 13 | pushMatrix(); 14 | translate(width/2, height/2, 0); 15 | rotateY(angle); 16 | noFill(); 17 | stroke(255, 255, 255); 18 | box(200); 19 | popMatrix(); 20 | 21 | if (angle > HALF_PI) { 22 | exit(); 23 | } else { 24 | saveFrame("cube-12fps-" + nf(frameCount, 4) + ".png"); 25 | } 26 | 27 | angle += HALF_PI / 12.0; 28 | } 29 | -------------------------------------------------------------------------------- /Austin-190426/06-Xtra/cube_createvideo_24fps/cube_createvideo_24fps.pde: -------------------------------------------------------------------------------- 1 | float angle = 0; 2 | 3 | void setup() { 4 | size(720, 480, P3D); 5 | smooth(8); 6 | noStroke(); 7 | colorMode(RGB, 1); 8 | } 9 | 10 | void draw() { 11 | background(0.5); 12 | 13 | pushMatrix(); 14 | translate(width/2, height/2, 0); 15 | rotateY(angle); 16 | noFill(); 17 | stroke(255, 255, 255); 18 | box(200); 19 | popMatrix(); 20 | 21 | if (angle > HALF_PI) { 22 | exit(); 23 | } else { 24 | saveFrame("cube-24fps-" + nf(frameCount, 4) + ".png"); 25 | } 26 | 27 | angle += HALF_PI / 48.0; 28 | } 29 | -------------------------------------------------------------------------------- /Austin-190426/06-Xtra/video_loop/data/cube-spin.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/Austin-190426/06-Xtra/video_loop/data/cube-spin.mp4 -------------------------------------------------------------------------------- /Austin-190426/06-Xtra/video_loop/video_loop.pde: -------------------------------------------------------------------------------- 1 | import processing.video.*; 2 | 3 | Movie cube; 4 | 5 | void setup() { 6 | size(720, 480); 7 | // Load and play the video in a loop 8 | cube = new Movie(this, "cube-spin.mp4"); 9 | cube.loop(); 10 | } 11 | 12 | void draw() { 13 | // If a new frame is available, read it 14 | if (cube.available() == true) { 15 | cube.read(); 16 | } 17 | image(cube, 0, 0, width, height); 18 | } 19 | -------------------------------------------------------------------------------- /Hammer-120323/HammerField/FlowField.pde: -------------------------------------------------------------------------------- 1 | /** 2 | * 3 | * FLOW FIELD 4 | * 5 | */ 6 | 7 | class FlowField { 8 | 9 | // A flow field is a two dimensional array of PVectors 10 | PVector[][] field; 11 | int cols, rows; // Columns and Rows 12 | int resolution; // How large is each "cell" of the flow field 13 | int halfRes; 14 | 15 | FlowField(int res) { 16 | resolution = res; 17 | halfRes = resolution/2; 18 | // Determine the number of columns and rows based on sketch's width and height 19 | cols = width/resolution; 20 | rows = height/resolution; 21 | field = new PVector[cols][rows]; 22 | init(); 23 | } 24 | 25 | void init() { 26 | // Reseed noise so we get a new flow field every time 27 | noiseSeed((int)random(10000)); 28 | float xoff = 0; 29 | for (int i = 0; i < cols; i++) { 30 | float yoff = 0; 31 | for (int j = 0; j < rows; j++) { 32 | float theta = map(noise(xoff, yoff), 0, 1, 0, TWO_PI); 33 | // Polar to cartesian coordinate transformation to get x and y components of the vector 34 | field[i][j] = new PVector(cos(theta), sin(theta)); 35 | yoff += fieldDiff; 36 | } 37 | xoff += fieldDiff; 38 | } 39 | } 40 | 41 | // Draw every vector 42 | void display() { 43 | pushMatrix(); 44 | translate(resolution, resolution); 45 | for (int i = 0; i < cols; i++) { 46 | for (int j = 0; j < rows; j++) { 47 | drawVector(field[i][j], i*resolution, j*resolution, resolution-2); 48 | } 49 | } 50 | popMatrix(); 51 | } 52 | 53 | // Renders a vector object 'v' as an arrow and a location 'x,y' 54 | void drawVector(PVector v, float x, float y, float scayl) { 55 | pushMatrix(); 56 | float arrowsize = 4; 57 | // Translate to location to render vector 58 | translate(x, y); 59 | stroke(102); 60 | strokeWeight(0.5); 61 | // Call vector heading function to get direction (note that pointing up is a heading of 0) and rotate 62 | rotate(v.heading2D()); 63 | // Calculate length of vector & scale it to be bigger or smaller if necessary 64 | float len = v.mag()*scayl*0.5; 65 | // Draw three lines to make an arrow (draw pointing up since we've rotate to the proper direction) 66 | line(-len, 0, len, 0); 67 | //line(len,0,len-arrowsize,+arrowsize/2); 68 | //line(len,0,len-arrowsize,-arrowsize/2); 69 | popMatrix(); 70 | } 71 | 72 | PVector lookup(PVector lookup) { 73 | int column = int(constrain(lookup.x/resolution, 0, cols-1)); 74 | int row = int(constrain(lookup.y/resolution, 0, rows-1)); 75 | return field[column][row].get(); 76 | } 77 | } 78 | -------------------------------------------------------------------------------- /Hammer-120323/HammerField/HammerField.pde: -------------------------------------------------------------------------------- 1 | /** 2 | 3 | PRINT PAPER PROCESS: MARBLING AND TECHNOLOGY 4 | 23 FEB 2013, HAMMER MUSEUM 5 | UCLA ARTS SOFTWARE STUDIO 6 | (Based on code in Dan Shiffman's Nature of Code ) 7 | 8 | Operate the program with the mouse, keyboard, or modify the code. 9 | 10 | Click to draw a new field 11 | Click right to draw a uniform field 12 | Click left to draw a scattered field 13 | 14 | BASIC USE 15 | Spacebar - save PDF 16 | 17 | MODIFY 18 | + - increase size 19 | - - descrease size 20 | R - reset particles 21 | D - density of field 22 | 23 | GRAPHICS 24 | 1 - circles 25 | 2 - lines 26 | 3 - triangles 27 | 28 | COLOR 29 | 5 - grays 30 | 6 - contrast 31 | 7 - color 32 | 33 | HIDE/REVEAL 34 | F - field hide 35 | P - particle hide 36 | 37 | */ 38 | 39 | // Add you name here 40 | String name = "Your-Name-Here"; 41 | 42 | // Change the number of particles 43 | int numParticles = 2400; // Try up to 20000; 44 | 45 | // 46 | 47 | // More control over the desity of the grid 48 | int gridSize = 20; 49 | 50 | // These allow more control over the particle motion 51 | float speedLow = 2; 52 | float speedHigh = 5; 53 | float forceLow = 0.1; 54 | float forceHigh = 0.5; 55 | 56 | // Set the initial size range of the particles 57 | float minSize = 10; 58 | float maxSize = 30; 59 | 60 | // Change the colors for color mode (7) 61 | // Click "Color Selector" from the Tools menu 62 | color c1 = #8DD30D; 63 | color c2 = #F0CE46; 64 | color c3 = #70BDBF; 65 | color c4 = #E3B0E3; 66 | color c5 = #2079D1; 67 | 68 | color[] colors = {c1, c2, c3, c4, c5}; 69 | 70 | color backgroundColor = #FFFFFF; 71 | 72 | int smoothAmount = 8; // Can be 0, 2, 4, 8 73 | 74 | 75 | // 76 | 77 | import processing.pdf.*; 78 | 79 | FlowField flowfield; // FlowField object 80 | ArrayList particles; // An ArrayList of Particles 81 | 82 | float fieldDiff = 0.1; 83 | boolean captureField = false; 84 | 85 | int graphicsMode = 1; 86 | 87 | boolean showField = true; 88 | boolean showParticles = true; 89 | int colorMode = 1; 90 | 91 | float scalar = 0.3; 92 | 93 | void setup() { 94 | size(756, 576, P2D); 95 | smooth(smoothAmount); 96 | generateField(); 97 | generateParticles(); 98 | } 99 | 100 | void generateParticles() { 101 | particles = new ArrayList(); 102 | for (int i = 0; i < numParticles; i++) { 103 | float rx = random(width); 104 | float ry = random(height); 105 | float speed = random(speedLow, speedHigh); 106 | float force = random(forceLow, forceHigh); 107 | particles.add(new Particle(new PVector(rx, ry), speed, force, minSize, maxSize)); 108 | } 109 | } 110 | 111 | void generateField() { 112 | flowfield = new FlowField(gridSize); 113 | } 114 | 115 | void draw() { 116 | 117 | // Start creating the PDF 118 | if (captureField == true) { 119 | beginRecord(PDF, "Field-" + name + "-" + nf(frameCount, 8) + ".pdf"); 120 | } 121 | 122 | // Make the background a solid color 123 | background(backgroundColor); 124 | 125 | // Draw the vector field 126 | if (showField) { 127 | flowfield.display(); 128 | } 129 | 130 | // Tell all the Particles to follow the flow field 131 | if (showParticles) { 132 | for (Particle v : particles) { 133 | v.follow(flowfield); 134 | v.run(); 135 | v.display(); 136 | } 137 | } 138 | 139 | // Finish the PDF 140 | if (captureField == true) { 141 | endRecord(); 142 | captureField = false; 143 | } 144 | } 145 | 146 | // Make a new flowfield 147 | void mousePressed() { 148 | fieldDiff = map(mouseX, 0, width, 0.5, 0.01); 149 | flowfield.init(); 150 | } 151 | 152 | 153 | 154 | 155 | 156 | 157 | -------------------------------------------------------------------------------- /Hammer-120323/HammerField/KeyCapture.pde: -------------------------------------------------------------------------------- 1 | /** 2 | * 3 | * KEYBOARD 4 | * 5 | */ 6 | 7 | void keyPressed() { 8 | 9 | if (key == 'd' || key == 'D') { 10 | gridSize += 10; 11 | if (gridSize > 50) { 12 | gridSize = 10; 13 | } 14 | generateField(); 15 | } 16 | 17 | if (key == 'f' || key == 'F') { 18 | showField = !showField; 19 | } 20 | 21 | if (key == 'p' || key == 'P') { 22 | showParticles = !showParticles; 23 | } 24 | 25 | if (key == 'r' || key == 'R') { 26 | generateParticles(); 27 | } 28 | 29 | if (key == ' ') { 30 | captureField = true; 31 | } 32 | 33 | if (key == '1') { 34 | graphicsMode = 1; 35 | } 36 | if (key == '2') { 37 | graphicsMode = 2; 38 | } 39 | if (key == '3') { 40 | graphicsMode = 3; 41 | } 42 | 43 | if (key == '5') { 44 | colorMode = 1; 45 | for (Particle v : particles) { 46 | v.setColor(); 47 | } 48 | } 49 | if (key == '6') { 50 | colorMode = 2; 51 | for (Particle v : particles) { 52 | v.setColor(); 53 | } 54 | } 55 | if (key == '7') { 56 | colorMode = 3; 57 | for (Particle v : particles) { 58 | v.setColor(); 59 | } 60 | } 61 | 62 | if (key == '=' || key == '+') { 63 | scalar += 0.1; 64 | } 65 | if (key == '-' || key == '_') { 66 | scalar -= 0.1; 67 | } 68 | scalar = constrain(scalar, 0.1, 2.0); 69 | 70 | } 71 | 72 | -------------------------------------------------------------------------------- /Hammer-120323/HammerField/Particle.pde: -------------------------------------------------------------------------------- 1 | /** 2 | * 3 | * PARTICLE 4 | * 5 | */ 6 | 7 | class Particle { 8 | 9 | // The usual stuff 10 | PVector location; 11 | PVector velocity; 12 | PVector acceleration; 13 | float r; 14 | float maxforce; // Maximum steering force 15 | float maxspeed; // Maximum speed 16 | color c; 17 | float alpha = 204; 18 | 19 | Particle(PVector l, float ms, float mf, float minrad, float maxrad) { 20 | location = l.get(); 21 | r = random(minrad, maxrad); 22 | maxspeed = ms; 23 | maxforce = mf; 24 | acceleration = new PVector(0, 0); 25 | velocity = new PVector(0, 0); 26 | setColor(); 27 | } 28 | 29 | void setColor() { 30 | if (colorMode == 1) { 31 | alpha = 204; 32 | c = color(random(0, 204)); 33 | } 34 | else if (colorMode == 2) { 35 | alpha = 255; 36 | if (random(1) > 0.5) { 37 | c = color(255); 38 | } 39 | else { 40 | c = color(0); 41 | } 42 | } 43 | else { 44 | alpha = 204; 45 | int rpick = int(random(5)); 46 | c = colors[rpick]; 47 | } 48 | } 49 | 50 | void run() { 51 | update(); 52 | borders(); 53 | } 54 | 55 | void display() { 56 | displayParticle(); 57 | } 58 | 59 | // Implementing Reynolds' flow field following algorithm 60 | // http://www.red3d.com/cwr/steer/FlowFollow.html 61 | void follow(FlowField flow) { 62 | // What is the vector at that spot in the flow field? 63 | PVector desired = flow.lookup(location); 64 | // Scale it up by maxspeed 65 | desired.mult(maxspeed); 66 | // Steering is desired minus velocity 67 | PVector steer = PVector.sub(desired, velocity); 68 | steer.limit(maxforce); // Limit to maximum steering force 69 | applyForce(steer); 70 | } 71 | 72 | void applyForce(PVector force) { 73 | // We could add mass here if we want A = F / M 74 | acceleration.add(force); 75 | } 76 | 77 | // Method to update location 78 | void update() { 79 | // Update velocity 80 | velocity.add(acceleration); 81 | // Limit speed 82 | velocity.limit(maxspeed); 83 | location.add(velocity); 84 | // Reset accelertion to 0 each cycle 85 | acceleration.mult(0); 86 | } 87 | 88 | void displayParticle() { 89 | // Draw a triangle rotated in the direction of velocity 90 | float theta = velocity.heading2D() + HALF_PI; 91 | 92 | float rr = r * scalar; 93 | 94 | pushMatrix(); 95 | translate(location.x, location.y); 96 | rotate(theta); 97 | 98 | if (graphicsMode == 1) { 99 | 100 | stroke(c, alpha); 101 | strokeCap(ROUND); 102 | strokeWeight(rr); 103 | point(0, 0); 104 | } 105 | else if (graphicsMode == 2) { 106 | 107 | stroke(c, alpha); 108 | strokeWeight(rr/4.0); 109 | strokeCap(SQUARE); 110 | stroke(c); 111 | line(-rr, 0, rr, 0); 112 | } 113 | else if (graphicsMode == 3) { 114 | 115 | noStroke(); 116 | fill(c, alpha); 117 | beginShape(TRIANGLES); 118 | vertex(0, -rr); 119 | vertex(-rr/2, rr); 120 | vertex(rr/2, rr); 121 | endShape(); 122 | } 123 | 124 | popMatrix(); 125 | } 126 | 127 | // Wraparound 128 | void borders() { 129 | if (location.x < -r) location.x = width+r; 130 | if (location.y < -r) location.y = height+r; 131 | if (location.x > width+r) location.x = -r; 132 | if (location.y > height+r) location.y = -r; 133 | } 134 | } 135 | 136 | -------------------------------------------------------------------------------- /Hammer-120323/README.md: -------------------------------------------------------------------------------- 1 | Hammer Museum Workshop 23 February 2013 2 | ========== 3 | 4 | The Hammer Student Association and the UCLA Horn Press Present: 5 | 6 | - A FREE workshop on paper marbling and pattern programming using Processing led by Rebecca Chamlee of Pie In the Sky Press and Casey Reas of the UCLA Arts Software Studio. 7 | - Hands-on: marbling paper and digital pattern making. 8 | - Wear comfortable clothes, shoes and bring laptops and chargers! 9 | - We request that students install the free Processing software before attending at: http://processing.org/download/ 10 | 11 | 13 | 14 | The Annex @Hammer Museum 15 | Corner of Wilshire & Westwood 16 | 10899 Wilshire Blvd 17 | 18 | http://hammer.ucla.edu 19 | http://facebook.com/HammerStudentAssociation 20 | http://twitter.com/hsaucla 21 | 22 | As a graphic design student at Otic College of Art and Design, Rebecca was introduced to letterpress printing and small edition books. Her experience has continued to inspire and inform the direction she has taken her career as an artist and designer. Since then she has served as adjunct faculty at Otis College of Art and Design and established a small private press, Pie in the Sky Press in Ventura County, California. 23 | For more information about Rebecca's work, please visit: http://www.pieintheskypress.com/ 24 | 25 | The UCLA Arts Software Studio is a group of individuals who develop software within the context of the arts. The studio, started in 2012, is directed by Casey Reas, a professor in the UCLA Department of Design Media Arts. For the last decade, Reas' software, prints, and installations have been featured in numerous solo and group exhibitions at museums and galleries in the United States, Europe, and Asia. The Software Studio's goal is to nurture work and discussion around software and the arts at UCLA and beyond. For more information, visit http://software.arts.ucla.edu/, http://reas.com/, and http://processing.org/ 26 | -------------------------------------------------------------------------------- /Hammer-120323/Steps/A_Line/A_Line.pde: -------------------------------------------------------------------------------- 1 | 2 | int gridSize = 20; 3 | 4 | void setup() { 5 | size(756, 576); 6 | strokeWeight(2); 7 | } 8 | 9 | void draw() { 10 | 11 | background(204); 12 | 13 | for (int x = 0; x <= width; x+=gridSize) { 14 | line(x, height/2-20, x, height/2+20); 15 | } 16 | 17 | } 18 | 19 | -------------------------------------------------------------------------------- /Hammer-120323/Steps/B_Line/B_Line.pde: -------------------------------------------------------------------------------- 1 | 2 | int gridSize = 20; 3 | 4 | void setup() { 5 | size(756, 576); 6 | strokeWeight(2); 7 | } 8 | 9 | void draw() { 10 | 11 | background(204); 12 | 13 | for (int y = 0; y <= height; y+=gridSize) { 14 | line(width/2-20, y, width/2+20, y); 15 | } 16 | 17 | } 18 | 19 | -------------------------------------------------------------------------------- /Hammer-120323/Steps/C_Field/C_Field.pde: -------------------------------------------------------------------------------- 1 | 2 | int gridSize = 20; 3 | 4 | void setup() { 5 | size(756, 576); 6 | strokeWeight(2); 7 | } 8 | 9 | void draw() { 10 | 11 | background(204); 12 | 13 | for (int y = 0; y <= height; y+=gridSize) { 14 | for (int x = 0; x <= width; x+=gridSize) { 15 | line(x-5, y, x+5, y); 16 | line(x, y-5, x, y+5); 17 | } 18 | } 19 | 20 | } 21 | 22 | -------------------------------------------------------------------------------- /Hammer-120323/Steps/D_RandomField/D_RandomField.pde: -------------------------------------------------------------------------------- 1 | 2 | int gridSize = 20; 3 | 4 | void setup() { 5 | size(756, 576); 6 | strokeWeight(2); 7 | frameRate(1); 8 | } 9 | 10 | void draw() { 11 | 12 | background(204); 13 | 14 | for (int y = 0; y <= height; y+=gridSize) { 15 | for (int x = 0; x <= width; x+=gridSize) { 16 | pushMatrix(); 17 | translate(x, y); 18 | float rand = random(TWO_PI); 19 | rotate(rand); 20 | line(-10, 0, 10, 0); 21 | popMatrix(); 22 | } 23 | } 24 | 25 | } 26 | 27 | -------------------------------------------------------------------------------- /Hammer-120323/Steps/E_NoiseField/E_NoiseField.pde: -------------------------------------------------------------------------------- 1 | 2 | float increment = 0.01; 3 | int gridSize = 20; 4 | 5 | void setup() { 6 | size(756, 576); 7 | strokeWeight(2); 8 | frameRate(1); 9 | } 10 | 11 | void draw() { 12 | 13 | noiseSeed((int)random(10000)); 14 | 15 | background(204); 16 | 17 | float yoff = 0; 18 | 19 | for (int y = 0; y <= height; y+=gridSize) { 20 | yoff += increment; 21 | float xoff = 0.0; 22 | for (int x = 0; x <= width; x+=gridSize) { 23 | xoff += increment; 24 | pushMatrix(); 25 | translate(x, y); 26 | float rand = map(noise(xoff, yoff), 0, 1, 0, TWO_PI); 27 | rotate(rand); 28 | line(-10, 0, 10, 0); 29 | popMatrix(); 30 | xoff += increment; 31 | } 32 | yoff += increment; 33 | } 34 | 35 | } 36 | 37 | -------------------------------------------------------------------------------- /Hammer-120323/Steps/F_Particle/F_Particle.pde: -------------------------------------------------------------------------------- 1 | /** 2 | 3 | PRINT PAPER PROCESS: MARBLING AND TECHNOLOGY 4 | 23 FEB 2013, HAMMER MUSEUM 5 | UCLA ARTS SOFTWARE STUDIO 6 | (Based on code in Dan Shiffman's Nature of Code ) 7 | 8 | Operate the program with the mouse, keyboard, or modify the code. 9 | 10 | Click to draw a new field 11 | Click right to draw a uniform field 12 | Click left to draw a scattered field 13 | 14 | BASIC USE 15 | Spacebar - save PDF 16 | 17 | MODIFY 18 | + - increase size 19 | - - descrease size 20 | R - reset particles 21 | D - density of field 22 | 23 | GRAPHICS 24 | 1 - circles 25 | 2 - lines 26 | 3 - triangles 27 | 28 | COLOR 29 | 5 - grays 30 | 6 - contrast 31 | 7 - color 32 | 33 | HIDE/REVEAL 34 | F - field hide 35 | P - particle hide 36 | 37 | */ 38 | 39 | // Add you name here 40 | String name = "Your-Name-Here"; 41 | 42 | // Change the number of particles 43 | int numParticles = 1; // Try up to 20000; 44 | 45 | // 46 | 47 | // More control over the desity of the grid 48 | int gridSize = 20; 49 | 50 | // These allow more control over the particle motion 51 | float speedLow = 2; 52 | float speedHigh = 5; 53 | float forceLow = 0.1; 54 | float forceHigh = 0.5; 55 | 56 | // Set the initial size range of the particles 57 | float minSize = 30; 58 | float maxSize = 30; 59 | 60 | // Change the colors for color mode (7) 61 | // Click "Color Selector" from the Tools menu 62 | color c1 = #8DD30D; 63 | color c2 = #F0CE46; 64 | color c3 = #70BDBF; 65 | color c4 = #E3B0E3; 66 | color c5 = #2079D1; 67 | 68 | color[] colors = {c1, c2, c3, c4, c5}; 69 | 70 | color backgroundColor = #FFFFFF; 71 | 72 | int smoothAmount = 8; // Can be 0, 2, 4, 8 73 | 74 | 75 | // 76 | 77 | import processing.pdf.*; 78 | 79 | FlowField flowfield; // FlowField object 80 | ArrayList particles; // An ArrayList of Particles 81 | 82 | float fieldDiff = 0.1; 83 | boolean captureField = false; 84 | 85 | int graphicsMode = 3; 86 | 87 | boolean showField = true; 88 | boolean showParticles = true; 89 | int colorMode = 1; 90 | 91 | float scalar = 1; 92 | 93 | void setup() { 94 | size(756, 576, P2D); 95 | smooth(smoothAmount); 96 | generateField(); 97 | generateParticles(); 98 | } 99 | 100 | void generateParticles() { 101 | particles = new ArrayList(); 102 | for (int i = 0; i < numParticles; i++) { 103 | float rx = random(width); 104 | float ry = random(height); 105 | float speed = random(speedLow, speedHigh); 106 | float force = random(forceLow, forceHigh); 107 | particles.add(new Particle(new PVector(rx, ry), speed, force, minSize, maxSize)); 108 | } 109 | } 110 | 111 | void generateField() { 112 | flowfield = new FlowField(gridSize); 113 | } 114 | 115 | void draw() { 116 | 117 | // Start creating the PDF 118 | if (captureField == true) { 119 | beginRecord(PDF, "Field-" + name + "-" + nf(frameCount, 8) + ".pdf"); 120 | } 121 | 122 | // Make the background a solid color 123 | background(backgroundColor); 124 | 125 | // Draw the vector field 126 | if (showField) { 127 | flowfield.display(); 128 | } 129 | 130 | // Tell all the Particles to follow the flow field 131 | if (showParticles) { 132 | for (Particle v : particles) { 133 | v.follow(flowfield); 134 | v.run(); 135 | v.display(); 136 | } 137 | } 138 | 139 | // Finish the PDF 140 | if (captureField == true) { 141 | endRecord(); 142 | captureField = false; 143 | } 144 | } 145 | 146 | // Make a new flowfield 147 | void mousePressed() { 148 | fieldDiff = map(mouseX, 0, width, 0.5, 0.01); 149 | flowfield.init(); 150 | } 151 | 152 | 153 | 154 | 155 | 156 | 157 | -------------------------------------------------------------------------------- /Hammer-120323/Steps/F_Particle/FlowField.pde: -------------------------------------------------------------------------------- 1 | /** 2 | * 3 | * FLOW FIELD 4 | * 5 | */ 6 | 7 | class FlowField { 8 | 9 | // A flow field is a two dimensional array of PVectors 10 | PVector[][] field; 11 | int cols, rows; // Columns and Rows 12 | int resolution; // How large is each "cell" of the flow field 13 | int halfRes; 14 | 15 | FlowField(int res) { 16 | resolution = res; 17 | halfRes = resolution/2; 18 | // Determine the number of columns and rows based on sketch's width and height 19 | cols = width/resolution; 20 | rows = height/resolution; 21 | field = new PVector[cols][rows]; 22 | init(); 23 | } 24 | 25 | void init() { 26 | // Reseed noise so we get a new flow field every time 27 | noiseSeed((int)random(10000)); 28 | float xoff = 0; 29 | for (int i = 0; i < cols; i++) { 30 | float yoff = 0; 31 | for (int j = 0; j < rows; j++) { 32 | float theta = map(noise(xoff, yoff), 0, 1, 0, TWO_PI); 33 | // Polar to cartesian coordinate transformation to get x and y components of the vector 34 | field[i][j] = new PVector(cos(theta), sin(theta)); 35 | yoff += fieldDiff; 36 | } 37 | xoff += fieldDiff; 38 | } 39 | } 40 | 41 | // Draw every vector 42 | void display() { 43 | pushMatrix(); 44 | translate(resolution, resolution); 45 | for (int i = 0; i < cols; i++) { 46 | for (int j = 0; j < rows; j++) { 47 | drawVector(field[i][j], i*resolution, j*resolution, resolution-2); 48 | } 49 | } 50 | popMatrix(); 51 | } 52 | 53 | // Renders a vector object 'v' as an arrow and a location 'x,y' 54 | void drawVector(PVector v, float x, float y, float scayl) { 55 | pushMatrix(); 56 | float arrowsize = 4; 57 | // Translate to location to render vector 58 | translate(x, y); 59 | stroke(0); 60 | strokeWeight(2); 61 | // Call vector heading function to get direction (note that pointing up is a heading of 0) and rotate 62 | rotate(v.heading2D()); 63 | // Calculate length of vector & scale it to be bigger or smaller if necessary 64 | float len = v.mag()*scayl*0.5; 65 | // Draw three lines to make an arrow (draw pointing up since we've rotate to the proper direction) 66 | line(-len, 0, len, 0); 67 | //line(len,0,len-arrowsize,+arrowsize/2); 68 | //line(len,0,len-arrowsize,-arrowsize/2); 69 | popMatrix(); 70 | } 71 | 72 | PVector lookup(PVector lookup) { 73 | int column = int(constrain(lookup.x/resolution, 0, cols-1)); 74 | int row = int(constrain(lookup.y/resolution, 0, rows-1)); 75 | return field[column][row].get(); 76 | } 77 | } 78 | -------------------------------------------------------------------------------- /Hammer-120323/Steps/F_Particle/KeyCapture.pde: -------------------------------------------------------------------------------- 1 | /** 2 | * 3 | * KEYBOARD 4 | * 5 | */ 6 | 7 | void keyPressed() { 8 | 9 | if (key == 'd' || key == 'D') { 10 | gridSize += 10; 11 | if (gridSize > 50) { 12 | gridSize = 10; 13 | } 14 | generateField(); 15 | } 16 | 17 | if (key == 'f' || key == 'F') { 18 | showField = !showField; 19 | } 20 | 21 | if (key == 'p' || key == 'P') { 22 | showParticles = !showParticles; 23 | } 24 | 25 | if (key == 'r' || key == 'R') { 26 | generateParticles(); 27 | } 28 | 29 | if (key == ' ') { 30 | captureField = true; 31 | } 32 | 33 | if (key == '1') { 34 | graphicsMode = 1; 35 | } 36 | if (key == '2') { 37 | graphicsMode = 2; 38 | } 39 | if (key == '3') { 40 | graphicsMode = 3; 41 | } 42 | 43 | if (key == '5') { 44 | colorMode = 1; 45 | for (Particle v : particles) { 46 | v.setColor(); 47 | } 48 | } 49 | if (key == '6') { 50 | colorMode = 2; 51 | for (Particle v : particles) { 52 | v.setColor(); 53 | } 54 | } 55 | if (key == '7') { 56 | colorMode = 3; 57 | for (Particle v : particles) { 58 | v.setColor(); 59 | } 60 | } 61 | 62 | if (key == '=' || key == '+') { 63 | scalar += 0.1; 64 | } 65 | if (key == '-' || key == '_') { 66 | scalar -= 0.1; 67 | } 68 | scalar = constrain(scalar, 0.1, 2.0); 69 | 70 | } 71 | 72 | -------------------------------------------------------------------------------- /Hammer-120323/Steps/F_Particle/Particle.pde: -------------------------------------------------------------------------------- 1 | /** 2 | * 3 | * PARTICLE 4 | * 5 | */ 6 | 7 | class Particle { 8 | 9 | // The usual stuff 10 | PVector location; 11 | PVector velocity; 12 | PVector acceleration; 13 | float r; 14 | float maxforce; // Maximum steering force 15 | float maxspeed; // Maximum speed 16 | color c; 17 | float alpha = 255; 18 | 19 | Particle(PVector l, float ms, float mf, float minrad, float maxrad) { 20 | location = l.get(); 21 | r = random(minrad, maxrad); 22 | maxspeed = ms; 23 | maxforce = mf; 24 | acceleration = new PVector(0, 0); 25 | velocity = new PVector(0, 0); 26 | setColor(); 27 | } 28 | 29 | void setColor() { 30 | if (colorMode == 1) { 31 | alpha = 255; 32 | c = color(0); 33 | } 34 | else if (colorMode == 2) { 35 | alpha = 255; 36 | if (random(1) > 0.5) { 37 | c = color(255); 38 | } 39 | else { 40 | c = color(0); 41 | } 42 | } 43 | else { 44 | alpha = 204; 45 | int rpick = int(random(5)); 46 | c = colors[rpick]; 47 | } 48 | } 49 | 50 | void run() { 51 | update(); 52 | borders(); 53 | } 54 | 55 | void display() { 56 | displayParticle(); 57 | } 58 | 59 | // Implementing Reynolds' flow field following algorithm 60 | // http://www.red3d.com/cwr/steer/FlowFollow.html 61 | void follow(FlowField flow) { 62 | // What is the vector at that spot in the flow field? 63 | PVector desired = flow.lookup(location); 64 | // Scale it up by maxspeed 65 | desired.mult(maxspeed); 66 | // Steering is desired minus velocity 67 | PVector steer = PVector.sub(desired, velocity); 68 | steer.limit(maxforce); // Limit to maximum steering force 69 | applyForce(steer); 70 | } 71 | 72 | void applyForce(PVector force) { 73 | // We could add mass here if we want A = F / M 74 | acceleration.add(force); 75 | } 76 | 77 | // Method to update location 78 | void update() { 79 | // Update velocity 80 | velocity.add(acceleration); 81 | // Limit speed 82 | velocity.limit(maxspeed); 83 | location.add(velocity); 84 | // Reset accelertion to 0 each cycle 85 | acceleration.mult(0); 86 | } 87 | 88 | void displayParticle() { 89 | // Draw a triangle rotated in the direction of velocity 90 | float theta = velocity.heading2D() + HALF_PI; 91 | 92 | float rr = r * scalar; 93 | 94 | pushMatrix(); 95 | translate(location.x, location.y); 96 | rotate(theta); 97 | 98 | if (graphicsMode == 1) { 99 | 100 | stroke(c, alpha); 101 | strokeCap(ROUND); 102 | strokeWeight(rr); 103 | point(0, 0); 104 | } 105 | else if (graphicsMode == 2) { 106 | 107 | stroke(c, alpha); 108 | strokeWeight(rr/4.0); 109 | strokeCap(SQUARE); 110 | stroke(c); 111 | line(-rr, 0, rr, 0); 112 | } 113 | else if (graphicsMode == 3) { 114 | 115 | noStroke(); 116 | fill(c, alpha); 117 | beginShape(TRIANGLES); 118 | vertex(0, -rr); 119 | vertex(-rr/2, rr); 120 | vertex(rr/2, rr); 121 | endShape(); 122 | } 123 | 124 | popMatrix(); 125 | } 126 | 127 | // Wraparound 128 | void borders() { 129 | if (location.x < -r) location.x = width+r; 130 | if (location.y < -r) location.y = height+r; 131 | if (location.x > width+r) location.x = -r; 132 | if (location.y > height+r) location.y = -r; 133 | } 134 | } 135 | 136 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | UCLA Arts Software Studio Workshops 2 | ========== 3 | 4 | Archive of workshop code, more data included with each workshop. 5 | -------------------------------------------------------------------------------- /TTZ-190811/Outline-01.txt: -------------------------------------------------------------------------------- 1 | // 2 | 3 | Processing: https://processing.org/download/ 4 | 5 | All code files: https://github.com/uclaconditional/workshops/tree/master/TTZ-190811 6 | 7 | Watch, code, etc. 8 | 9 | // 10 | 11 | - Processing Basics 12 | - Form + Code 13 | - Zine Assembly 14 | 15 | // 16 | 17 | PROCESSING BASICS 18 | 19 | - Play 20 | . size(width, height) 21 | - Sketchbook 22 | - Reference 23 | 24 | // 25 | 26 | FORM + CODE 27 | 28 | 1 - Line 29 | . Statement 30 | - background(gray) 31 | - line(x1, y1, x2, y2) 32 | . PDF Export Library 33 | . Drawing properties 34 | - background(r, g, b) 35 | - stroke(gray), stroke(r, g, b) 36 | - strokeWeight(weight) 37 | - strokeCap(cap) 38 | 39 | 2 - Three lines 40 | . variable 41 | . data type 42 | 43 | 3 - Many lines 44 | . loop, repeat one or more lines of code 45 | 46 | 4 - Matrix of lines 47 | . embedded loop 48 | 49 | 5 - Random lines 50 | . random() 51 | - float data type 52 | . random() within a loop 53 | 54 | 6 - Draw lines (setup, draw, mouseX, mouseY) 55 | . setup() and draw() 56 | . mouseX, mouseY, pmouseX, pmouseY 57 | . keyPressed() event 58 | 59 | Cover - Typography 60 | . PFont, textFont(), createFont() 61 | . text() 62 | . textAlign(), textLeading() 63 | . Custom fonts 64 | 65 | // 66 | 67 | ZINE ASSEMBLY 68 | 69 | - Template 70 | 71 | // 72 | 73 | BONUS EXAMPLE 74 | 75 | - Random Book 76 | 77 | // -------------------------------------------------------------------------------- /TTZ-190811/assemble/a-zine.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/assemble/a-zine.pdf -------------------------------------------------------------------------------- /TTZ-190811/assemble/template.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/assemble/template.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Bonus/RandomBook/RandomBook.pde: -------------------------------------------------------------------------------- 1 | // Random Book, 768 Pages of Lines 2 | 3 | import processing.pdf.*; 4 | 5 | PGraphicsPDF pdf; 6 | 7 | void setup() { 8 | size(594, 842); 9 | // randomSeed(0); // Uncomment to make the same book each time 10 | pdf = (PGraphicsPDF)beginRecord(PDF, "RandomBook.pdf"); 11 | beginRecord(pdf); 12 | } 13 | 14 | void draw() { 15 | background(255); 16 | 17 | // 100 lines on each page 18 | for (int i = 0; i < 100; i++) { 19 | float r = random(1.0); 20 | if(r < 0.2) { 21 | stroke(255); 22 | } else { 23 | stroke(0); 24 | } 25 | float sw = pow(random(1.0), 12); 26 | strokeWeight(sw * 260); 27 | float x1 = random(-200, -100); 28 | float x2 = random(width+100, width+200); 29 | float y1 = random(-100, height+100); 30 | float y2 = random(-100, height+100); 31 | line(x1, y1, x2, y2); 32 | } 33 | 34 | if(frameCount == 768) { 35 | endRecord(); 36 | exit(); // Quit 37 | } else { 38 | pdf.nextPage(); // Go to the next page 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /TTZ-190811/code/Bonus/RandomBook/RandomBook.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Bonus/RandomBook/RandomBook.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_01/TTZ_P1_01/TTZ_P1_01.pde: -------------------------------------------------------------------------------- 1 | // Draw a Line 2 | 3 | size(396, 612); 4 | background(255); 5 | line(100, 100, 296, 512); 6 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_01/TTZ_P1_02/TTZ_P1_02.pde: -------------------------------------------------------------------------------- 1 | // Draw a Line + Make a PDF 2 | 3 | import processing.pdf.*; 4 | 5 | size(396, 612); 6 | beginRecord(PDF, "page_1.pdf"); 7 | background(255); 8 | line(100, 100, 296, 512); 9 | endRecord(); 10 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_01/TTZ_P1_02/page_1.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_01/TTZ_P1_02/page_1.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_01/TTZ_P1_03/TTZ_P1_03.pde: -------------------------------------------------------------------------------- 1 | // Draw a Line + Make a PDF 2 | // Drawing Properties (Stroke, Weight, etc.) 3 | 4 | import processing.pdf.*; 5 | 6 | size(396, 612); 7 | beginRecord(PDF, "page_1.pdf"); 8 | background(85, 194, 247); 9 | stroke(255); 10 | strokeWeight(40); 11 | strokeCap(SQUARE); 12 | line(100, 100, 296, 512); 13 | endRecord(); 14 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_01/TTZ_P1_03/page_1.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_01/TTZ_P1_03/page_1.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_02/TTZ_P2_01/TTZ_P2_01.pde: -------------------------------------------------------------------------------- 1 | // Three Lines 2 | 3 | import processing.pdf.*; 4 | 5 | size(396, 612); 6 | beginRecord(PDF, "page_2.pdf"); 7 | background(255); 8 | line(100, 100, 296, 512); 9 | line(50, 200, 296, 140); 10 | line(296, 200, 100, 400); 11 | endRecord(); 12 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_02/TTZ_P2_01/page_2.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_02/TTZ_P2_01/page_2.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_02/TTZ_P2_02/TTZ_P2_02.pde: -------------------------------------------------------------------------------- 1 | // Three Lines + Variables 2 | 3 | import processing.pdf.*; 4 | 5 | size(396, 612); 6 | beginRecord(PDF, "page_2.pdf"); 7 | background(255); 8 | int y = 200; // Try 0, 600, etc. 9 | line(100, 100, 296, 512); 10 | line(50, y, 296, 140); 11 | line(296, y, 100, 400); 12 | endRecord(); 13 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_02/TTZ_P2_02/page_2.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_02/TTZ_P2_02/page_2.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_03/TTZ_P3_01/TTZ_P3_01.pde: -------------------------------------------------------------------------------- 1 | // Many Lines with a Loop 2 | 3 | import processing.pdf.*; 4 | 5 | size(396, 612); 6 | beginRecord(PDF, "page_3.pdf"); 7 | background(255); 8 | // for (init; test; update) 9 | for (int x = 100; x < width; x += 10) { 10 | line(x, 100, x + 196, 512); 11 | } 12 | endRecord(); 13 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_03/TTZ_P3_01/page_3.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_03/TTZ_P3_01/page_3.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_04/TTZ_P4_01/TTZ_P4_01.pde: -------------------------------------------------------------------------------- 1 | // Many Lines with an Embedded Loop 2 | 3 | import processing.pdf.*; 4 | 5 | size(396, 612); 6 | beginRecord(PDF, "page_4.pdf"); 7 | background(255); 8 | for (int x = 0; x < width; x += 10) { 9 | for (int y = 0; y < height; y += 10 ) { 10 | line(x, y, x + 6, y+10); 11 | } 12 | } 13 | endRecord(); 14 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_04/TTZ_P4_01/page_4.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_04/TTZ_P4_01/page_4.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_05/TTZ_P5_01/TTZ_P5_01.pde: -------------------------------------------------------------------------------- 1 | // Random Line 2 | 3 | import processing.pdf.*; 4 | 5 | size(396, 612); 6 | beginRecord(PDF, "page_5.pdf"); 7 | background(255); 8 | float x = random(0, width); 9 | float y = random(0, height); 10 | line(width/2, height/2, x, y); 11 | endRecord(); 12 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_05/TTZ_P5_01/page_5.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_05/TTZ_P5_01/page_5.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_05/TTZ_P5_02/TTZ_P5_02.pde: -------------------------------------------------------------------------------- 1 | // Random Line 2 | 3 | import processing.pdf.*; 4 | 5 | size(396, 612); 6 | beginRecord(PDF, "page_5.pdf"); 7 | background(255); 8 | float x1 = random(0, width); 9 | float y1 = random(0, height); 10 | float x2 = random(0, width); 11 | float y2 = random(0, height); 12 | line(x1, y1, x2, y2); 13 | endRecord(); 14 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_05/TTZ_P5_02/page_5.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_05/TTZ_P5_02/page_5.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_05/TTZ_P5_03/TTZ_P5_03.pde: -------------------------------------------------------------------------------- 1 | // Random Line 2 | 3 | import processing.pdf.*; 4 | 5 | size(396, 612); 6 | beginRecord(PDF, "page_5.pdf"); 7 | int r = int(random(255)); 8 | int g = int(random(255)); 9 | int b = int(random(255)); 10 | background(r, g, b); 11 | int num = int(random(10, 1000)); 12 | for (int i = 0; i < num; i = i+1) { 13 | float x1 = random(0, width); 14 | float y1 = random(0, height); 15 | float x2 = random(0, width); 16 | float y2 = random(0, height); 17 | line(x1, y1, x2, y2); 18 | } 19 | endRecord(); 20 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_05/TTZ_P5_03/page_5.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_05/TTZ_P5_03/page_5.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_06/TTZ_P6_01/TTZ_P6_01.pde: -------------------------------------------------------------------------------- 1 | // Draw lines 2 | 3 | void setup() { 4 | size(396, 612); 5 | background(255); 6 | } 7 | 8 | void draw() { 9 | if (mousePressed) { 10 | line(mouseX, mouseY, pmouseX, pmouseY); 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_06/TTZ_P6_02/TTZ_P6_02.pde: -------------------------------------------------------------------------------- 1 | // Draw lines + Make a PDF 2 | 3 | import processing.pdf.*; 4 | 5 | void setup() { 6 | size(396, 612); 7 | background(255); 8 | beginRecord(PDF, "page_6.pdf"); 9 | } 10 | 11 | void draw() { 12 | if (mousePressed) { 13 | line(mouseX, mouseY, pmouseX, pmouseY); 14 | } 15 | } 16 | 17 | void keyPressed() { 18 | endRecord(); 19 | exit(); 20 | } 21 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_06/TTZ_P6_02/page_6.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_06/TTZ_P6_02/page_6.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_Cover/TTZ_Cover_01/TTZ_Cover_01.pde: -------------------------------------------------------------------------------- 1 | // Cover with lines and text 2 | 3 | import processing.pdf.*; 4 | 5 | size(792, 612); // Twice as wide 6 | beginRecord(PDF, "cover.pdf"); 7 | background(255); 8 | 9 | // Background pattern 10 | for (int y = 0; y < height; y += 5) { 11 | float gradient = map(y, 0, height, 255, 0); 12 | stroke(gradient); 13 | line(0, height/2, width, y); 14 | } 15 | 16 | // Cover text 17 | PFont f = createFont("Times New Roman", 96); 18 | textFont(f); 19 | textAlign(LEFT, CENTER); 20 | textLeading(100); 21 | fill(0); 22 | text("tiny\ntech\nzines", width * 0.6, height/2-30); 23 | 24 | endRecord(); 25 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_Cover/TTZ_Cover_01/cover.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_Cover/TTZ_Cover_01/cover.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_Cover/TTZ_Cover_02_Fonts/TTZ_Cover_02_Fonts.pde: -------------------------------------------------------------------------------- 1 | // Run this code to see the names of the fonts 2 | // on this computer as "seen" by Processing 3 | printArray(PFont.list()); 4 | 5 | // Use this line if there are too many fonts to fit in the Console 6 | //print(PFont.list()); 7 | 8 | // You can also place a font into the "data" folder for the sketch, 9 | // see TTZ_Cover_03_Fonts for that example 10 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_Cover/TTZ_Cover_03/TTZ_Cover_03.pde: -------------------------------------------------------------------------------- 1 | // Cover with lines and text 2 | // Font placed in "data" folder for createFont() 3 | 4 | import processing.pdf.*; 5 | 6 | size(792, 612); // Twice as wide 7 | beginRecord(PDF, "cover.pdf"); 8 | background(255); 9 | 10 | // Background pattern 11 | for (int y = 0; y < height; y += 5) { 12 | float gradient = map(y, 0, height, 255, 0); 13 | stroke(gradient); 14 | line(0, height/2, width, y); 15 | } 16 | 17 | // Cover text 18 | PFont f = createFont("ZXX False.otf", 96); 19 | textFont(f); 20 | textAlign(LEFT, CENTER); 21 | textLeading(100); 22 | fill(0); 23 | text("tiny\ntech\nzines", width * 0.55, height/2-30); 24 | 25 | endRecord(); 26 | -------------------------------------------------------------------------------- /TTZ-190811/code/Page_Cover/TTZ_Cover_03/cover.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_Cover/TTZ_Cover_03/cover.pdf -------------------------------------------------------------------------------- /TTZ-190811/code/Page_Cover/TTZ_Cover_03/data/ZXX False.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uclaconditional/workshops/dc90a70636d19f732af57938b13aa95630a6d42e/TTZ-190811/code/Page_Cover/TTZ_Cover_03/data/ZXX False.otf --------------------------------------------------------------------------------