an iteration on a procedural art project from @randylubin
Built with blockbuilder.org
forked from micahstubbs's block: bezier curve iterations with p5js
Created
July 2, 2017 02:20
-
-
Save zeekay/c115d35f29b854bd3e2ea4d023d703fc to your computer and use it in GitHub Desktop.
bezier curve iterations with p5js
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| license: mit |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.11/p5.min.js"></script> | |
| <!-- uncomment lines below to include extra p5 libraries --> | |
| <!--<script language="javascript" src="libraries/p5.dom.js"></script>--> | |
| <!--<script language="javascript" src="libraries/p5.sound.js"></script>--> | |
| <script language="javascript" type="text/javascript" src="sketch.js"></script> | |
| <!-- this line removes any default padding and style. you might only need one of these values set. --> | |
| <style> body {padding: 0; margin: 0;} </style> | |
| </head> | |
| <body> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| function setup() { | |
| //Use the sizeMultiplier to adjust the size of the image. The multiplier 5.76 creates a 20 inch X 20 inch picture | |
| sizeMultiplier = 1; // 5.76; | |
| createCanvas(1000 * sizeMultiplier, 1000 * sizeMultiplier); | |
| //change the background color if you want to see the size of the canvas | |
| background(250) | |
| //Use random seeds to generate different versions of the art, then pick the one you like best and lock it in | |
| ourSeed = round(random(10000)) //Final Choice: 7337 | |
| randomSeed(ourSeed); | |
| noiseSeed(ourSeed); | |
| /* | |
| //Uncomment the following line to display the seed number on the canvas | |
| fill(0) | |
| textSize(30) | |
| text(ourSeed, 10, 10, 300, 300) | |
| */ | |
| //If you want to see the art grow over time, play with the frameRate otherwise give an iteration number | |
| animated = true; | |
| //Final choice: 476, 747, 1657 | |
| iterationNumber = 100; // 1657 | |
| strokeWeight(3); // 3 | |
| increment = .005; //.005 | |
| bezierMagnifier = 1; // 1 | |
| frameRate(60) | |
| if(animated) { | |
| iterationNumber = 0; | |
| } | |
| else { | |
| noLoop(); | |
| } | |
| stroke(0, 25); // 0, 18 | |
| noFill(); | |
| t = 0; | |
| // Loops if not animated | |
| for (i=0; i<iterationNumber; i++) { | |
| loop(); | |
| noLoop(); | |
| } | |
| } | |
| function draw() { | |
| redValue = map(noise(t),0,0.44,0,255) | |
| greenValue = map(noise(t+35),0,0.73,0,255) | |
| blueValue = map(noise(t+60),0,0.9,0,255) | |
| stroke(redValue, greenValue, blueValue, 18); | |
| var x1 = width * noise(t + 15); | |
| var x2 = width * noise(t + 25); | |
| var x3 = width * noise(t + 35); | |
| var x4 = width * noise(t + 45); | |
| var y1 = height * noise(t + 55); | |
| var y2 = height * noise(t + 65); | |
| var y3 = height * noise(t + 75); | |
| var y4 = height * noise(t + 85); | |
| bezier(x1, y1, x2, y2, x3, y3, x4, y4); | |
| t += increment; | |
| /* | |
| if (frameCount == iterationNumber){ | |
| saveCanvas('aandm' + iterationNumber, 'png'); | |
| } | |
| */ | |
| /* | |
| //Frame Count | |
| noStroke() | |
| fill(250) | |
| rect(10,50,300,50) | |
| fill(0) | |
| text(frameCount, 10, 50, 300, 300) | |
| stroke(0,18) | |
| noFill() | |
| */ | |
| } | |
| //Saves the output as a png when you click the mouse | |
| /* | |
| function mouseClicked() { | |
| saveCanvas('aandm476', 'png'); | |
| };*/ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment