"Sakanaction's live Othello guy" is this above. This is a picture of the 2013 live Aldebaran. It may be hard to see because it is not clear, but The figure of vocalist Ichiro Yamaguchi is expressed on the back screen using the front and back of Othello. This time I will introduce the procedure to make this with processing!
By the way, the finished product works like below!
Othello is spinning like this!
processing is a programmatic drawing. (Reference: Even beginners in programming are okay! Let's make digital art with Processing) If you select mode, you can write in Java, Javascript, Python, etc., which is convenient!
[Github] OthelloScreen I've posted this Processing project on Github, so see that for the entire code! In this article, I would like to summarize the points. By the way, this time I wrote mode in Java. It's pretty simple, so feel free to use it when you're free!
The processing flow is (1) Invert the camera image only in the horizontal direction (the one that is included by default in processing called Mirror) ② Make the pixel of the specified image bright and dark ③ Draw Othello by replacing the light and dark values with the slope of Othello. is.
int screenWidth = 1280;//checked 640, 1280
int screenHeight = screenWidth*3/4;
int cellSize = 20;
Specify the screen size here with screenWidth (horizontal) and screenHeight (vertical). The size of Othello can be changed by changing the value of cellSize. However, if the value is too small, the processing will be heavy and it will move jerky.
if(isMouseDragged){
translate(width/2,height/2,0);
rotateX(-(mouseY-height/2) / 150.0);
rotateY((mouseX-width/2) / 200.0);
translate(-width/2,-height/2,0);
}
You can change the viewing direction by dragging. This should probably be cool if you use the library better.
int loc = (video.width - x - 1) + y*video.width; // Reversing x to mirror the image
The values of cols and rows are determined by the size of the execution screen and Othello. The pixel that refers to light and dark is assigned to loc. At this time, the camera image is flipped horizontally (it seems to be a process called a mirror). If you tilt your body to the left by doing a mirror, From my point of view, the body of the image is tilted to the left (from my point of view of the image, the body is tilted to the right), so You can see the video without any discomfort.
othellos.get(i*(rows) + j).draw_othello(brightness(video.pixels[loc]));
Make the color information in pixel only light and dark with brightness, I put light and dark values in the draw_othello method of each element of the arraylist of the Othello class.
Before the draw_othello_shape method Specify black or white, and rotate the Othello.
Since there is no columnar shape in the basic figure of processing, It will be long, but write it as it is in this method.
It's a method that I use all over the place, Save the current coordinates with pushMatrix, The coordinates saved by popMatrix are being re-expanded.
This concludes the explanation of the main points of OthelloScreen! have fun!
Recommended Posts