Matt’s Exercise 5 – Chair Clustering

Above is an image of my Exercise 5.

==============================================================

Description:

This Processing applet was made to explore how machine learning can be used to cluster chairs into categories. The applet clusters images from a database I made of chairs designed by Verner Panton, Charles and Ray Eames, Le Corbusier, Pierre Jeanneret, Charlotte Perriand, Harry Bertoia, and Eero Saarinen. When the applet is ran, it clusters all of the chairs into categories.

==============================================================

Code:

import wekaizing.*;

import java.io.File;

import java.lang.Integer;

class digitImage {

int number;

PImage digit_image;

int[] pixeldata;

public digitImage(int image_size) {

pixeldata = new int[image_size*image_size];}

}

WekaData digits_data;

WekaClusterer clusterer;

digitImage[] digits;

int NUM_DIGITS = 100;

int TRAIN_IMAGE_SIZE = 20;

int NUM_CLUSTERS = 10;

int[] clusters;

PFont courier_font;

void setup() {

background(0);

size(1800,1200);

courier_font = loadFont(“CourierNew-12.vlw”);

textFont(courier_font, 15);

digits_data = new WekaData();

for (int i = 0; i < TRAIN_IMAGE_SIZE*TRAIN_IMAGE_SIZE; i++) {

digits_data.AddAttribute(Integer.toString(i));

}

loadDigits(“digits”);

clusterer = new WekaClusterer(WekaClusterer.EM);

clusters = clusterer.clusterData(digits_data,NUM_CLUSTERS);

print(“Training done”);

drawResults();

}

void loadDigits(String digitfolder) {

File digitfiles = new File(sketchPath, “data/” + digitfolder);

String[] files = digitfiles.list(filter);

if(files.length < NUM_DIGITS)

NUM_DIGITS = files.length;

digits = new digitImage[NUM_DIGITS];

String numbers[] = loadStrings(digitfolder + “/digits.txt”);

for (int i = 0; i<NUM_DIGITS ; i++) {

println(“Loading image ” + files[i]);

digits[i] = new digitImage(TRAIN_IMAGE_SIZE);

digits[i].digit_image = loadImage(“data/” + digitfolder + “/” + files[i]);

digits[i].number = Integer.valueOf(numbers[i]);

PImage resizedImg = loadImage(“data/” + digitfolder + “/” + files[i]);

resizedImg.resize(TRAIN_IMAGE_SIZE,TRAIN_IMAGE_SIZE);

resizedImg.loadPixels();

for (int j = 0; j < TRAIN_IMAGE_SIZE*TRAIN_IMAGE_SIZE; j++) {

digits[i].pixeldata[j] = resizedImg.pixels[j];

}

digits_data.InsertData(digits[i].pixeldata);

}

}

void drawResults() {

int imgx=0, imgy=0;

for (int j=0;j<NUM_CLUSTERS;j++)

{

for (int i = 0; i < digits.length; i++) {

if(clusters[i] == j)

{

image(digits[i].digit_image,imgx,imgy);

imgx += digits[0].digit_image.width;

if(imgx>width-digits[0].digit_image.width)

{

imgx = 0;

imgy += digits[0].digit_image.height;

}

}

}

imgx = 0;

imgy += digits[0].digit_image.height*1.25;

stroke(0,255,0);

line(0,imgy,width,imgy);

imgy += digits[0].digit_image.height/4;

}

}

FilenameFilter filter = new FilenameFilter() {

public boolean accept(File dir, String name) {

if (name.toLowerCase().endsWith(“.png”) || name.toLowerCase().endsWith(“.jpg”) || name.toLowerCase().endsWith(“.gif”)) return true;

return false;

}

};

import wekaizing.*;

import java.io.File;

import java.lang.Integer;

class digitImage {

int number;

PImage digit_image;

int[] pixeldata;

public digitImage(int image_size) {

pixeldata = new int[image_size*image_size];}

}

WekaData digits_data;

WekaClusterer clusterer;

digitImage[] digits;

int NUM_DIGITS = 100;

int TRAIN_IMAGE_SIZE = 20;

int NUM_CLUSTERS = 10;

int[] clusters;

PFont courier_font;

void setup() {

background(0);

size(1800,1200);

courier_font = loadFont(“CourierNew-12.vlw”);

textFont(courier_font, 15);

digits_data = new WekaData();

for (int i = 0; i < TRAIN_IMAGE_SIZE*TRAIN_IMAGE_SIZE; i++) {

digits_data.AddAttribute(Integer.toString(i));

}

loadDigits(“digits”);

clusterer = new WekaClusterer(WekaClusterer.EM);

clusters = clusterer.clusterData(digits_data,NUM_CLUSTERS);

print(“Training done”);

drawResults();

}

