Where is
BLACK?
OVERVIEW
2019.Oct-2020.Jan / Personal Project / Processing / Interactive Design
BACKGROUND
In teamwork, it is torturing that everybody is trying not to be the one who points out the problem and leaves the core problem being suspended. This makes the whole picture of collaboration has a seemingly good facade but actually has been worse. I've just come up with this inspiration, and made a small interactive trial, hoping to raise my co-workers' awareness of this phenomenon.
IDEA
This trial is supposed to make it a point to show:
* A canvas that is gradually and beautifully darkened, indicating that problem is getting worse although it looks OK outside;
* A sudden pollution by some tiny slices to the whole canvas, showing certain problems doing harm to the whole picture;
* A process of recovery should be in this trial;
* A process of catching the core slice and stopping the pollution should be shown as well.
Outcome
I made an interactive poster and for interaction please refer to the interactive Html below or the video at the bottom of the page:
* Tips:
If you choose a wrong slice, all the canvas will be polluted black and needs a long time to recover;
There is only one black slice in the canvas that can prevent this, and it is located in the 4th row from the bottom and 4th column from the right.
class ZigZag {
int xPos;
int yPos;
int a;
int i;
int c;
ZigZag(int tempX, int tempY, int tempa, int tempi, int tempc) {
xPos=tempX;
yPos=tempY;
a= tempa;
i= tempi;
c= tempc;
}
void drawZig() {
if (c!=0) {
fill(random(220, 255), random(240-i, 255), random(240-i, 255));
} else {
fill(c);
}
stroke(255, 0, 0);
strokeWeight(1);
beginShape();
vertex(xPos, yPos);
vertex(xPos+2*a, yPos);
vertex(xPos+2*a, yPos+a);
vertex(xPos+a, yPos+a);
vertex(xPos+a, yPos+2*a);
vertex(xPos, yPos+2*a);
endShape(CLOSE);
}
void drawZag() {
fill(random(220, 255), random(240-i, 255), random(240-i, 255));
stroke(255, 0, 0);
strokeWeight(1);
beginShape();
vertex(xPos, yPos+2*a);
vertex(xPos+a, yPos+2*a);
vertex(xPos+a, yPos+a);
vertex(xPos+2*a, yPos+a);
vertex(xPos+2*a, yPos+3*a);
vertex(xPos, yPos+3*a);
endShape(CLOSE);
}
void loopConditions() {
xPos+=2*a;
if (xPos>width) {
xPos=0;
yPos+=3*a;
i+=1;
if (yPos>height) {
yPos=0;
if (i>200) {
i=0;
}
}
}
}
void sliceCondition() {
if (mousePressed) {
if (mouseX>xPos && mouseX<xPos+2*a && mouseY>yPos && mouseY<yPos+2*a) {
drawZig();
noLoop();
} else {
fill(0);
background(0);
}
}
}
}
ZigZag zig;
ZigZag zigSlice;
void setup() {
size(560, 840);
background(#FFFF9D, 100);
zig= new ZigZag(0, 0, 20, 70,1);
zigSlice=new ZigZag(400,600,20,70,0);
}
void draw() {
zig.drawZig();
zig.loopConditions();
zig.drawZag();
zig.loopConditions();
zigSlice.sliceCondition();
PFont f;
f=createFont("impact", 24);
//println(PFont.list());
textFont(f, 80);
fill(0);
text("WHERE IS", 140, 350);
text("BLACK?", 170, 420);
}