Public Show Foi o resultado de muitas experiências e o meu primeiro trabalho com código e é por isso que acho interessante fazer uma explicação do meu processo.
Para mim foi muito difícil, porque nunca fiz nada com Processing e com Arduino tão pouco nunca fiz nada. Por isso eu quis fazer o projecto com código para assim forçar-me em ter interesse e tentar escrever e programar uma ideia.
O primeiro que eu fiz, procurei código, e exercícios semelhantes na net, até que encontrei um que fazia o efeito “glitch”. Eu gostei do efeito, mas não usei porque tinha muitos erros no javascript e com os meus conhecimentos não reparei.
Depois destes primeiros testes, no website de processing, encontrei como fazer a conexão: Arduino e Processing, e isto foi o primeiro. Já que tinha que ter o arduino (experiência física) e processing (transformação da imagem em tempo real com as ordens do sensor).
Com o livro “Arduino” encontrei como fazer a instalação do sensor, porque primeiro eu tinha um sensor de proximidade, mas para fazer o que eu gostava, não serviu.
Pois com ajuda do livro, eu comprei um novo sensor “ultrasound” porque é mais bom para fazer este efeito, é um sensor mais efectivo que o outro. Lá, também encontrei pequenhos tutoriais, e encontrei um de fazer uma explosão na imagem. Código do efeito, si alguém quer tentar (sem função do sensor = sem conexão ao arduino) :
// The next line is needed if running in JavaScript Mode with Processing.js
/* @pjs preload="eames.jpg"; */
PImage img; // The source image
int cellsize = 2; // Dimensions of each cell in the grid
int columns, rows; // Number of columns and rows in our system
void setup() {
size(640, 360, P3D);
img = loadImage("eames.jpg"); // Load the image
columns = img.width / cellsize; // Calculate # of columns
rows = img.height / cellsize; // Calculate # of rows
}
void draw() {
background(0);
// Begin loop for columns
for ( int i = 0; i < columns; i++) {
// Begin loop for rows
for ( int j = 0; j < rows; j++) {
int x = i*cellsize + cellsize/2; // x position
int y = j*cellsize + cellsize/2; // y position
int loc = x + y*img.width; // Pixel array location
color c = img.pixels[loc]; // Grab the color
// Calculate a z position as a function of mouseX and pixel brightness
float z = (mouseX / float(width)) * brightness(img.pixels[loc]) - 20.0;
// Translate to the location, set fill and stroke, and draw the rect
pushMatrix();
translate(x + 200, y + 100, z);
fill(c, 204);
noStroke();
rectMode(CENTER);
rect(0, 0, cellsize, cellsize);
popMatrix();
}
}
}
Por isso o que eu fiz foi:
- 1. Pesquisei efeitos e o modo de como poder fazer a conexão com os dos softwares.
- 2. Programar os dois softwares.
- 3. Programar o sensor.
- 4. Procurar o efeito que eu gostaba.
- 5. Programar o efeito, já conectado com o sensor.
A presentação só foi um protótipo, mais eu estou feliz, porque fiz (e acabei) o meu primer projecto com código e para mim já consegui o objetivo.
Para quem quera conhecer mais : Clique na imagem, para ver um vídeo de explicação do processo de instalação e funçonamento.
Aqui o link do meu projecto final para quém quer conhecer mais : com a explicação final, fotos e um video de mostra do que o meu trabalho foi conceitualmente.
Metodologia Projectual Multimédia 2014-15 