Completed Tasks are shown here
​
Embedding Iteration
​
/**
​ * Embedding Iteration.
*
* Embedding "for" structures allows repetition in two dimensions.
*
*/
size(640, 360);
background(0);
int gridSize = 40;
for (int x = gridSize; x <= width - gridSize; x += gridSize) {
for (int y = gridSize; y <= height - gridSize; y += gridSize) {
noStroke();
fill(255);
rect(x-1, y-1, 3, 3);
stroke(255, 100);
line(x, y, width/2, height/2);
}
}
​
Variables
/**
* Variables.
*
* Variables are used for storing values. In this example, change
* the values of variables to affect the composition.
*/
size(640, 360);
background(0);
stroke(153);
strokeWeight(4);
strokeCap(SQUARE);
int a = 50;
int b = 120;
int c = 180;
line(a, b, a+c, b);
line(a, b+10, a+c, b+10);
line(a, b+20, a+c, b+20);
line(a, b+30, a+c, b+30);
a = a + c;
b = height-b;
line(a, b, a+c, b);
line(a, b+10, a+c, b+10);
line(a, b+20, a+c, b+20);
line(a, b+30, a+c, b+30);
a = a + c;
b = height-b;
line(a, b, a+c, b);
line(a, b+10, a+c, b+10);
line(a, b+20, a+c, b+20);
line(a, b+30, a+c, b+30);
​
Mixture Grid
/**
* Embedding Iteration.
*
* Embedding "for" structures allows repetition in two dimensions.
*
*/
size(640, 360);
background(0);
int gridSize = 40;
for (int x = gridSize; x <= width - gridSize; x += gridSize) {
for (int y = gridSize; y <= height - gridSize; y += gridSize) {
noStroke();
fill(255);
rect(x-1, y-1, 3, 3);
stroke(255, 100);
line(x, y, width/2, height/2);
}
}
Mouse Interactive Process Object(Bezier) object moves while moving the mouse.
*
* The first two parameters for the bezier() function specify the
* the first point in the curve and the last two parameters specify
* the last point. The middle parameters set the control points
* that defines the shape of the curve.
*/
void setup() {
size(640, 360);
stroke(255);
noFill();
}
void draw() {
background(0);
for (int i = 0; i < 200; i += 20) {
bezier(mouseX-(i/2.0), 40+i, 410, 20, 440, 300, 240-(i/16.0), 300+(i/8.0));
}
}
Visualisation with Arduino and Processing.
​
​
In EDUvision Season 4 Episode 02 we demonstrated a project that utilizes an Arduino Uno Rev 3 and a phototransistor. The data from the phototransistor is parsed and sent to Processing. Processing is an open source integrated development environment (IDE) like the Arduino IDE and is used by designers and artists alike! With Processing, you can create stunning visual and interactive experiences.
​
Output
​
​
​
​
​
​
​
​
​
​
​
​
Wiring/Circuit
​
Connect the GND pin from the Arduino to the resistor and then connect the resistor to the short leg of the phototransistor. Connect the A0 pin between the resistor and the phototransistor. Finally connect the 5V pin to the long leg of the phototransistor.
*
*
​
​
​
​
​
​
​
Arduino Code
​
unsigned int ADCValue;
void setup(){
Serial.begin(9600);
}
void loop(){
int val = analogRead(0);
val = map(val, 0, 300, 0, 255);
Serial.println(val);
delay(50);
}
Connect the Arduino to the computer using a USB cable and upload the code to your board. Make sure that the serial monitor is printing the values from the phototransistor. When you are done uploading, you can move on to Processing.
​
​
Processing Code
int n = 1000; // number of dots
float[] m = new float[n]; // make a new list of floating points
float[] x = new float[n];
float[] y = new float[n];
float[] vx = new float[n];
float[] vy = new float[n];
float[] redchannel = new float[n];
float[] bluechannel = new float[n];
float[] greenchannel = new float[n];
float[] shape = new float[n];
import processing.serial.*;
Serial myPort; // Create object from Serial class
static String val; // Data received from the serial port
int sensorVal = 0;
//::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
void setup() {
fullScreen();
fill(0,10);
reset();// running the reset when you click. 10000 random values being plugged in
String portName = "COM5";// Change the number (in this case ) to match the corresponding port number connected to your Arduino.
myPort = new Serial(this, portName, 9600);
}
//::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
void draw() {
if ( myPort.available() > 0) { // If data is available,
val = myPort.readStringUntil('\n');
try {
sensorVal = Integer.valueOf(val.trim());
}
catch(Exception e) {
;
}
println(sensorVal); // read it and store it in vals!
}
noStroke();
fill(0,30);
rect(0, 0, width, height); // black background
for (int i = 0; i < n; i++) { // runs the loop 10,000 times
float dx = mouseX - x[i]; // distance from the mouse
float dy = sensorVal - y[i];
float d = sqrt(dx*dx + dy*dy); // calculating the distance between the points and the mouse
if (d < 1) d = 1;
float f = cos(d * 0.06) * m[i] / d*2; //decides if it gets closer or further from the mouse
vx[i] = vx[i] * 0.4 - f * dx; //changing the velocity so it moves towards the ring
vy[i] = vy[i] * 0.2 - f * dy;
}
for (int i = 0; i < n; i++) {
x[i] += vx[i];
y[i] += vy[i];
if (x[i] < 0) x[i] = width;
else if (x[i] > width) x[i] = 0;
if (y[i] < 0) y[i] = height;
else if (y[i] > height) y[i] = 0;
if (m[i] < 0) fill(bluechannel[i], greenchannel[i] , 255);
else fill(255, bluechannel[i],redchannel[i]);
if (shape[i] > 2) fill(bluechannel[i], greenchannel[i] , 255);
else fill(255, bluechannel[i],redchannel[i]);
if (shape[i] > 2) rect(x[i], y[i],10,10);
else if (shape[i] > 1 && shape[i] <=2) rect(x[i],y[i],2,2);
else ellipse(x[i], y[i],10,10);
}
}
//::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
void reset() { // counter that counts up to n
for (int i = 0; i < n; i++) { // i = 0, i < 10,0000, i++ what to do after each loop.
m[i] = randomGaussian() * 8; // gaussian distribution is a bell curve. Distribution of the mass
x[i] = random(width);
y[i] = random(height);
bluechannel[i] = random(255);
redchannel[i] = random(255);
greenchannel[i] = random(255);
shape [i] = random(0,3);
}
}
//::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
void mousePressed() {
reset();
}
​