void loadDigits(String digitfolder) {

File digitfiles = new File(sketchPath, “data/” + digitfolder);

String[] files = digitfiles.list(filter);

if(files.length < NUM_DIGITS)

NUM_DIGITS = files.length;

digits = new digitImage[NUM_DIGITS];

String numbers[] = loadStrings(digitfolder + “/digits.txt”);

for (int i = 0; i<NUM_DIGITS ; i++) {

println(“Loading image ” + files[i]);

digits[i] = new digitImage(TRAIN_IMAGE_SIZE);

digits[i].digit_image = loadImage(“data/” + digitfolder + “/” + files[i]);

digits[i].number = Integer.valueOf(numbers[i]);

PImage resizedImg = loadImage(“data/” + digitfolder + “/” + files[i]);

resizedImg.resize(TRAIN_IMAGE_SIZE,TRAIN_IMAGE_SIZE);

resizedImg.loadPixels();

for (int j = 0; j < TRAIN_IMAGE_SIZE*TRAIN_IMAGE_SIZE; j++) {

digits[i].pixeldata[j] = resizedImg.pixels[j];

}

digits_data.InsertData(digits[i].pixeldata);

}

}

void drawResults() {

int imgx=0, imgy=0;

for (int j=0;j<NUM_CLUSTERS;j++)

{

for (int i = 0; i < digits.length; i++) {

if(clusters[i] == j)

{

image(digits[i].digit_image,imgx,imgy);

imgx += digits[0].digit_image.width;

if(imgx>width-digits[0].digit_image.width)

{

imgx = 0;

imgy += digits[0].digit_image.height;

}

}

}

imgx = 0;

imgy += digits[0].digit_image.height*1.25;

stroke(0,255,0);

line(0,imgy,width,imgy);

imgy += digits[0].digit_image.height/4;

}

}

FilenameFilter filter = new FilenameFilter() {

public boolean accept(File dir, String name) {

if (name.toLowerCase().endsWith(“.png”) || name.toLowerCase().endsWith(“.jpg”) || name.toLowerCase().endsWith(“.gif”)) return true;

return false;

}

};

Matt’s Exercise 4 – Chair Classification

Above is an image of my Exercise 4.

==============================================================

Description:

This Processing applet was made to explore how machine learning can be used to classify chairs. The applet classifies images from a database I made of chairs designed by Verner Panton, Charles and Ray Eames, Le Corbusier, Pierre Jeanneret, Charlotte Perriand, Harry Bertoia, and Eero Saarinen. When the applet is ran, it chooses nine chair images and tries to classify them by their designers. The number on the top left of each image represents the actual designer of the chair and the number on the top right of each image represents the applet’s guess for the the designer of the chair. The applet learns from a database of chairs and their designers prior to choosing the nine to guess, and the applet’s guess is displayed in red if it is incorrect, and is displayed in green if it is correct. The designers that the numbers represent are as follows:

1:  Bertoia

2:  Eames

3:  Panton

4:  Saarinen

5:  Le Corbusier, Jeanneret, and Perriand

==============================================================

Code:

import wekaizing.*;

import java.io.File;

import java.lang.Integer;

class digitImage {

int number;

PImage digit;

int[] pixeldata;

public digitImage() {

pixeldata = new int[101];}

}

WekaData digitsTrain;

WekaData digitsTest;

WekaClassifier classifier;

digitImage[] digits;

int[] results;

PFont HNL_font;

void setup() {

background(0);

size(680,680);

HNL_font = loadFont(“HelveticaNeue-Light-100.vlw”);

textFont(HNL_font, 15);

digitsTrain = new WekaData();

digitsTest = new WekaData();

for (int i = 0; i < 100; i++) {

digitsTrain.AddAttribute(Integer.toString(i));

digitsTest.AddAttribute(Integer.toString(i));

}

Object[] digitarray = new Object[] {0,1,2,3,4,5,6,7,8,9};

digitsTrain.AddAttribute(“digit”,digitarray);

digitsTest.AddAttribute(“digit”,digitarray);

loadDigits(“digits”);

digitsTrain.setClassIndex(100);

digitsTest.setClassIndex(100);

classifier = new WekaClassifier(WekaClassifier.LOGISTIC);

classifier.Build(digitsTrain);

print(“Training done”);

results = classifier.Classify(digitsTest);

print(“Classification done”);

drawResults();

}

void loadDigits(String digitfolder) {

File digitfiles = new File(sketchPath, “data/” + digitfolder);

String[] files = digitfiles.list(filter);

digits = new digitImage[files.length];

String numbers[] = loadStrings(digitfolder + “/digits.txt”);

for (int i = 0; i < files.length; i++) {

println(“Loading image ” + files[i]);

digits[i] = new digitImage();

digits[i].digit = loadImage(“data/” + digitfolder + “/” + files[i]);

digits[i].number = Integer.valueOf(numbers[i]);

PImage resizedImg = loadImage(“data/” + digitfolder + “/” + files[i]);

resizedImg.resize(10,10);

resizedImg.loadPixels();

for (int j = 0; j < 100; j++) {

digits[i].pixeldata[j] = resizedImg.pixels[j];

}

digits[i].pixeldata[100] = digits[i].number;

if (i < 40) {

digitsTest.InsertData(digits[i].pixeldata);

} else {

digitsTrain.InsertData(digits[i].pixeldata);

}

}

}

