This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision Last revision Both sides next revision | ||
spcs:2015:day4 [2015/07/09 00:12] ffpaladin |
spcs:2015:day4 [2015/07/09 05:26] ffpaladin |
||
---|---|---|---|
Line 17: | Line 17: | ||
- Step 2: make it visual with rectangles | - Step 2: make it visual with rectangles | ||
- http://visualgo.net/sorting.html | - http://visualgo.net/sorting.html | ||
- | - **Processing: Physics** - Create objects that represent physics. You can make it more realistic, like with gravity if you are able. | + | - **Processing: Seurat Painting** - How do we make a Seurat Painting animation in Processing |
- | - **Processing: Simulation** - Pick a simulation that will teach me something. | + | - Step 1: Make an animation |
- | - **Processing: Make a Game** - To make a game, give it interactions and a winning condition (Ludus and Paida). | + | - Step 2: Make it so that the user can change the size of the circle |
- | - **Processing (Bonus): Interaction** - Make any of the above MORE interactive. | + | |
- **Github** - You can store your processing projects directly there and run them with Processing.js - Read: http://processingjs.org/articles/jsQuickStart.html (Similar to yesterday) | - **Github** - You can store your processing projects directly there and run them with Processing.js - Read: http://processingjs.org/articles/jsQuickStart.html (Similar to yesterday) | ||
Line 155: | Line 154: | ||
</code> | </code> | ||
- | <code java> | ||
- | |||
- | // Car Objects from Processing.org | ||
- | |||
- | // Example: Two Car objects | ||
- | Car myCar1; | ||
- | Car myCar2; // Two objects! | ||
- | |||
- | void setup() { | ||
- | size(200,200); | ||
- | // Parameters go inside the parentheses when the object is constructed. | ||
- | myCar1 = new Car(color(255,0,0),0,100,2); | ||
- | myCar2 = new Car(color(0,0,255),0,10,1); | ||
- | } | ||
- | |||
- | void draw() { | ||
- | background(255); | ||
- | myCar1.drive(); | ||
- | myCar1.display(); | ||
- | myCar2.drive(); | ||
- | myCar2.display(); | ||
- | } | ||
- | |||
- | // Even though there are multiple objects, we still only need one class. | ||
- | // No matter how many cookies we make, only one cookie cutter is needed. | ||
- | class Car { | ||
- | color c; | ||
- | float xpos; | ||
- | float ypos; | ||
- | float xspeed; | ||
- | |||
- | // The Constructor is defined with arguments. | ||
- | Car(color tempC, float tempXpos, float tempYpos, float tempXspeed) { | ||
- | c = tempC; | ||
- | xpos = tempXpos; | ||
- | ypos = tempYpos; | ||
- | xspeed = tempXspeed; | ||
- | } | ||
- | |||
- | void display() { | ||
- | stroke(0); | ||
- | fill(c); | ||
- | rectMode(CENTER); | ||
- | rect(xpos,ypos,20,10); | ||
- | } | ||
- | |||
- | void drive() { | ||
- | xpos = xpos + xspeed; | ||
- | if (xpos > width) { | ||
- | xpos = 0; | ||
- | } | ||
- | } | ||
- | } | ||
</code> | </code> | ||
<code java> | <code java> | ||
+ | |||
+ | // Credit: Neel | ||
int[] cheesesticks = {200, 40, 170, 50, 70, 60, 80, 90, 190, 150, 100, 110, 120, 140, 180, 130, 20, 160, 30, 10}; | int[] cheesesticks = {200, 40, 170, 50, 70, 60, 80, 90, 190, 150, 100, 110, 120, 140, 180, 130, 20, 160, 30, 10}; | ||
Line 247: | Line 195: | ||
j++; | j++; | ||
} | } | ||
- | | ||
- | | ||
- | | ||
- | | ||
| | ||
fill(#EA5353); | fill(#EA5353); |