Ayrton Pereira C - Proyecto final I&P

De Casiopea
Ayrton Pereira C - Proyecto final I&P


TítuloAyrton Pereira C - Proyecto final I&P
Tipo de ProyectoProyecto de Curso
Período2020-2020
AsignaturaInteracción y Performatividad
Del CursoInteracción y Performatividad 2020
CarrerasDiseño, Diseño Gráfico"Diseño Gráfico" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property., Diseño Industrial"Diseño Industrial" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property.
Alumno(s)Ayrton Pereira
ProfesorRenzo Varela

Controlador VIDI de visualización 3D

Secuenciagif venus ajpc.gif

Un Joystick o Interface manual controla los parámetros de visualización de un objeto tridimensional en la pantalla

El Proyecto surgió en un principio como idea de reutilizar televisores antiguos RCA para adaptarlos mediante salida de TV a un Arduino, en donde sea posible proyectar gráficas o datos visuales de utilidad o para contemplación. Posteriormente se llevó a una prueba mas simplificada en base a comunicación serial entre Processing y arduino.

Elementos usados en Arduino

·Arduino UNO ·3 Potenciómetros ·4 botones ·6 resistencias ·Interruptor deslizante


Conectividad

La interface de control de video sitúa un objeto tridimensional ya sea un modelado, un proyecto o cualquier objeto de formato .obj para ser mostrado en pantalla con las variaciones luminosas deseadas. El programa permite cambiar la iluminación direccional y la sombra desde las perillas del controlador, cambiando su dirección o integrándola a la oscuridad del fondo. su rotación es manejable con la perilla de rotación, en donde el modelo puede ser apreciado de todas sus vistas a voluntad o ser detenido para observar algún punto. Cada botón nos ofrece la posibilidad de ver un modelo distinto y su información, para este caso se instalaron 5 botones que nos presenta cada uno una escultura clásica: Apolo, Venus, El pensador, Discóbolo. El switch permite cambiar el fondo entre blanco o negro, eliminando en el blanco toda tipografía utilizada para sólo dejar el modelo a visualizar. Una canción de fondo acompaña la visualización.

Explicación código Arduino

El código escrito en arduino declara las variables de cada componente ya sea de entrada o salida.Contiene una función llamada ""serial"" en la cual se inicia la transmisión de datos hacia la computadora, el resto del código comprende funciones if else para activar la función del switch y la luz led, que deberá iluminarse cada vez que se presiona un botón de selección. Las variables utilizadas son enviadas bajo valores de carácter y decimales bajo la función println.

Link del circuito en Thinkercad.com: https://www.tinkercad.com/things/gPcgBMzdPbM-coneccion-con-arduino-botones-y-potenciometros

Código de Arduino

Código desplegable


{{

int led = 2; int RotX = 0; int Rotluz = 0; int Rotshad = 0; int boton1 =7; int boton2 =6; int boton3 = 5; int boton4 = 4; int swit = 3;


void setup() {

 pinMode(led, OUTPUT);
 pinMode(RotX, INPUT);
 pinMode(Rotluz, INPUT);
 pinMode(Rotshad, INPUT);
 pinMode(boton1, INPUT);
 pinMode(boton2, INPUT);
 pinMode(boton3, INPUT);
 pinMode(boton4, INPUT);
 pinMode(swit, INPUT);
 
 Serial.begin(9600);

}

void loop() {

 RotX	 = analogRead(A0);
 Rotluz  = analogRead(A1);
 Rotshad = analogRead(A2);
 
 
 Serial.println(RotX, DEC);
 Serial.println(Rotluz, DEC);
 Serial.print(Rotshad, DEC);
 


 if(digitalRead(boton1) == 1) {
   digitalWrite(led, HIGH);
    Serial.println('a');
 }
 else{
	 digitalWrite(led, LOW);
 }
   
   
  if(digitalRead(boton2) == 1) {
   digitalWrite(led, HIGH);
    Serial.println('s');
 }
 else{
 	digitalWrite(led, LOW);
 }
 
 if(digitalRead(boton3) == 1) {
   digitalWrite(led, HIGH);
    Serial.println('d');
 }
 else{
	 digitalWrite(led, LOW);
 }
   
   
  if(digitalRead(boton4) == 1) {
   digitalWrite(led, HIGH);
    Serial.println('w');
 }
 else{
 	digitalWrite(led, LOW);
 }
 
 
  if(digitalRead(swit) == 1) {
     Serial.println(0);
 }
 else{
	  Serial.println(255);
 }
 
 
delay(500);

}

}}


Explicación código de Processing

En el código se Processing se importan 3 configuraciones a usar:

  1. Librería Serial para la comunicación serial recibida desde arduino
  2. Librería Minim Reproductor de audio y efectos de sonido.
  3. 3D Se indica como configuración a través de PShape para cargar modelos 3d ".obj"