void drawResults() {

float num_correct = 0.0, total = 0.0;

int imgx, imgy;

for (int i = 0; i < 12; i++) {

imgx = (i % 3) * 220 + 20;

imgy = (i / 3) * 220 + 20;

image(digits[i].digit,imgx,imgy);

}

for (int i = 0; i < 9; i++) {

imgx = (i % 3) * 220 + 25;

imgy = (i / 3) * 220 + 35;

fill(0);

text(digits[i].number, imgx, imgy);

if(digits[i].number == results[i]){

fill(0,255,0);

}

else{

fill(255,0,0);

}

text(results[i], imgx + 180, imgy);

total += 1.0;

if(digits[i].number == results[i])

num_correct += 1.0;

}

println(“\n” + “Accuracy = ” + num_correct/total*40 + “%”);

}

FilenameFilter filter = new FilenameFilter() {

public boolean accept(File dir, String name) {

if (name.toLowerCase().endsWith(“.png”) || name.toLowerCase().endsWith(“.jpg”) || name.toLowerCase().endsWith(“.gif”)) return true;

return false;

}

};

import wekaizing.*;

import java.io.File;

import java.lang.Integer;

class digitImage {

int number;

PImage digit;

int[] pixeldata;

public digitImage() {

pixeldata = new int[101];}

}

WekaData digitsTrain;

WekaData digitsTest;

WekaClassifier classifier;

digitImage[] digits;

int[] results;

PFont HNL_font;

void setup() {

background(0);

size(680,680);

HNL_font = loadFont(“HelveticaNeue-Light-100.vlw”);

textFont(HNL_font, 15);

digitsTrain = new WekaData();

digitsTest = new WekaData();

for (int i = 0; i < 100; i++) {

digitsTrain.AddAttribute(Integer.toString(i));

digitsTest.AddAttribute(Integer.toString(i));

}

Object[] digitarray = new Object[] {0,1,2,3,4,5,6,7,8,9};

digitsTrain.AddAttribute(“digit”,digitarray);

digitsTest.AddAttribute(“digit”,digitarray);

loadDigits(“digits”);

digitsTrain.setClassIndex(100);

digitsTest.setClassIndex(100);

classifier = new WekaClassifier(WekaClassifier.LOGISTIC);

classifier.Build(digitsTrain);

print(“Training done”);

results = classifier.Classify(digitsTest);

print(“Classification done”);

drawResults();

}

void loadDigits(String digitfolder) {

File digitfiles = new File(sketchPath, “data/” + digitfolder);

String[] files = digitfiles.list(filter);

digits = new digitImage[files.length];

String numbers[] = loadStrings(digitfolder + “/digits.txt”);

for (int i = 0; i < files.length; i++) {

println(“Loading image ” + files[i]);

digits[i] = new digitImage();

digits[i].digit = loadImage(“data/” + digitfolder + “/” + files[i]);

digits[i].number = Integer.valueOf(numbers[i]);

PImage resizedImg = loadImage(“data/” + digitfolder + “/” + files[i]);

resizedImg.resize(10,10);

resizedImg.loadPixels();

for (int j = 0; j < 100; j++) {

digits[i].pixeldata[j] = resizedImg.pixels[j];

}

digits[i].pixeldata[100] = digits[i].number;

if (i < 40) {

digitsTest.InsertData(digits[i].pixeldata);

} else {

digitsTrain.InsertData(digits[i].pixeldata);

}

}

}

void drawResults() {

float num_correct = 0.0, total = 0.0;

int imgx, imgy;

for (int i = 0; i < 12; i++) {

imgx = (i % 3) * 220 + 20;

imgy = (i / 3) * 220 + 20;

image(digits[i].digit,imgx,imgy);

}

for (int i = 0; i < 9; i++) {

imgx = (i % 3) * 220 + 25;

imgy = (i / 3) * 220 + 35;

fill(0);

text(digits[i].number, imgx, imgy);

if(digits[i].number == results[i]){

fill(0,255,0);

}

else{

fill(255,0,0);

}

text(results[i], imgx + 180, imgy);

total += 1.0;

if(digits[i].number == results[i])

num_correct += 1.0;

}

println(“\n” + “Accuracy = ” + num_correct/total*40 + “%”);

}

FilenameFilter filter = new FilenameFilter() {

public boolean accept(File dir, String name) {

if (name.toLowerCase().endsWith(“.png”) || name.toLowerCase().endsWith(“.jpg”) || name.toLowerCase().endsWith(“.gif”)) return true;

return false;

}

};

Matt’s Exercise 3 – Logo Similarity

Above is an image of my Exercise 3.

==============================================================

Description:

This Processing applet was made to explore how machine learning can be used to sort logos by similarity. The applet looks at a collection of logos and sorts them based on how similar they are to a user-chosen logo from the collection. The logos all begin at full brightness, and when a logo is chosen, the other logos fade to black until they are sorted with the most similar logo as the brightest and the least similar logo as the darkest.

==============================================================

Code:

import java.io.File;

import java.io.FilenameFilter;

import imagelib.*;

import similarity.*;

ArrayList histograms;

PImage[] images;

int picIndex;

float px = 0;

float py = 0;

float pz = 0;

float mx = 0;

float my = 0;

float circleX = 0;

float circleY = 0;

float circleDiameter = 0;

