domingo, 10 de maio de 2009

Processing II

As 2 imagens abaixo mostram minhas tentivas de criar um programa no Processing que proporcione interatividade entre o programa e o usuario. Pensei previamente em fazer listras verticais e horizontais que estivessem em harmonia com as elipses. Entao, fui me empolgando um pouco a medida em que eu mudava algumas caracteristicas da imagem, como cor, opacidade, tamanho..) logo pensava em outras alterações. De fato esse tal do Processing dá margem a muitas ideias.
A imagem abaixo foi a primeira que fiz.


void setup() {
size(400, 400);
stroke(255);
}

void draw() {
background(100,90,100);//cor de fundo
noStroke();//sem contorno
fill(100,200,0,129);//cor verde
ellipse(150, 250, mouseX, mouseY);//elipse verde que varia a largura e altura
fill(255,99,0,80);//cor laranja
ellipse(300,100,200,mouseY-9);//elipse laranja que varia a altura
fill(255,0,80,200);//cor rosa
ellipse(mouseX,200,100,mouseY-7);//elipse rosa que varia a posição no eixo X e a altura
fill(255,200);//cor branca opaca
ellipse(100,100,90,90);//elipse branca opaca estatica
fill(255,60);//cor branca opaca
rect(20,0,60,700);//listra vertical
rect(70,0,100,400);//listra vertical
rect(100,0,100,400);//listra vertical
rect(350,0,30,400);//listra vertical
fill(100,200,200,50);//cor azul opaca
rect(0,350,400,30);//listra horizontal
rect(0,200,400,70);//listra horizontal
rect(0,20,400,10);//listra horizontal
fill(255,70);//branca opaca
rect(0,mouseY,400,40);//listra horizontal que move no eixo Y



}

A imagem seguinte é uma variação da imagem de cima. A variação consiste em mudar a cor do fundo, tendo o G variando com a equação
mouseY-200, e mudar a opacidade da elipse amarela de acordo com o movimento do mouse no eixo X.

void setup() {
size(400, 400);
stroke(255);
}

void draw() {
background(100,mouseY-200,80);//cor de fundo
noStroke();//sem contorno
fill(100,200,0,129);//cor verde
ellipse(150, 250, mouseX, mouseY);//elipse verde que varia a largura e altura
fill(255,99,0,80);//cor laranja
ellipse(300,100,200,mouseY-9);//elipse laranja que varia a altura
fill(255,0,80,200);//cor rosa
ellipse(mouseX,200,100,mouseY-7);//elipse rosa que varia a posição no eixo X e a altura
fill(255,200,0,mouseX);//cor amarela que varia a opacidade
ellipse(100,100,90,90);//elipse amarela estatica que varia a opacidade
fill(255,60);//cor branca opaca
rect(20,0,60,700);//listra vertical
rect(70,0,100,400);//listra vertical
rect(100,0,100,400);//listra vertical
rect(350,0,30,400);//listra vertical
fill(100,200,200,50);//cor azul opaca
rect(0,350,400,30);//listra horizontal
rect(0,200,400,70);//listra horizontal
rect(0,20,400,10);//listra horizontal
fill(255,70);//branca opaca
rect(0,mouseY,400,40);//listra horizontal que move no eixo Y



}


Nenhum comentário:

Postar um comentário