Junto con esta configuración se declaran las variables a utilizar, String para los datos recibidos de arduino, PShape para los objetos tridimensionales, variables para el fondo y la rotación. El programa muestra una pantalla de título hasta que se selecciona un modelo 3d, para lo cual es acompañado de música ambiental y un fondo con su iluminación, dependiendo del botón que se pulse en la interface cambiará de modelo, las perillas recibidas por los potenciómetros en arduino regulan la iluminación y el contraste de sombras. Cada selección da correspondencia al usuario con un sonido de confirmación en la interface. La perilla de rotación le otorga la velocidad con que el modelo gira, en el mínimo se quedará detenido, a mas giro, se moverá más rapido.

Código de Processing

Código desplegable


{{import processing.serial*;

Serial Puerto; Puerto = new Serial(this, "nombre puerto", 9600);

String receivedString;

String[] RotX = split(receivedString, 'RotX'); String[] Rotluz = split(receivedString, 'Rotluz'); String[] Rotshad = split(receivedString, 'Rotshad'); String[] swit = split(receivedString, 'swit');

int Rot = map(RotX, 0, 1023, 0, 0.07);

import ddf.minim.*; //Biblioteca de sonido import ddf.minim.effects.*; Minim minim; AudioPlayer theme, click;


PShape Apollo; PShape Venus; PShape Disco; PShape Pensador; PShape Titulo;

int fondo; //variable fondo blanco o negro


void setup() {

 size(800, 500, P3D);
 Puerto = new serial(this, Serial.list()[0], 9600);
 Puerto.clear()
 receivedString = Puerto.readStringUntil('\n')
 
 receivedString = null;
 
 
 Apollo = loadShape("Apollo.obj");
 Venus = loadShape("Venus.obj");
 Disco = loadShape("Disco.obj");
 Pensador = loadShape("Pensador.obj");
 Titulo = loadShape("Titulo.obj");

 minim = new Minim(this);
 theme = minim.loadFile("libmenu.mp3");
 theme.setGain(-15);
 click = minim.loadFile("oksel.mp3");
 click.setGain(-18);
 
 fondo = 0;

}

///////////////////////////////////////////////////////////////

}

void draw() {

 while(Puerto.available() <0 {
  receivedString = Puerto.readStringUntil('\n');
 }
 if(receivedString !=null){
 
 background(0x1);
 translate(width/2, height/2);
 
lights();

shape(Titulo); Titulo.rotateY(-.01); Titulo.setFill(color(103, 146, 209, 255));

textSize(20); fill(246, 236, 246); text("Interacción y Performatividad", -130, 134); fill(246, 236, 246); text("Escuela de Diseño y Arquitectura", -145, 159); textSize(27); fill(233, 233, 233); text("E", -26, 205); fill(255, 35, 35); text("[ad]", -7, 204); fill(0, 400, 153);


{

  if(key=='d')
 {
    background(swit);
     
   lights();
   textSize(19);
   fill(246, 278, 246);
   text("Apolo de Belvedere", -345, -99);
   textSize(13);
   fill(246, 278, 246);
   text("Leócares, 330-300 a.C.", -315, -61);
   textSize(9);
   String s = "Es descrito como el dios de las artes, del arco y la flecha, que amenazaba o protegía desde lo alto de los cielos, siendo identificado con la luz de la verdad. Era temido por los otros dioses y solamente su padre y su madre podían contenerlo. Es el dios de la muerte súbita, de las plagas y enfermedades, pero también el dios de la curación y de la protección contra las fuerzas malignas. Además, es el dios de la belleza, de la perfección, de la armonía, del equilibrio y de la razón, el iniciador de los jóvenes en el mundo de los adultos, estaba conectado a la naturaleza, a las hierbas y a los rebaños, y es protector de los pastores, marineros y arqueros.";
   fill(255);
   text(s, 164, -83, 183, 259);  // Caja de texto
   noLights();
   pointLight(19, 246, 243, mouseX/10, mouseY/10, 20);
   directionalLight(232, 122, 163, mouseX/10, -1, -mouseY/10);
   
   shape(Apollo);
  Apollo.rotateY(Rot);
  
 }
    

}

{

 if(key=='s')
 {
    background(swit);
   
    lights();
    textSize(17);
   fill(246, 278, 246);
   text("Venus de Milo", -302, -99);
   textSize(13);
   fill(246, 278, 246);
   text("Alejandro de Antioquía, 130 a.C.", -317, -61);
   textSize(9);
   String s = "La Afrodita de Milo (en griego, Αφροδίτη της Μήλου), más conocida como Venus de Milo, es una de las estatuas más representativas del período helenístico de la escultura griega, y una de las más famosas esculturas de la antigua Grecia. Fue creada en algún momento entre los años 130 a. C. y 100 a. C., y se cree que representa a Afrodita (denominada Venus en la mitología romana), diosa del amor y la belleza;2​ mide, aproximadamente, 211 cm de alto.";
   fill(255);
   text(s, 164, -83, 183, 259);  // Caja de texto
   noLights();
   pointLight(19, 246, 243, mouseX/10, mouseY/10, 20);
   directionalLight(232, 122, 163, mouseX/10, -1, -mouseY/10);
   
 
 shape(Venus);
 Venus.rotateY(Rot);


}

}

{

 if(key=='a')
 {
   background(swit);
     
   lights();
   textSize(19);
   fill(246, 278, 246);
   text("Discóbolo", -302, -99);
   textSize(13);
   fill(246, 278, 246);
   text("Mirón, 450 a.C.", -281, -61);
   textSize(9);
   String s = "Representa el cuerpo en el momento de su máxima tensión y esplendor; ese esfuerzo no se refleja sin embargo en el rostro de la estatua, que muestra solo una tenue concentración. La torsión del cuerpo es vigorosa, pero al mismo tiempo armoniosa y delicada. Todo el cuerpo está echado hacia delante, para producir con el balanceo posterior el impulso necesario para poder lanzar el disco.";
   fill(255);
   text(s, 164, -83, 183, 259);  // Caja de texto
   
   
   noLights();
   pointLight(19, 246, 243, mouseX/10, mouseY/10, 20);
   directionalLight(232, 122, 163, mouseX/10, -1, -mouseY/10);
   
 shape(Disco);
 Disco.rotateY(Rot);

 }

}

{  
 if(key=='w')
 {
   background(swit);
   
   lights();
   textSize(19);
   fill(246, 278, 246);
   text("El pensador", -320, -99);
   textSize(13);
   fill(246, 278, 246);
   text("Auguste Rodin, 1881-1882", -342, -61);
   textSize(9);
   String s = "-El pensador tiene una historia. En los días pasados, concebí la idea de La puerta del Infierno. Al frente de la puerta, sentado en una roca, Dante pensando en el plan de su poema. Detrás de él, Ugolino, Francesca, Paolo, todos los personajes de la Divina comedia. Este proyecto no se realizó. Delgado, ascético, Dante separado del conjunto no hubiera tenido sentido. Guiado por mi primera inspiración concebí otro pensador, un hombre desnudo, sentado sobre una roca, sus pies dibujados debajo de él, su puño contra su mentón, él soñando. El pensamiento fértil se elabora lentamente por sí mismo dentro de su cerebro. No es más un soñador, es un creador.";
   fill(255);
   text(s, 164, -83, 183, 259);  // Caja de texto
   
   noLights();
   pointLight(19, 246, 243, mouseX/10, mouseY/10, 20);
   directionalLight(232, 122, 163, mouseX/10, -1, -mouseY/10);
   
 shape(Pensador);
 Pensador.rotateY(Rot);

}

}
if( theme.isPlaying())
 {
 
 }
 else if(keyPressed == true) //si se ha pulsado una tecla vuelve a comenzar
 {
   theme.rewind();
   theme.play();
 }

} }

void keyPressed(){//solución a los sonidos que no se repetían

 if(key=='a') {
   click.play(); 
 click.rewind();
 theme.play();

}else{ }

if(key=='s') {
   click.play(); 
 click.rewind();
 theme.play();

}else{ }

if(key=='d') {
   click.play(); 
 click.rewind();
 theme.play();

}else{ }

if(key=='w') {
   click.play(); 
 click.rewind();
 theme.play();

}else{

 }
}

}

}}

Presentación del programa

Los modelos 3D presentados comprenden una composición entre 800 y 2000 polígonos que lo componen, pero se intentó con objetos de hasta 16000 polígonos. La edición de la síntesis de polígono se realizó en Blender.

(Esta presentación corresponde a una demostración interactiva desde Processing únicamente)

Construcción y preparación

Se pensó en un principio como un Joystick que realizaba funciones de rotación con giroscopio, pero se llevó al uso de potenciómetros.

Control iyp ayrton pereira 2020.jpeg Control iyp ayrton pereira 2020 despliegue.jpeg


Segunda opción pensada como interface, pensada como instalación en un contexto mas performático


Alcances del programa

Los alcances mediáticos del código pueden ser utilizados en

  1. Exposición de artistas 3D
  2. Exposición de objetos no presenciales(Diseño, Arquitectura)
  3. Proyectos educativos
  4. Historias interactivas

Mejoras evaluadas

  1. Implementar giroscopio
  2. Pulir interface
  3. Generar transiciones
  4. Implementar Ciclo for en la selección para disminuir cantidad de componentes
  5. Animaciones
  6. Transformar la carga de objetos en código de formas vertex para eliminar la librería y archivos .obj y dejar un programa más ligero

video