float colorVariable = 0;

float opacity;

float vOpacity;

float vBoxOpacity;

int colorStart;

int frame;

color c;

float boxOpacity = 17;

//float idealBoxOpacity;

void setup() {

picIndex=-1;

size(1280,720);

File datafolder = new File(sketchPath, “data”);

String[] files = datafolder.list(filter);

if (files==null|files.length<1){

println(“You must add images in jpg format to the data subdirectory of your sketch.”);

exit();

}

images = new PImage[files.length];

int num_bins = 6;

histograms = new ArrayList(files.length);

double[] histogram;

for (int i = 0; i < files.length; i++) {

println(files[i]);

images[i] = loadImage(files[i]);

histogram = ImageParsing.histHue(this, images[i],num_bins);

histograms.add(i, histogram);

}

resetImages();

fill(0,220);

rect(0,0, 1280,720);

noFill();

}

void resetImages() {

int picy = 0;

int picx = 0;

background(255);

for (int i = 0; i < images.length ;i++) {

if (picx >= width) {

picx = 0;

picy += 240;

}

image(images[i],picx,picy,320,240);

picx += 320;

}

}

void draw() {

smooth();

noStroke();

float A = 0.90;

float B = 1.0-A;

mx = A*mx + B*mouseX;

my = A*my + B*mouseY;

circleDiameter = 40;

vOpacity = -10;

opacity = vOpacity+opacity;

if(opacity<25){

opacity=25;

}

if(picIndex>-1){

markSimilars(picIndex);

}

}

void mousePressed() {

boxOpacity = 0;

opacity = 255;

c = color(random(0,255),random(150,255),random(0,255));

if (mouseButton == LEFT) {

picIndex = (mouseY / 240) * 4 + mouseX / 320;

if (picIndex < images.length) {

markSimilars(picIndex);

}

}

}

void markSimilars(int index) {

int rectx, recty;

resetImages();

int[] similars = Similarity.similarVectors(histograms, index);

PFont Serif_48;

Serif_48 = loadFont(“Serif-48.vlw”);

textFont(Serif_48, 48);

for (int i = 0; i < similars.length; i++) {

println(i);

rectx = (similars[i] % 4) * 320;

recty = (similars[i] / 4) * 240;

/*fill(255,255,0);

text(i,rectx+30,recty+90);*/

float idealBoxOpacity = (i+1)*20;

println(idealBoxOpacity);

if(boxOpacity>idealBoxOpacity){

vBoxOpacity = -2;

boxOpacity = vBoxOpacity+boxOpacity;

}

else if(boxOpacity<idealBoxOpacity){

vBoxOpacity = 2;

boxOpacity = vBoxOpacity+boxOpacity;

}

else{

boxOpacity=idealBoxOpacity;

}

fill(0,boxOpacity);

noStroke();

rect(rectx,recty,320,240);

}

}

FilenameFilter filter = new FilenameFilter() {

public boolean accept(File dir, String name) {

if (name.toLowerCase().endsWith(“.jpg”)) return true;

return false;

}

};

import java.io.File;

import java.io.FilenameFilter;

import imagelib.*;

import similarity.*;

ArrayList histograms;

PImage[] images;

int picIndex;

float px = 0;

float py = 0;

float pz = 0;

float mx = 0;

float my = 0;

float circleX = 0;

float circleY = 0;

float circleDiameter = 0;

float colorVariable = 0;

float opacity;

float vOpacity;

float vBoxOpacity;

int colorStart;

int frame;

color c;

float boxOpacity = 17;

//float idealBoxOpacity;

void setup() {

picIndex=-1;

size(1280,720);

File datafolder = new File(sketchPath, “data”);

String[] files = datafolder.list(filter);

if (files==null|files.length<1){

println(“You must add images in jpg format to the data subdirectory of your sketch.”);

exit();

}

images = new PImage[files.length];

int num_bins = 6;

histograms = new ArrayList(files.length);

double[] histogram;

for (int i = 0; i < files.length; i++) {

println(files[i]);

images[i] = loadImage(files[i]);

histogram = ImageParsing.histHue(this, images[i],num_bins);

histograms.add(i, histogram);

}

resetImages();

fill(0,220);

rect(0,0, 1280,720);

noFill();

}

void resetImages() {

int picy = 0;

int picx = 0;

background(255);

for (int i = 0; i < images.length ;i++) {

if (picx >= width) {

picx = 0;

picy += 240;

}

image(images[i],picx,picy,320,240);

picx += 320;

}

}

void draw() {

smooth();

noStroke();

float A = 0.90;

float B = 1.0-A;

mx = A*mx + B*mouseX;

my = A*my + B*mouseY;

circleDiameter = 40;

vOpacity = -10;

opacity = vOpacity+opacity;

if(opacity<25){

opacity=25;

}

if(picIndex>-1){

markSimilars(picIndex);

}

}

void mousePressed() {

boxOpacity = 0;

opacity = 255;

c = color(random(0,255),random(150,255),random(0,255));

if (mouseButton == LEFT) {

picIndex = (mouseY / 240) * 4 + mouseX / 320;

if (picIndex < images.length) {

markSimilars(picIndex);

}

}

}

