Bestiary Sketch (aka Menagerie, Round 3)

Bryan Lence and I revisited our A to Z midterm to create another version of the creature maker. We kept our foundation of the context-free grammar, but we altered our template for the images. Instead of layering transparencies in set positions, we anchored each image to a specific variable associated with another image (i.e. the head of an animal would be anchored to a specific x-y coordinate on a body). This gave us more flexibility to create more interesting creatures, but it was a bit of a mess:

Unholy Mess of a Processing Sketch

Unholy Mess of a Processing Sketch

We reworked the program to display each animal part as a set of vectors, allowing us to be a little more creative with assigning positions for various parts. We’reĀ  placing a set of circles to overlap as joints in each composite. Our working drawings look like this:

Horse Body Working Sketch with Joints

Horse Body Working Sketch with Joints

In an effort to provide a more engaging user experience, we’ve also moved from a mouse-activated screen display to a physical installation. Our aim now is to project the creatures onto the blank pages of a book, creating a new animal each time a page is turned, and using QR codes to facilitate recall of previous pages’ animals. The installation will be on display at the ITP Spring Show. We’re getting a little closer to the aesthetic we’re looking for, although I’m still hunting for the right font and tweaking the drawings:

Mantilloboon

Mantidilloboon

Here’s today’s working code. It will go through some more changes tomorrow since here our samples are hard coded, rather than drawn from our grammar file:

PShape body;
PShape part;
//String bodyString = “horse2.svg”;
String bodyString =”bluejay2body.svg”;
//PShape frontLegs;
//PShape rearLegs;
//PShape head;

String[] bodyParts = {
“horse2head.svg”, “bluejay2frontlegs.svg”, “horse2rearlegs.svg”, “trans.svg”};

int cx;
int cy;
int bcx;
int bcy;

void setup() {
size(800,800);
body = loadShape(bodyString);
//head = loadShape(“horse2head.svg”);
//frontLegs = loadShape(“horse2frontlegs.svg”);
//rearLegs = loadShape(“horse2rearlegs.svg”);

smooth();
noLoop();

}

void draw() {
shape(body);
assemble(bodyString);
//translate(cx, cy);

//getBodyPoint(“horse2head.svg”);
//shape(head, -bcx, -bcy);
}

int findCoord(String working_, String lookingFor_) {
String lookingFor = lookingFor_;
String working = working_;
int start = working.indexOf(lookingFor);
int end = working.indexOf(” “, start);
String coord = working.substring(start, end);
coord = coord.replace(“cx=”", “”);
coord = coord.replace(“cy=”", “”);
coord = coord.replaceAll(“”", “”);
return int(coord);
}

void assemble(String svgFile_) {
String svgFile = svgFile_;
XMLElement xml = new XMLElement(this, svgFile);
XMLElement[] desc = xml.getChildren(“g/g/circle”);
println(desc);

for (int i=0; i<desc.length; i++) {
String working = desc[i].toString();
cx = findCoord(working, “cx”);
cy = findCoord(working, “cy”);

translate(cx, cy);
getBodyPoint(bodyParts[i]);
println(bodyParts[i]);
part = loadShape(bodyParts[i]);
shape(part, -bcx, -bcy);
translate(-cx, -cy);
}

}

void getBodyPoint(String svgFile_) {
String svgFile = svgFile_;
XMLElement xml = new XMLElement(this, svgFile);
XMLElement[] desc = xml.getChildren(“g/g/circle”);
println(desc);

for (int i=0; i<desc.length; i++) {
String working = desc[i].toString();
bcx = findCoord(working, “cx”);
bcy = findCoord(working, “cy”);

println (“bcx: ” + bcx + ” bcy: ” + bcy);
}
}

Reply