float x; // variable decimal x
float y; // variable decimal y
int centX = 640; // variable entero centX
int centY = 400; //variable entro centY
int time1 = 6000; // variable entero, tiempo en milisegundos, 6 segundos
int time2 = 4000; // variable entero, tiempo en milisegundos, 4 segundos
int time3 = 9000; // variable entero, tiempo en milisegundos, 9 segundos
int time4 = 12000; // variable entero, tiempo en milisegundos, 12 segundos
int time5 = 15000; // variable entero, tiempo en milisegundos, 15 segundos
int time6 = 18000; // variable entero, tiempo en milisegundos, 18 segundos
void setup() {
size(1280, 800); // tamanño del sketch
background(255); // color de fondo
strokeWeight(0.5); // grueso de la linea
stroke(0,50); // color de la linea
smooth(); // los objetos se dibujen suaves
}
void draw() {
frameRate(60); // cantidad de cuadros por segundo
for(int i =0;i<100; i++){ // valor inicial de i / valor final de i / valor en el que i cambia
float lastx = -999; // variable decimal lastx
float lasty = -999; // variable decimal lasty
float radiusNoise=random(10); // variable decimal radiusNoise igual a random(10)
float radius=10; //variable decimal radio (radius)
int startangle=int(random(360)); // entero startangle es igual a un numero entero entre 1 y 359
int endangle = 1440+ int(random(1440)); //variable entero endangle
int anglestep = 1+int(random(3)); // variable entero anglestep
for (float ang= startangle; ang<=endangle; ang+=anglestep){ // valor inicial de ang = startangle/ valor final de ang = endangle / ang aumenta +=anglestep
radiusNoise+=0.05;
int currentTime = millis(); // tiempo acutal transcurrido en milisegundos
if (currentTime >time2) { // si el tiempo transcurrido es igual a la variable time2 el radio es += 0.03
radius +=0.03 ; }
if (currentTime >time1) { // si el tiempo transcurrido es igual a la variable time1 el radio es +=0.02
radius += 0.02;
}
if (currentTime> time3) { // si el tiempo transcurrido es igual a la variable time3 el radio es +=0.01
radius += 0.01; }
if(currentTime > time4) { // si el tiempo transcurrido es igual a la variable time4 el radio es +=0.1
radius += 0.01; }
if (currentTime >time5) { // si el tiempo transcurrido es igual a la variable time5 el radio es +=0.2
radius += 0.2;
// stroke (219, 11, 11,10);
}
if (currentTime >time6) { // si el tiempo transcurrido es igual a la variable time6 el radio es +=0.3
radius +=0.3;
}
float thisRadius=radius+(noise(radiusNoise)*200)-100;
float rad=radians(ang);
x=centX+(thisRadius*cos(rad)) ;
y=centY+(thisRadius*sin(rad));
if(lastx>-999){ // si lastx > -999 se dibuja la linea (x,y,lastx,lasty)
line (x, y, lastx, lasty);
}
lastx=x;
lasty=y;
}
}
}
jueves, 1 de diciembre de 2011
lunes, 28 de noviembre de 2011
Captura de imágenes
*Video de la proyección:
*Intervención en la calle utilizando la proyección:
*Para realizar la estructura de la visual, me base en la observación de la planta Diente de Leon o Taraxacon officinalis. Pudiendo encontrar mucha información en internet es posible definir las características de esta planta:
-Es una planta silvestre condiderada como "mala hierva" de color amarillo, cuando la flor se seca se crean los frutos que son los "pelitos" o aquenio de color blanco, estos estan adheridos a un centro circular que cuenta con "ganchitos" que ayudan al fruto a adherirse a la superficie o la piel de un animal cuando el viento las distribuye por el espacio.
La visual esta construida a partir de un centro y alrededor cuenta con finas estructuras que se asemejan a la flor diente de leon.
Video de como crece la flor:
martes, 22 de noviembre de 2011
Avances:
PD: todos los sketches que subo a openprocessing se ejecutan mucho más lento en comparación a ejecutarlos en processing en el computador. Se recomienda copiar el código y ejecutarlo en el computador
Sketch_4:
http://www.openprocessing.org/visuals/?visualID=46739
Sketch_5:
http://www.openprocessing.org/visuals/?visualID=46740
Sketch_6:
http://www.openprocessing.org/visuals/?visualID=46741
Sketch_7:
http://www.openprocessing.org/visuals/?visualID=46743
sketch_7_1:
Esta en mi computador.
sketch_8:
mousePressed
http://www.openprocessing.org/visuals/?visualID=46744
sketch_9:
keyPressed
http://www.openprocessing.org/visuals/?visualID=46969
sketch_11:
mousePressed y loop, noLoop
http://www.openprocessing.org/visuals/?visualID=46970
Sketch_4:
http://www.openprocessing.org/visuals/?visualID=46739
Sketch_5:
http://www.openprocessing.org/visuals/?visualID=46740
Sketch_6:
http://www.openprocessing.org/visuals/?visualID=46741
Sketch_7:
http://www.openprocessing.org/visuals/?visualID=46743
sketch_7_1:
Esta en mi computador.
sketch_8:
mousePressed
http://www.openprocessing.org/visuals/?visualID=46744
sketch_9:
keyPressed
http://www.openprocessing.org/visuals/?visualID=46969
sketch_11:
mousePressed y loop, noLoop
http://www.openprocessing.org/visuals/?visualID=46970
lunes, 14 de noviembre de 2011
Avances proyecto examen
Para realizar mi proyecto me he basado en las enseñanzas de Arte Generativo de Matt Pearson.
Pueden bajar el libro "Generative Art" por internet como tambien consultar dos páginas relacionadas con el libro:
*Capitulo nº 7 movimiento, del libro Getting Started with Processing, con mi traducción al español:
Lo primero que hice fue comenzar con los conceptos básicos que me ayudaran a la construcción de un código que " se genere por su solo" utilizando elementos como random o noise y unas cuantas operaciones matemáticas es posible hacer que una figura o un conjunto de elementos de la sensación de movimiento "por si solo".
Para comenzar describiré una lista de los elementos básicos junto a sus funciones y otros datos:
* frame loop:
Con frame loop puedes agregar la dimensión de tiempo a una visual 2D y crear trabajos que crecen y se mueven. Aquí se encuentran:
-setup()
-draw()
-Variable scope. Las variables dentro de las funciones se llaman local. Solo existen en esa localidad. Variables fuera de las funciones son llamadas global: están en todas partes.
*Aveces se usa un (_) para decir que una variable es global.
*Capturando imágenes estáticas desde una aplicación:
Con el siguiente código se puede capturar cuadro por cuadro una composición que se mueva.
void KeyPressed() {
if (keyCode == ENTER) {
saveFrame ("screen -####.jpg");
}
}
*frame Rate():
Para crear movimiento fluido, porcessing ejecuta el código dentro de draw() a 60 fotogramas por segundo. La función frameRate() cambia la velocidad en la cual el rpograma se ejecuta.
Para crear ejemplo de movimiento fluido, usamos datatype llamado float.
float= número decimal (variable)
Permite mover la figura tan lento como quieres (1.01, 1.02, 1.03).
En cambio int = variable número entero solamente se mueve (1,2,3,4)
*random():
En Processing una función random da valores en un rango de 0 a 1, lo cual lo puedes manipular para dar un valor entre cualquier rango.
-Un parámetro para un valor máximo
-Dos parámetros para un valor entre un rango.
EJ:
float randnum = random (20, 480);
float randnum = random (460) + 20;
float randnum = (random (1) * (max + min)) - min
- random genera número al azar. Cada vez que la función random es llamada, regresa un valor inesperado en un rango específico. Si se pasa un parámetro a la función devolverá un número decimal entre 0 y el valor del parámetro más alto.
La función que llama random (5) devuelve valores entre 0 y 5 (empezando en cero, subiendo pero no incluyendo 5).
Si dos parámetros son pasados, devolvera un decimal con un valor entre los parámetros. La función llama a random (-5, 10.2) devuelve valores empezando a -5 hasta (sin incluir) 10.2
Para convertir un número flotante a un entero usa la función int()
Syntax random (high)
random ( low, high)
high int o float
low int o float
*randomSeed():
Por omisión random() produce diferentes resultados cada vez que el programa es ejecutado. Setea el parámetro del valor a una constante para devolver los mismo números al azar cada vez que el software se ejecute.
randomSeed(value);
value = int
* int():
Datatype para enteros, números sin una decimal. Pueden ser números grandes o chicos. Están almacenados a 32 bits de información. La primera vez que una variable es escrita, tiene que ser declarada expresando su datatype.
int var = value
var: nombre de la variable que se refiere el valor
value: cualquier valor entero
*float():
datatype para números decimales
float var = value
var: variable de la variable que se refiere el valor
value: cualquier valor decimal
*noise():
Enables you to harness in your own creations the same naturalistic variance seen on the big screen. Is generally used to produce a sequence of numbers.
-Devuelve "the Perlin noise" valor a coordenadas específicas. Perlin noise es un generador de secuencias aleatorias que produce un orden más natural, una sucesión armónica de números comparado con el random() estandar.
-La principal diferencia de random() es que Perlin noise es definido en un espacio dimensional n infinito donde cada par de coordenadas corresponde a un valor semi-aleatorio arreglado. El valor resultante estara siempre entre 0.0 y 1.0. Processing puede trabajar con 1D, 2D Y 3D noise, dependiendo el número de coordenadas dadas. El valor noise puede ser animado moviendose por el espacio noise.
Come una regla general mientras más pequeña la diferencia entre coordenadas, más suave será el resultado de la secuencia noise. Se recomienda steps entre 0.005 y 0.03.
noise (x)
noise (x,y)
noise (x,y,z)
x float : coordenadas x
y float: coordenadas y
z float coordenadas z
*Like noise the trigonometric functions sin and cos also return values that vary smothly according to arguments you pass to them. With these two mathematical functions, you pass an angle (in radians) adn the functions return a value between -1 and 1.
-Los valores de random y noise son resultados de un calculo.
*pow():
Facilitates exponential expresions. La función pow() es una forma eficiente de multiplicar números por ellos mismos ( o su recíproco) en largas cantidades.
ej: pow (3,5) es equivalente a 3*3*3*3*3 y
pow (3,-5) es equivalente a 1/ 3*3*3*3*3
*sin():
calcula el seno de un ángulo. Esta función espera que los valores del parámetro del ángulo sean dados en radianes (valor de 0 a 6.28). Los valores son retornados en un rango de -1 a 1.
sin (rad)
rad = float: and angle in radians
*cos():
Esta función espera que el valor del parámetro del ángulo sea dada en radianes (valores de 0 a PI*2). Los valores son devueltos en un rango de -1 a 1.
angle: float = ángulo en radianes
*radians():
convierte a una medida de grados (degree) en su valor de radianes (radians) correspondiente.
Los radianes y los grados son dos formas de medir una misma cosa. Hay 360 grados en un circulo y 2*PI radianes en un círculo.
-Por ejemlo: 90º = PI/2 = 1,570...
Todos los métodos trigonométricos en processing requieren que sus parámetros sean especificados en radianes.
radians (angle)
angle = int or float
Ej: float deg = 45.0
float rad = radians (deg);
* degrees():
Convierte un valor en radianes a grados.
Ej: degrees (angle)
angle = int or float
*tan():
Calcula el radios del seno y coseno de un ángulo. Esta función espera que los valores del parámetro del ángulo esten dados en radianes (valores de 0 a PI*2). Los valores son retornados en un rango de infinity a -infinity.
Ej: tan (angle)
angle = float = un ángulo en radianes
cuando sin() y cos() son usados juntos ellos producen movimiento circular.
-cos() provee las coordenadas x
-sin() provee las coordenadas y
*Radians y degrees*
-Un radian equivale a 180/PI
360 grados = 2PI radianes
radin= degrees*(180/PI)
*scalar:
sin() y cos() son multiplicados por la variable scalar para cambiar el radios del movimiento.
*offset():
sin() y cos() son sumadas con un valor offset (valor de desplazamiento) para establecer el centro del movimiento circular.
*beginShape():
Usar las funciones beginShape() y endShape() permiten crear formas más complejas. beginShape() empieza con el vértice de una figura y endShape() lo termina. Después de llamar a beginShape() una serie de vertex() comandos deben seguir. Para pasar de dibujar la figura llama a endShape().
La función vertex() con dos parámetros especifica una posición 2D y el vertex () con tres parámetros una posición 3D.
*vertex():
Todas las figuras estén hechas para conectar una serie de vértices. vertex() es usado para especificar las coordenadas del vértice para puntos. lineas, triángulos, cuadrados y polígonos y es usado exclusivamente entre las funciones beginShape() y endShape().
*translate():
modificando el sistema de coordenadas se puede crear diferentes transformaciones como traslación rotación y scaling.
-translate() especifica la cantidad (de pixeles) para ubicar un objeto en la pantalla. El parámetro x especifica la traslación de izquierda a derecha. El parámetro y especifica la traslación de arriba a abajo. El parámetro z especifica la traslación (más cerca o más lejos) de la pantalla. Si se llama a translate (50,0) y luego translate (20,0) se convertira en translate (70,0).
Si translate esta dentro de draw() la transformación es reseteada cuando el loop comienza de nuevo.
translate (x,y); x= izquierda / derecha
translate (x,y,z); y= arriba / abajo
z= adelante / atras
Ya que translate() suma las traslaciones que son llamadas dentro de void draw, para aislar las transformaciones y que n ointervengan con las demás usamos: pushMatrix() y popMatrix()
*pushMatrix():
guarda la posición inicial del sistema de coordenadas.
*popMatrix():
restaura el sistema de coordenadas a la manera que era antes. Se utiliza estas funciones para aislar las transformaciones.
_________________________________________________________________________________
*Primeros códigos:
-Sketch_1: Este fue el primer código que encontré en el libro "Generative Art" de Matt Pearson referente a la idea que quiero trabajar para mi proyecto. Se le realizó unos ajustes al código para resaltar su forma circular.
http://www.openprocessing.org/visuals/?visualID=46050
-Sketch_2: Este código lo hice yo utilizando los parámetro sin(), cos() y random() de manera de aplicarlo a un línea y crear un movimiento circular.
http://www.openprocessing.org/visuals/?visualID=46052
-Sketch_3: este código es una combinación del sketch 1 y 2, que también lo hice yo, donde da la leve sensación que el figura esta creciendo, actualmente estoy trabajando en este código para poder lograr un efecto de movimiento mejor y agregarle más características.
http://www.openprocessing.org/visuals/?visualID=46054
*Capturando imágenes estáticas desde una aplicación:
Con el siguiente código se puede capturar cuadro por cuadro una composición que se mueva.
void KeyPressed() {
if (keyCode == ENTER) {
saveFrame ("screen -####.jpg");
}
}
*frame Rate():
Para crear movimiento fluido, porcessing ejecuta el código dentro de draw() a 60 fotogramas por segundo. La función frameRate() cambia la velocidad en la cual el rpograma se ejecuta.
Para crear ejemplo de movimiento fluido, usamos datatype llamado float.
float= número decimal (variable)
Permite mover la figura tan lento como quieres (1.01, 1.02, 1.03).
En cambio int = variable número entero solamente se mueve (1,2,3,4)
*random():
En Processing una función random da valores en un rango de 0 a 1, lo cual lo puedes manipular para dar un valor entre cualquier rango.
-Un parámetro para un valor máximo
-Dos parámetros para un valor entre un rango.
EJ:
float randnum = random (20, 480);
float randnum = random (460) + 20;
float randnum = (random (1) * (max + min)) - min
- random genera número al azar. Cada vez que la función random es llamada, regresa un valor inesperado en un rango específico. Si se pasa un parámetro a la función devolverá un número decimal entre 0 y el valor del parámetro más alto.
La función que llama random (5) devuelve valores entre 0 y 5 (empezando en cero, subiendo pero no incluyendo 5).
Si dos parámetros son pasados, devolvera un decimal con un valor entre los parámetros. La función llama a random (-5, 10.2) devuelve valores empezando a -5 hasta (sin incluir) 10.2
Para convertir un número flotante a un entero usa la función int()
Syntax random (high)
random ( low, high)
high int o float
low int o float
*randomSeed():
Por omisión random() produce diferentes resultados cada vez que el programa es ejecutado. Setea el parámetro del valor a una constante para devolver los mismo números al azar cada vez que el software se ejecute.
randomSeed(value);
value = int
* int():
Datatype para enteros, números sin una decimal. Pueden ser números grandes o chicos. Están almacenados a 32 bits de información. La primera vez que una variable es escrita, tiene que ser declarada expresando su datatype.
int var = value
var: nombre de la variable que se refiere el valor
value: cualquier valor entero
*float():
datatype para números decimales
float var = value
var: variable de la variable que se refiere el valor
value: cualquier valor decimal
*noise():
Enables you to harness in your own creations the same naturalistic variance seen on the big screen. Is generally used to produce a sequence of numbers.
-Devuelve "the Perlin noise" valor a coordenadas específicas. Perlin noise es un generador de secuencias aleatorias que produce un orden más natural, una sucesión armónica de números comparado con el random() estandar.
-La principal diferencia de random() es que Perlin noise es definido en un espacio dimensional n infinito donde cada par de coordenadas corresponde a un valor semi-aleatorio arreglado. El valor resultante estara siempre entre 0.0 y 1.0. Processing puede trabajar con 1D, 2D Y 3D noise, dependiendo el número de coordenadas dadas. El valor noise puede ser animado moviendose por el espacio noise.
Come una regla general mientras más pequeña la diferencia entre coordenadas, más suave será el resultado de la secuencia noise. Se recomienda steps entre 0.005 y 0.03.
noise (x)
noise (x,y)
noise (x,y,z)
x float : coordenadas x
y float: coordenadas y
z float coordenadas z
*Like noise the trigonometric functions sin and cos also return values that vary smothly according to arguments you pass to them. With these two mathematical functions, you pass an angle (in radians) adn the functions return a value between -1 and 1.
-Los valores de random y noise son resultados de un calculo.
*pow():
Facilitates exponential expresions. La función pow() es una forma eficiente de multiplicar números por ellos mismos ( o su recíproco) en largas cantidades.
ej: pow (3,5) es equivalente a 3*3*3*3*3 y
pow (3,-5) es equivalente a 1/ 3*3*3*3*3
*sin():
calcula el seno de un ángulo. Esta función espera que los valores del parámetro del ángulo sean dados en radianes (valor de 0 a 6.28). Los valores son retornados en un rango de -1 a 1.
sin (rad)
rad = float: and angle in radians
*cos():
Esta función espera que el valor del parámetro del ángulo sea dada en radianes (valores de 0 a PI*2). Los valores son devueltos en un rango de -1 a 1.
angle: float = ángulo en radianes
*radians():
convierte a una medida de grados (degree) en su valor de radianes (radians) correspondiente.
Los radianes y los grados son dos formas de medir una misma cosa. Hay 360 grados en un circulo y 2*PI radianes en un círculo.
-Por ejemlo: 90º = PI/2 = 1,570...
Todos los métodos trigonométricos en processing requieren que sus parámetros sean especificados en radianes.
radians (angle)
angle = int or float
Ej: float deg = 45.0
float rad = radians (deg);
* degrees():
Convierte un valor en radianes a grados.
Ej: degrees (angle)
angle = int or float
*tan():
Calcula el radios del seno y coseno de un ángulo. Esta función espera que los valores del parámetro del ángulo esten dados en radianes (valores de 0 a PI*2). Los valores son retornados en un rango de infinity a -infinity.
Ej: tan (angle)
angle = float = un ángulo en radianes
cuando sin() y cos() son usados juntos ellos producen movimiento circular.
-cos() provee las coordenadas x
-sin() provee las coordenadas y
*Radians y degrees*
-Un radian equivale a 180/PI
360 grados = 2PI radianes
radin= degrees*(180/PI)
*scalar:
sin() y cos() son multiplicados por la variable scalar para cambiar el radios del movimiento.
*offset():
sin() y cos() son sumadas con un valor offset (valor de desplazamiento) para establecer el centro del movimiento circular.
*beginShape():
Usar las funciones beginShape() y endShape() permiten crear formas más complejas. beginShape() empieza con el vértice de una figura y endShape() lo termina. Después de llamar a beginShape() una serie de vertex() comandos deben seguir. Para pasar de dibujar la figura llama a endShape().
La función vertex() con dos parámetros especifica una posición 2D y el vertex () con tres parámetros una posición 3D.
*vertex():
Todas las figuras estén hechas para conectar una serie de vértices. vertex() es usado para especificar las coordenadas del vértice para puntos. lineas, triángulos, cuadrados y polígonos y es usado exclusivamente entre las funciones beginShape() y endShape().
*translate():
modificando el sistema de coordenadas se puede crear diferentes transformaciones como traslación rotación y scaling.
-translate() especifica la cantidad (de pixeles) para ubicar un objeto en la pantalla. El parámetro x especifica la traslación de izquierda a derecha. El parámetro y especifica la traslación de arriba a abajo. El parámetro z especifica la traslación (más cerca o más lejos) de la pantalla. Si se llama a translate (50,0) y luego translate (20,0) se convertira en translate (70,0).
Si translate esta dentro de draw() la transformación es reseteada cuando el loop comienza de nuevo.
translate (x,y); x= izquierda / derecha
translate (x,y,z); y= arriba / abajo
z= adelante / atras
Ya que translate() suma las traslaciones que son llamadas dentro de void draw, para aislar las transformaciones y que n ointervengan con las demás usamos: pushMatrix() y popMatrix()
*pushMatrix():
guarda la posición inicial del sistema de coordenadas.
*popMatrix():
restaura el sistema de coordenadas a la manera que era antes. Se utiliza estas funciones para aislar las transformaciones.
_________________________________________________________________________________
*Primeros códigos:
-Sketch_1: Este fue el primer código que encontré en el libro "Generative Art" de Matt Pearson referente a la idea que quiero trabajar para mi proyecto. Se le realizó unos ajustes al código para resaltar su forma circular.
http://www.openprocessing.org/visuals/?visualID=46050
-Sketch_2: Este código lo hice yo utilizando los parámetro sin(), cos() y random() de manera de aplicarlo a un línea y crear un movimiento circular.
http://www.openprocessing.org/visuals/?visualID=46052
-Sketch_3: este código es una combinación del sketch 1 y 2, que también lo hice yo, donde da la leve sensación que el figura esta creciendo, actualmente estoy trabajando en este código para poder lograr un efecto de movimiento mejor y agregarle más características.
http://www.openprocessing.org/visuals/?visualID=46054
miércoles, 26 de octubre de 2011
lunes, 24 de octubre de 2011
domingo, 9 de octubre de 2011
Media
Tarea:
Ejercicio con imágenes png e interactividad del mouse.
http://www.openprocessing.org/visuals/?visualID=41737
Ejercicio con imágenes png e interactividad del mouse.
http://www.openprocessing.org/visuals/?visualID=41737
miércoles, 28 de septiembre de 2011
Robot grupo
robot que modificamos con el grupo, capítulo movimiento.
http://www.openprocessing.org/visuals/?visualID=39606
http://www.openprocessing.org/visuals/?visualID=39606
martes, 20 de septiembre de 2011
Ante-Proyecto
Process 18 from REAS on Vimeo.
Proyecto examen para Tecnologías aplicadas:Descripción:
El proyecto busca crear un composición en movimiento a partir de diferentes figuras, como círculos, lineas, cuadrados y triángulos. Aplicando funciones aprendidas en clases para poder hacer que las figuras se muevan en el espacio, se multipliquen al azar, cambien de colores y se mezclen diferentes formas. Lo que se intenta crear es poder simular las formas y movimientos del crecimiento de las bacterias o los cristales de agua.
La composición que se genere a partir de los patrones de movimiento y figuras será al azar, se asignaran a cada figura un movimiento, tamaño y reacciones según lo que ocurra en el sketch, estos patrones de movimiento estarán en funcionamiento constante hasta que se le indique lo contrario, lo que provocara que cada vez que el programa sea ejecutado se formaran diferentes composiciones, dependiendo del tiempo en el cual sean ejecutadas y cuantas figuras se incluyan en ella.
Bacterias
Cristales de agua
Ejemplos construidos en Processing por Casey Reas
La segunda parte consta de construir una interfaz para poder juntar los programas Arduino y Processing. Entendiendo por interfaz, la conexión física y funcional entre dos aparatos o sistemas independientes. Esta interfaz funcionaría como un controlador a través del cual, por medio de sensores, se podría intervenir y controlar una visualización creada en Processing.
Tengo diferentes alternativas para construir la forma del controlador, entre las cuales están:
-Como un celular, con botones y potenciómetros.
Medidas: 15x7x2 cms
Uso manual.
-Con forma de tablero digital, con botones, potenciómetros lineales y normales, sensores de presión.
Medidas: 20x25x4 cms
Estará dispuesto en una mesa.
-Usando un pote de plástico en el cual colorar los sensores ya mencionados anteriormente.
20x20x13 cms
Estará dispuesto en una mesa.
Cada una de las distintas posibilidades ocupa diferentes materiales, como plástico, madera, metal, aluminio, mica, pegamento, tornillos, pintura, cinta adhesiva.
Dependiendo de la forma elegida se usaran distintos materiales.
2)Fundamentación:
Luego de buscar imágenes de las bacterias y los cristales de agua, busque proyectos relacionados con la misma idea que estaba desarrollando. Así fue como llegue al Process Compendium 2004-2010 de Casey Reas. A partir de las imágenes de las distintas y composiciones realizadas por Reas y en conjunto con las imágenes anteriores es como desarrollare la idea para este proyecto.
En la página www.reas.com es posible ver más sobre el Process Compendium y otros trabajos.
El objetivo es poder reflexionar acerca del movimiento y composición de estas distintas formas de vida, la mayoría microscópicas e imposibles percibir con el ojo humano, pero que a pesar de esta dificultad gracias a la tecnología hoy en día es posible descubrirlas, mirarlas y estudiarlas. Este proyecto busca crear una instancia de observación y reflexión en el como la tecnología ha abierto una puerta para poder descubrir estas formas de vida imperceptibles y que además es posible poder utilizar sus mismas composiciones, patrones, movimientos, formas y colores a través de diferentes programas para imitar, crear y reproducirlas en una plataforma digital y completamente externa a su naturaleza, pero que al mismo tiempo sin esta plataforma no podrían ser objeto de estudio. Como a partir de un objeto inerte es posible crear una visualización de elementos con vida o una representación u imitación de los patrones de movimiento de estos.
La dimensiones sería del porte de la pantalla 1280x750 pixeles.
Decidí realizar esta idea porque creo que trabaja con todos los contenidos aprendidos durante el predio de clases y también otros contenidos más avanzados que podrán ser aplicados después de investigar a fondo el funcionamiento del programa.
Este proyecto trabaja con diferentes etapas, la primera es de investigación en la cual se deben adquirir todos elementos necesarios para poder realizar las visuales en Processing. En conjunto con eso poder establecer un punto de contacto entre las primeras imágenes que encontré, de bacterias y cristales de agua, y el trabajo final construido en Processing. Luego de tener el proyecto en Processing terminado, el siguiente paso es encontrar la forma de poder crear una interfaz entre Processing y Arduino, para llevar al proyecto a un siguiente nivel, el cual permitirá al espectador controlar lo que ocurra en la visualización e intervenir en directamente en la creación de las figuras, formas y movimientos en el sketch.
Finalmete después de hacer la investigación y descubrir la forma de conectar Processing y Arduino, el ultimo paso es construir la interfaz con el cual controlar a través de sensores y botones la visualización. Esta será construida a partir de los ejemplo entregados anteriormente y utilizando sensores y componentes del Arduino Starter Kit.
Decidí realizar esta idea porque creo que trabaja con todos los contenidos aprendidos durante el predio de clases y también otros contenidos más avanzados que podrán ser aplicados después de investigar a fondo el funcionamiento del programa.
Este proyecto trabaja con diferentes etapas, la primera es de investigación en la cual se deben adquirir todos elementos necesarios para poder realizar las visuales en Processing. En conjunto con eso poder establecer un punto de contacto entre las primeras imágenes que encontré, de bacterias y cristales de agua, y el trabajo final construido en Processing. Luego de tener el proyecto en Processing terminado, el siguiente paso es encontrar la forma de poder crear una interfaz entre Processing y Arduino, para llevar al proyecto a un siguiente nivel, el cual permitirá al espectador controlar lo que ocurra en la visualización e intervenir en directamente en la creación de las figuras, formas y movimientos en el sketch.
Finalmete después de hacer la investigación y descubrir la forma de conectar Processing y Arduino, el ultimo paso es construir la interfaz con el cual controlar a través de sensores y botones la visualización. Esta será construida a partir de los ejemplo entregados anteriormente y utilizando sensores y componentes del Arduino Starter Kit.
3)Objetivos:
Los objetivos de este proyecto son:
- Aplicar todos los contenidos aprendidos durante el curso de programación con Processing.
-Establecer una relación entre un objeto externo y el programa, para que el usuario pueda intervenir en el funcionamiento de lo que esta viendo en el.
-Crear una atmósfera de interacción entre las personas y el programa.
-Mostrar otros programas OpenSource como Arduino y como conectarlos con el programa trabajado durante el curso.
-Reflexionar acerca del uso de las tecnologías como formas inertes, pero con la capacidad de representar y crear patrones de la vida vegetal, como las bacterias y los cristales de agua.
martes, 13 de septiembre de 2011
Clase 4
Tarea clase 4:
Definir conceptos:
*int:
Corresponde a un numero entero, se ocupa para darle valor a las variables que se utilizaran en el código.
*ellipseMode (RADIUS):
El modo radio es igual que el modo centro de ellipseMode. Este modo especifica que la locación de la ellipse será el centro de la figura y desde el centro se definen los bordes de la figura.
*mouseX:
Es una variable que indica que el valor será equivalente a donde se encuentre la coordinada del mouse en X.
*mouseY:
Es una variable que indica que el valor será equivalente a donde se encuentre la coordinada del mouse en Y.
*mousePressed:
Esta función es llamada siempre que el botón del mouse sea presionado. Es posible definir que ocurra una "acción" al apretar el boton.
Ejercicios:
1
http://www.openprocessing.org/visuals/?visualID=37060
2
http://www.openprocessing.org/visuals/?visualID=37063
Definir conceptos:
*int:
Corresponde a un numero entero, se ocupa para darle valor a las variables que se utilizaran en el código.
*ellipseMode (RADIUS):
El modo radio es igual que el modo centro de ellipseMode. Este modo especifica que la locación de la ellipse será el centro de la figura y desde el centro se definen los bordes de la figura.
*mouseX:
Es una variable que indica que el valor será equivalente a donde se encuentre la coordinada del mouse en X.
*mouseY:
Es una variable que indica que el valor será equivalente a donde se encuentre la coordinada del mouse en Y.
*mousePressed:
Esta función es llamada siempre que el botón del mouse sea presionado. Es posible definir que ocurra una "acción" al apretar el boton.
Ejercicios:
1
http://www.openprocessing.org/visuals/?visualID=37060
2
http://www.openprocessing.org/visuals/?visualID=37063
sábado, 3 de septiembre de 2011
Clase 3 - Ejercicios
Ejercicio 1:
Ejercicio de lineas, con figuras, círculos y rectángulos. Color del grosor de la figura, stroke, y calculando el grosor de la figura, strokeWeight.
Ejercicio 2:
En este ejercicio trabajamos ubicando figuras en el plano, color, stroke, strokeWeight, círculos, lineas y rectángulos, para formar un robot.
Utilizamos el mismo código que esta en el libro Getting Started with Processing.
Ejercicio 3:
Este ejercicio es un resumen de lo que hemos trabajado hasta ahora en clases.
Mezcla colores, stroke, movimiento con el mouse y figuras (rect).
Trabaja con el concepto de las variables, para poder provocar el cambio de colores en las figuras hay que introducir esos cambios en las variables de código.
TAREA: Realizar un versión 2.0 del robot que realizamos en clases.
En esta version 2.0 trabaje con variables, las puse al principio del código para luego llamarlas al tener que poner los valores de las figuras (lineas, rectángulos y círculos) para formar la figura. También trabaje con mousePressed anteponiendo (if) y al final (else) lo que indicaría que pasaría si el mouse se presiona. Use un código que encontré en el libro Getting Started with Processing y lo modifique, agregándole elementos al robot y el fondo.
Ejercicio de lineas, con figuras, círculos y rectángulos. Color del grosor de la figura, stroke, y calculando el grosor de la figura, strokeWeight.
Ejercicio 2:
En este ejercicio trabajamos ubicando figuras en el plano, color, stroke, strokeWeight, círculos, lineas y rectángulos, para formar un robot.
Utilizamos el mismo código que esta en el libro Getting Started with Processing.
Ejercicio 3:
Este ejercicio es un resumen de lo que hemos trabajado hasta ahora en clases.
Mezcla colores, stroke, movimiento con el mouse y figuras (rect).
Trabaja con el concepto de las variables, para poder provocar el cambio de colores en las figuras hay que introducir esos cambios en las variables de código.
TAREA: Realizar un versión 2.0 del robot que realizamos en clases.
En esta version 2.0 trabaje con variables, las puse al principio del código para luego llamarlas al tener que poner los valores de las figuras (lineas, rectángulos y círculos) para formar la figura. También trabaje con mousePressed anteponiendo (if) y al final (else) lo que indicaría que pasaría si el mouse se presiona. Use un código que encontré en el libro Getting Started with Processing y lo modifique, agregándole elementos al robot y el fondo.
miércoles, 17 de agosto de 2011
Clase 2- Ejercicios
Ejercicio 1, clase 2.
Hoja cuadriculada:
Processing:
size(600, 600); // tamaño del sketch
background (226, 242, 127) // color del fondo
smooth () // suaviza la figura
fill () // color interior de la figura
stroke () // color de la linea de la figura
ellipse () // circulo
rect () // rectángulo
http://www.openprocessing.org/visuals/?visualID=34065
Tarea:
Copiar el código de mouseDemo, intervenirlo y crear un efecto distinto que interactue con el movimiento del mouse.
Ejercicio 1:
Ejercicio 2:
Ejercicio 3:
En este ejercicio combine el código que venia trabajando con un código que encontré en la pagina processing.org
que es es siguiente:
void setup()
{
size(200, 200);
noStroke();
rectMode(CENTER);
}
void draw()
{
background(51);
fill(255, 204);
rect(mouseX, height/2, mouseY/2+10, mouseY/2+10);
fill(255, 204);
int inverseX = width-mouseX;
int inverseY = height-mouseY;
rect(inverseX, height/2, (inverseY/2)+10, (inverseY/2)+10);
}
Este código permite que al mover el mouse cambia la posición y tamaño de cada figura.
Trabaje con la transparencia del color de cada figura, así cuando se juntaran se pudiera ver cual estaba atrás de la otra.
Al fusionar este código con el mío logre el siguiente ejercicio:
Ejercicio 4:
en este ejercicio utilice un código que encontré en la página processing.org
que es el siguiente:
Hoja cuadriculada:
Processing:
Elementos utilizados:
size(600, 600); // tamaño del sketch
background (226, 242, 127) // color del fondo
smooth () // suaviza la figura
fill () // color interior de la figura
stroke () // color de la linea de la figura
ellipse () // circulo
rect () // rectángulo
http://www.openprocessing.org/visuals/?visualID=34065
Tarea:
Copiar el código de mouseDemo, intervenirlo y crear un efecto distinto que interactue con el movimiento del mouse.
Ejercicio 1:
Ejercicio 2:
Ejercicio 3:
En este ejercicio combine el código que venia trabajando con un código que encontré en la pagina processing.org
que es es siguiente:
void setup()
{
size(200, 200);
noStroke();
rectMode(CENTER);
}
void draw()
{
background(51);
fill(255, 204);
rect(mouseX, height/2, mouseY/2+10, mouseY/2+10);
fill(255, 204);
int inverseX = width-mouseX;
int inverseY = height-mouseY;
rect(inverseX, height/2, (inverseY/2)+10, (inverseY/2)+10);
}
Este código permite que al mover el mouse cambia la posición y tamaño de cada figura.
Trabaje con la transparencia del color de cada figura, así cuando se juntaran se pudiera ver cual estaba atrás de la otra.
Al fusionar este código con el mío logre el siguiente ejercicio:
Ejercicio 4:
en este ejercicio utilice un código que encontré en la página processing.org
que es el siguiente:
float max_distance; void setup() { size(200, 200); smooth(); noStroke(); max_distance = dist(0, 0, width, height); } void draw() { background(51); for(int i = 0; i <= width; i += 20) { for(int j = 0; j <= height; j += 20) { float size = dist(mouseX, mouseY, i, j); size = size/max_distance * 66; ellipse(i, j, size, size); } } }
Uní los dos códigos, trabaje con la transparencia de los colores y el resultado fue el siguiente:
domingo, 14 de agosto de 2011
Ejercicios clase 1 - Processing
Ejercicio 1:
Lineas, triángulos y color
Elementos utilizados:
- size (200, 200) // tamaño del sketch
- background (255) // color del fondo, blanco
- fill () // color del interior de la figura
- triangle () // triángulo
- line () // linea
Ejercicio 2:
Rectángulos, círculos, color y transparencia.
Elementos utilizados:
-size (200, 200) // tamaño del sketch
-fill () // color del interior de la figura
-stroke () // color del borde de la figura
-rect () // rectángulo
- noStroke () // figura sin borde
ellipse () // círculo
Lineas, triángulos y color
Elementos utilizados:
- size (200, 200) // tamaño del sketch
- background (255) // color del fondo, blanco
- fill () // color del interior de la figura
- triangle () // triángulo
- line () // linea
Ejercicio 2:
Rectángulos, círculos, color y transparencia.
Elementos utilizados:
-size (200, 200) // tamaño del sketch
-fill () // color del interior de la figura
-stroke () // color del borde de la figura
-rect () // rectángulo
- noStroke () // figura sin borde
ellipse () // círculo
sábado, 13 de agosto de 2011
Paper- Capitulo 1 Getting started with Processing
Capitulo 1 del libro "Getting Started with Processing" de Casey Reas y Ben Fry.
http://es.scribd.com/doc/62242765
http://es.scribd.com/doc/62242765
martes, 21 de junio de 2011
Examen Tecnologías Aplicadas:
Realizar por medio del programa Max una mezcla de video y audio en tiempo real.
Intervenir una imagen o video a través de sonidos u otros sistemas en tiempo real, para crear un video, una canción, un proyección u otras posibilidades.
Max
MSP: sonido
Jitter: imagen (video)
Ejemplo: Controlar a través del sonido la velocidad, color de un video en tiempo real.
Posibles elementos a usar: computador, programa Max, Iphone, microfono, video, cámara web.
miércoles, 8 de junio de 2011
Audio 2
Combinación de sonidos usando GarageBand (Mac).
1.0 by Gabriela Perez Iturra
1.1 by Gabriela Perez Iturra
Construcción paso a paso:
1)Abrir programa GarageBand
1.0 by Gabriela Perez Iturra
1.1 by Gabriela Perez Iturra
Construcción paso a paso:
1)Abrir programa GarageBand
2) Seleccionar "nuevo proyecto" icono "Loops"
3)Seleccionar la carpeta de donde se guardara y el nombre
4) En "bucles" seleccionar los distintos ritmos que usaras
5) Arrastralos al centro
6) Incluir todas las pistas necesarias
7) Con la tecla espacio se puede ir revisando la canción
8) Apretar "mostrar y ocultar automatización de pista" para configurar las pistas
9) Seleccionar volumen pista y regular el volumen de la pista
10) Para finalizar "compartir" "exportar canción a disco, seleccionar mp3, elegir carpeta de destino y nombre
miércoles, 1 de junio de 2011
Audio
Trabajamos con una grabación de una fiesta en Noruega. A partir de esa grabación de 2 minutos aproximadamente, mezclamos y fusionamos con otras canciones, ritmos y tiempos. Así a medida que aprendíamos a usar los programas el audio era mas complejo.
Usamos: Aucacity para PC
Amedus para MAC
GarageBand para MAC
Audio 1:
Audio 2:
http://soundcloud.com/misprimaveras/no-superstarjakaja2
Audio 3:
http://soundcloud.com/gabrielapereziturra/audio3#
Audio 4:
http://soundcloud.com/misprimaveras/audio-4
Usamos: Aucacity para PC
Amedus para MAC
GarageBand para MAC
Audio 1:
Audio 2:
http://soundcloud.com/misprimaveras/no-superstarjakaja2
Audio 3:
http://soundcloud.com/gabrielapereziturra/audio3#
Audio 4:
http://soundcloud.com/misprimaveras/audio-4
miércoles, 18 de mayo de 2011
miércoles, 11 de mayo de 2011
domingo, 1 de mayo de 2011
The Last Hour - Paper
Ensayo escrito sobre qué harás como futuro artista acerca de uno de los temas que aborda el documental The Last Hour.
http://es.scribd.com/doc/54407151/5-Gabriela-Perez
http://es.scribd.com/doc/54407151/5-Gabriela-Perez
jueves, 28 de abril de 2011
miércoles, 27 de abril de 2011
Videos de Star Trek
TOS (The original series) Obsession transporter scene
Star Trek Opening (Original )
Energize: Star Trek Transporter Effect
Star Trek -17 - The squire of gothos Part 1
Star Trek Balance Of Terror (2)
Star Trek Opening (Original )
Energize: Star Trek Transporter Effect
Star Trek -17 - The squire of gothos Part 1
Star Trek Balance Of Terror (2)
Musica de Star Trek
Star Trek Sound Effects - Alien Planet Surface
Star Trek Sound Efffects - Heartbeats
Star Trek Sound Effects - Shuttlecraft Interior
Star Trek Sound Effects - Red Alert Klaxon
Star Trek Sound Efffects - Heartbeats
Star Trek Sound Effects - Shuttlecraft Interior
Star Trek Sound Effects - Red Alert Klaxon
miércoles, 20 de abril de 2011
Suscribirse a:
Entradas (Atom)