void markSimilars(int index) {

int rectx, recty;

resetImages();

int[] similars = Similarity.similarVectors(histograms, index);

PFont Serif_48;

Serif_48 = loadFont(“Serif-48.vlw”);

textFont(Serif_48, 48);

for (int i = 0; i < similars.length; i++) {

println(i);

rectx = (similars[i] % 4) * 320;

recty = (similars[i] / 4) * 240;

/*fill(255,255,0);

text(i,rectx+30,recty+90);*/

float idealBoxOpacity = (i+1)*20;

println(idealBoxOpacity);

if(boxOpacity>idealBoxOpacity){

vBoxOpacity = -2;

boxOpacity = vBoxOpacity+boxOpacity;

}

else if(boxOpacity<idealBoxOpacity){

vBoxOpacity = 2;

boxOpacity = vBoxOpacity+boxOpacity;

}

else{

boxOpacity=idealBoxOpacity;

}

fill(0,boxOpacity);

noStroke();

rect(rectx,recty,320,240);

}

}

FilenameFilter filter = new FilenameFilter() {

public boolean accept(File dir, String name) {

if (name.toLowerCase().endsWith(“.jpg”)) return true;

return false;

}

};

Matt’s Exercise 2 – Interactive Driving Applet

Above is a short video of my Exercise 2 and the physical interface that I made to control it.

==============================================================

Description:

This interactive driving applet consists of a Processing applet that simulates a road and a physical interface that controls it.  The physical interface was created by rewiring an optical mouse to switches and mounting them in a foam core enclosure that I made to resemble a car interior.

==============================================================

Controls:

Steering Wheel/Mouse Wheel: Turn left or right.

Gas Pedal/Left Click: Accelerate.

Shifter/Right Click: Reverse On/Off.

Brake Pedal/Middle Click: Brake.

==============================================================

Code:

PImage road;

float y = -1200;

boolean inDrive;

boolean inReverse;

boolean brake;

boolean turnLeft;

boolean turnRight;

void setup(){

addMouseWheelListener(new java.awt.event.MouseWheelListener() {

public void mouseWheelMoved(java.awt.event.MouseWheelEvent evt) {

mouseWheel(evt.getWheelRotation());

}

}

);

road = loadImage (“Road.jpg”);

size(800,600);

background(0);

}

void mousePressed() {

if ( (mouseEvent.getModifiers() & InputEvent.BUTTON2_MASK) != 0) {

inDrive=false;

inReverse=false;

brake=true;

}

else if (mouseButton==LEFT){

inReverse=false;

brake=false;

inDrive=true;

}

else if (mouseButton==RIGHT) {

inDrive=false;

brake=false;

inReverse=true;

}

else if(mouseButton!=RIGHT){

inReverse=false;

}

}

void draw(){

if(y>0){

y=-1600;

}

if(y<-1600){

y=0;

}

if(inDrive){

y+=20;

}

if(inReverse){

y-=10;

}

if(turnLeft){

rotate(PI/10);

}

if(turnRight){

rotate(-PI/10);

}

image(road,-200,y);

}

void mouseWheel(int delta) {

println(delta);

if(delta<0){

turnLeft=false;

turnRight=true;

}

if(delta>0){

turnRight=false;

turnLeft=true;

}

}

PImage road;

float y = -1200;

boolean inDrive;

boolean inReverse;

boolean brake;

boolean turnLeft;

boolean turnRight;

void setup(){

addMouseWheelListener(new java.awt.event.MouseWheelListener() {

public void mouseWheelMoved(java.awt.event.MouseWheelEvent evt) {

mouseWheel(evt.getWheelRotation());

}

}

);

road = loadImage (“Road.jpg”);

size(800,600);

background(0);

}

void mousePressed() {

if ( (mouseEvent.getModifiers() & InputEvent.BUTTON2_MASK) != 0) {

inDrive=false;

inReverse=false;

brake=true;

}

else if (mouseButton==LEFT){

inReverse=false;

brake=false;

inDrive=true;

}

else if (mouseButton==RIGHT) {

inDrive=false;

brake=false;

inReverse=true;

}

else if(mouseButton!=RIGHT){

inReverse=false;

}

}

void draw(){

if(y>0){

y=-1600;

}

if(y<-1600){

y=0;

}

if(inDrive){

y+=20;

}

if(inReverse){

y-=10;

}

if(turnLeft){

rotate(PI/10);

}

if(turnRight){

rotate(-PI/10);

}

image(road,-200,y);

}

void mouseWheel(int delta) {

println(delta);

if(delta<0){

turnLeft=false;

turnRight=true;

}

if(delta>0){

turnRight=false;

turnLeft=true;

}

}

Matt’s Exercise 1 – To Disney’s Main Street Electrical Parade

Above is a short video of my Exercise 1 along with the song for which it was made.

==============================================================

Description:

This interactive applet features colored tiles that can be “played” to a song of the user’s choice, in this case, Disney’s Main Street Electrical Parade.

==============================================================

Controls:

‘1’: Play and/or pause the song.

Left and Right Mouse Click: Large and small white tiles that vary slightly in size and appear where the mouse is clicked.

‘V’,’B’,’N’, and ‘M’: The middle four colored tiles of the applet.

‘A’,’S’,’D’,’F’,’J’,’K’,’L’,’;’: The 16 little colored tiles on the top and bottom of the applet.

==============================================================

Code:

import ddf.minim.*;

AudioPlayer player;

Minim minim;

boolean sound;

int frame;

float shapeSize;

float BBwidth;

float SBwidth;

color bg = color(50,45,45);

color c = color(255);

color c2 = color(255);

color c3 = color(225,75,75);

color c4 = color(200,150,250);

color c5 = color(250,225,100);

color c6 = color(100,250,200);

color c7 = color(100,250,200);

color c8 = color(100,250,200);

color c9 = color(250,225,100);

color c10 = color(250,225,100);

color c11 = color(200,150,250);

color c12 = color(200,150,250);

color c13 = color(225,75,75);

color c14 = color(225,75,75);

void setup(){

size(800,600);

background(bg);

rectMode(RADIUS);

noStroke();

minim = new Minim(this);

player = minim.loadFile(“ElectricalParade2.mp3”, 2048);

}

void draw(){

if(frame == frameCount-1 ||

frame == frameCount-2 ||

frame == frameCount-3 ||

frame == frameCount-4 ||

frame == frameCount-5 ||

frame == frameCount-6 ||

frame == frameCount-7 ||

frame == frameCount-8 ||

frame == frameCount-9 ||

frame == frameCount-10 ||

frame == frameCount-11 ||

frame == frameCount-12 ||

frame == frameCount-13 ||

frame == frameCount-14 ||

frame == frameCount-15 ||

frame == frameCount-16 ||

frame == frameCount-17 ||

frame == frameCount-18 ||

frame == frameCount-19 ||

frame == frameCount-20 ||

frame == frameCount-21 ||

frame == frameCount-22 ||

frame == frameCount-23 ||

frame == frameCount-24 ||

frame == frameCount-25 ||

frame == frameCount-26 ||

frame == frameCount-27 ||

frame == frameCount-28 ||

frame == frameCount-29 ||

frame == frameCount-30 ||

frame == frameCount-31 ||

frame == frameCount-32 ||

frame == frameCount-33 ||

frame == frameCount-34 ||

frame == frameCount-35 ||

frame == frameCount-36 ||

frame == frameCount-37 ||

frame == frameCount-38 ||

frame == frameCount-39 ||

frame == frameCount-40 ||

frame == frameCount-41 ||

frame == frameCount-42 ||

frame == frameCount-43 ||

frame == frameCount-44 ||

frame == frameCount-45 ||

frame == frameCount-46 ||

frame == frameCount-47 ||

frame == frameCount-48 ||

frame == frameCount-49 ||

frame == frameCount-50 ||

frame == frameCount-51 ||

frame == frameCount-52 ||

frame == frameCount-53 ||

frame == frameCount-54 ||

frame == frameCount-55 ||

frame == frameCount-56 ||

frame == frameCount-57 ||

frame == frameCount-58 ||

frame == frameCount-59 ||

frame == frameCount-60){

fill(bg,25);

rect(0,0,800,600);

}

if(sound == true){

player.play();

}

if(sound == false){

player.pause();

}

}

void mousePressed(){

fill(c);

if(mouseButton==LEFT){

rectMode(RADIUS);

shapeSize = random(100,150);

rect(mouseX,mouseY,shapeSize,shapeSize);

}

fill(c2);

if(mouseButton==RIGHT){

rectMode(RADIUS);

shapeSize = random(15,40);

rect(mouseX,mouseY,shapeSize,shapeSize);

}

frame = frameCount;

}

void keyPressed(){

float BBwidth = width/4;

float SBwidth = BBwidth/2;

rectMode(CORNER);

noStroke();

switch(key){

case ‘v’:

fill(c3);

rect(0,100,BBwidth,400);

frame = frameCount;

break;

case ‘b’:

fill(c4);

rect(200,100,BBwidth,400);

frame = frameCount;

break;

case ‘n’:

fill(c5);

rect(400,100,BBwidth,400);

frame = frameCount;

break;

case ‘m’:

fill(c6);

rect(600,100,BBwidth,400);

frame = frameCount;

break;

case ‘a’:

fill(c7);

rect(0,0,SBwidth,100);

rect(0,500,SBwidth,100);

frame = frameCount;

break;

case ‘s’:

fill(c8);

rect(SBwidth,0,SBwidth,100);

rect(SBwidth,500,SBwidth,100);

frame = frameCount;

break;

case ‘d’:

fill(c9);

rect(SBwidth*2,0,SBwidth,100);

rect(SBwidth*2,500,SBwidth,100);

frame = frameCount;

break;

case ‘f’:

fill(c10);

rect(SBwidth*3,0,SBwidth,100);

rect(SBwidth*3,500,SBwidth,100);

frame = frameCount;

break;

case ‘j’:

fill(c11);

rect(SBwidth*4,0,SBwidth,100);

rect(SBwidth*4,500,SBwidth,100);

frame = frameCount;

break;

case ‘k’:

fill(c12);

rect(SBwidth*5,0,SBwidth,100);

rect(SBwidth*5,500,SBwidth,100);

frame = frameCount;

break;

case ‘l’:

fill(c13);

rect(SBwidth*6,0,SBwidth,100);

rect(SBwidth*6,500,SBwidth,100);

frame = frameCount;

break;

case ‘;’:

fill(c14);

rect(SBwidth*7,0,SBwidth,100);

rect(SBwidth*7,500,SBwidth,100);

frame = frameCount;

break;

case ‘1’:

if(sound == false){

sound = true;

break;

}

if(sound == true){

sound = false;

break;

}

}

}

import ddf.minim.*;

AudioPlayer player;

Minim minim;

boolean sound;

int frame;

float shapeSize;

float BBwidth;

float SBwidth;

color bg = color(50,45,45);

color c = color(255);

color c2 = color(255);

color c3 = color(225,75,75);

color c4 = color(200,150,250);

color c5 = color(250,225,100);

color c6 = color(100,250,200);

color c7 = color(100,250,200);

color c8 = color(100,250,200);

color c9 = color(250,225,100);

color c10 = color(250,225,100);

color c11 = color(200,150,250);

color c12 = color(200,150,250);

color c13 = color(225,75,75);

color c14 = color(225,75,75);

void setup(){

size(800,600);

background(bg);

rectMode(RADIUS);

noStroke();

minim = new Minim(this);

player = minim.loadFile(“ElectricalParade2.mp3”, 2048);

}

void draw(){

if(frame == frameCount-1 ||

frame == frameCount-2 ||

frame == frameCount-3 ||

frame == frameCount-4 ||

frame == frameCount-5 ||

frame == frameCount-6 ||

frame == frameCount-7 ||

frame == frameCount-8 ||

frame == frameCount-9 ||

frame == frameCount-10 ||

frame == frameCount-11 ||

frame == frameCount-12 ||

frame == frameCount-13 ||

frame == frameCount-14 ||

frame == frameCount-15 ||

frame == frameCount-16 ||

frame == frameCount-17 ||

frame == frameCount-18 ||

frame == frameCount-19 ||

frame == frameCount-20 ||

frame == frameCount-21 ||

frame == frameCount-22 ||

frame == frameCount-23 ||

frame == frameCount-24 ||

frame == frameCount-25 ||

frame == frameCount-26 ||

frame == frameCount-27 ||

frame == frameCount-28 ||

frame == frameCount-29 ||

frame == frameCount-30 ||

frame == frameCount-31 ||

frame == frameCount-32 ||

frame == frameCount-33 ||

frame == frameCount-34 ||

frame == frameCount-35 ||

frame == frameCount-36 ||

frame == frameCount-37 ||

frame == frameCount-38 ||

frame == frameCount-39 ||

frame == frameCount-40 ||

frame == frameCount-41 ||

frame == frameCount-42 ||

frame == frameCount-43 ||

frame == frameCount-44 ||

frame == frameCount-45 ||

frame == frameCount-46 ||

frame == frameCount-47 ||

frame == frameCount-48 ||

frame == frameCount-49 ||

frame == frameCount-50 ||

frame == frameCount-51 ||

frame == frameCount-52 ||

frame == frameCount-53 ||

frame == frameCount-54 ||

frame == frameCount-55 ||

frame == frameCount-56 ||

frame == frameCount-57 ||

frame == frameCount-58 ||

frame == frameCount-59 ||

frame == frameCount-60){

fill(bg,25);

rect(0,0,800,600);

}

if(sound == true){

player.play();

}

if(sound == false){

player.pause();

}

}

void mousePressed(){

fill(c);

if(mouseButton==LEFT){

rectMode(RADIUS);

shapeSize = random(100,150);

rect(mouseX,mouseY,shapeSize,shapeSize);

}

fill(c2);

if(mouseButton==RIGHT){

rectMode(RADIUS);

shapeSize = random(15,40);

rect(mouseX,mouseY,shapeSize,shapeSize);

}

frame = frameCount;

}

void keyPressed(){

float BBwidth = width/4;

float SBwidth = BBwidth/2;

rectMode(CORNER);

noStroke();

switch(key){

case ‘v’:

fill(c3);

rect(0,100,BBwidth,400);

frame = frameCount;

break;

case ‘b’:

fill(c4);

rect(200,100,BBwidth,400);

frame = frameCount;

break;

case ‘n’:

fill(c5);

rect(400,100,BBwidth,400);

frame = frameCount;

break;

case ‘m’:

fill(c6);

rect(600,100,BBwidth,400);

frame = frameCount;

break;

case ‘a’:

fill(c7);

rect(0,0,SBwidth,100);

rect(0,500,SBwidth,100);

frame = frameCount;

break;

case ‘s’:

fill(c8);

rect(SBwidth,0,SBwidth,100);

rect(SBwidth,500,SBwidth,100);

frame = frameCount;

break;

case ‘d’:

fill(c9);

rect(SBwidth*2,0,SBwidth,100);

rect(SBwidth*2,500,SBwidth,100);

frame = frameCount;

break;

case ‘f’:

fill(c10);

rect(SBwidth*3,0,SBwidth,100);

rect(SBwidth*3,500,SBwidth,100);

frame = frameCount;

break;

case ‘j’:

fill(c11);

rect(SBwidth*4,0,SBwidth,100);

rect(SBwidth*4,500,SBwidth,100);

frame = frameCount;

break;

case ‘k’:

fill(c12);

rect(SBwidth*5,0,SBwidth,100);

rect(SBwidth*5,500,SBwidth,100);

frame = frameCount;

break;

case ‘l’:

fill(c13);

rect(SBwidth*6,0,SBwidth,100);

rect(SBwidth*6,500,SBwidth,100);

frame = frameCount;

break;

case ‘;’:

fill(c14);

rect(SBwidth*7,0,SBwidth,100);

rect(SBwidth*7,500,SBwidth,100);

frame = frameCount;

break;

case ‘1’:

if(sound == false){

sound = true;

break;

}

if(sound == true){

sound = false;

break;

}

}

}

Kaleidoscope

This project is about using interesting inputs to control an interactive application. I coded a simple moving kaleidoscope that can response to input :

– V to reshuffle the shapes,

– B to cycle to the value space for the shapes color,

– N to make the shapes spin,

– , (comma) to change the direction of animation (zoom in vs zoom out)

Then, in order to control the Kaleidoscope, I build a stick reader who has 4 connectors placed on the 4 edges like in the following picture :

Then I used a stick with electric contact only on 2 consecutive edges at a time, so as i slide the stick in the reader, it activates different keypress so by designing different sticks the whole system act like a barrel organ.

Example of a stick:

François

Code

FacialExpression

In this exercise, I used a clustering machine to categorize pictures that contain faces of women in different emotional states as described by Ekman (anger, disgust, fear, joy, sadness, surprise, and contempt). My idea is to see if a machine can actually come across the difference between these emotions as human can do. Apparently, the clustering that came out show more the grouping by the persons instead of the expression, meaning that it didn’t work that well. An idea to improve this could be by subtracting each picture of a person by the mean of her picture.

François

Code

The Good, the Bad, and the Ugly

The idea was to study image classification through the notion of social norms and normality: for instance, what can be considered as ugly ? Also, what are the implications of subconscious physiognomy ? This program is supposed to show the limits of this approach by having the computer to decide for us who is good, bad or (and?) ugly.

My idea was to first train the classifier with images from various source : Supreme Court Justices as Good people, Most wanted people by the FBI as Bad people, and face pictures of people considered as Ugly (from a website I found on the internet, their work is morally questionable, so i won’t display these images). Then I used a database of face images as testing images : for each one, the classifier output a triplet of probability to belong in each of these categories. Their image is then mapped into a triangle.

The result is not that great, mainly because I think that the features where not that relevant (pixels of the images), and the 3 categories are not well-balanced (a 2 dimensional grid should have been more appropriate, with beautiful/ugly and good/bad as axes), but it is not that important, since he purpose here is to show the limit of classification.

François

Code

BookADN

In this exercise, we’re trying to study how we can use similarity to display interesting information.

I took 17 ebooks from the Internet (from the open-source project: http://www.gutenberg.org), by using the download popularity at that time (and filtering to get at least somewhat popular books, in english, and of usable size).

Then I run the TF-IDFs algorithm on that corpus, kept the best 50 words per document, and rendered each book as a chromosome, while each word is a gene. For each word, the mapping is the following :

– the IDF factor, since it is the same across the entire corpus, is considered as the size (height) of the gene: if the word is important, then its presence has an high impact on the overall property of the book.

– the TF is used to display the intensity of the gene: if the word/gene is more present in this book, then it means that it expresses itself more that others genes/words, and appears more white.

– the size of a book depends on the the number of words.

In addition, we can cycle through the book y using the W and X key: the current book is then selected in green, and all the best words of this book that appear at least once in others are displayed in green to across all the corpus, with the count per book. Then it is easy to see what are the similar book, and how they are similar.

François

Code

beatZeMusic

This exercise was about syncing an output with music. For the scope of that project, the processing code doesn’t listen to the music; instead, the interactivity is brought by playing with the keyboard and the mouse:

 – by pressing successively W five time accordingly to the music rhythm, the program will register the music tempo and displays psychedelic bubbles at each beat. Pressing Q will unregister the tempo.

 – C will throw random numbers that will move like objects on a pond.

Each of the created objects stay on stage and move towards the audience (each object is actually a particule that evolves in a 3D space), but the user can change the display in the following way:

– V launches the Time Shift, where all the particles are moved back in time (ie in the background) very quickly. It is meant to match momentums in the music.

– P and M changes the field of vision of the pseudo 3D engine.

– If the right click is pressed on, the image is not redrawn at each call of draw, resulting in a perceived accelerated motion.

– Moving the mouse change the relative position of the camera in the 3D space.

Also the class Particle3D provides an abstraction to develop all kinds of 3D object that can evolve in this space, but I haven’t explore further this possibility.

The music I used was “Anyway You Choose to Give It” by The Black Ghosts, remixed by Boy-8-Bit.

François

Code