MoMA: Proyectos interesantes

MoMA: Interesantes proyectos presentados on Prezi

Propuesta de Video

Esta es la propuesta de video. El tema principal es el videojuego y su evolución a través de utilizar el pixel como forma de expresión. El video se realizó a través de elementos del escritorio de Windows como medio visual.

Propuesta de Arte Digital

Mi propuesta tiene que ver con una página web, donde el usuario coloca una palabra (o escoge una) y a través de una base de conocimiento selecciona textos e imágenes que tienen mayor o menor incidencia, los publica en forma de ascii art, que cada cierto tiempo va cambiando.

En el fondo tendríamos un buscador de rss que obtendría los resultados desde el Internet, y las imágenes vendrían cargadas una vez que se ejecute el script. Las imágenes que se forman se presentan por color (ya no por el tipo de caracter) y en tiempo real va cambiando de acuerdo a la imagen que se carga.

Además se permite al usuario seleccionar otra palabra clave del texto presentado, haciendo cada vez más interesante la interacción.

Madness

Propuesta ASCII Art en Processing pt3

Listo! Ya tenemos el primer acercamiento con el video y el ASCII Art. Para este programa se necesitan las librerías GStreamer (debido a que el desarrollo fue en Linux), pero bien se puede llevar en Windows o Mac utilizando las librerías QuickTime (de hecho con esto sería mucho mas fácil, pues las librerías vienen con Processing).

Pensaba si tal vez se pueda colocar algo muy interesante con sonido, o efectos 3d (por ejemplo que la imagen rote desde el centro según el movimiento del ratón, si fuera así, tendríamos que generar un arreglo de objetos tipo caracter, para dibujarlos en una posición Z).

Si me dan alguna sugerencia o idea se podría hacer algo aún más interesante.

Como no se si es posible hacer subidas en Blogger, voy a dejar escrito el código a continuación.

----------------------------------------------------------------------------------------------------------------------

import processing.opengl.*;
import codeanticode.gsvideo.*;

// Constantes
int altoAscii = 24; //Tamaño de la letra
// Variables
int cols, rows; //Filas y columnas de la imagen
float cellw, cellh; //Ancho y alto de cada celda del dibujo
PFont font; //Letra de gráfico
GSCapture video; //Captura del video
String ordenCaracteres = "@%#*+=-:."; // Los caracteres en pantalla
//String ordenCaracteres = ".:-=+*#%@"; // Los caracteres en pantalla (orden invertido en el caso de que se quiera en fondo negro)
char[] caracteres; // El arreglo de caracteres

void setup() {
  //size(screen.width, screen.height, P3D);
  size(800, 600, P2D);
  colorMode(HSB);

  // Inicializa el video
  video = new GSCapture(this, 160, 120);
  video.start(); 

  //cargar tipografía
  font = loadFont("Ubuntu-48.vlw");

  // for the 256 levels of brightness, distribute the letters across
  // the an array of 256 elements to use for the lookup
  caracteres = new char[256];
  for (int i = 0; i < 256; i++) {
    int indice = int(map(i, 0, 256, 0, ordenCaracteres.length()));
    caracteres[i] = ordenCaracteres.charAt(indice);
  }
}

void draw() {
  background(255);
 
  textFont(font, altoAscii);

  cols = int(this.width/(altoAscii));
  rows = int(cols*video.height/video.width);
 
  cellw = video.width/float(cols);
  cellh = video.height/float(rows);

  for(int i=0; i<cols; i++) {
    for(int j=0; j<rows; j++) {
     
      float x = i*cellw;
      float y = j*cellh;

      int k = int(x+(cellw*0.5)) + int(y+(cellh*0.5)) * video.width;
         
      int rojo = int(red(video.pixels[k]));
      int verde = int(green(video.pixels[k]));
      int azul = int(blue(video.pixels[k]));

      int gris = max(rojo,verde,azul);

      fill(0);
      text(caracteres[gris], map(x,0,video.width,0,this.width), map(y,0,video.height,0,this.height));
    }
  }
}

// Necesario para que el video funcione
public void captureEvent(GSCapture c) {
  c.read();
}

void keyPressed(){
  switch(keyCode){
    case 38:
      altoAscii++;
      if(altoAscii>40)altoAscii=40;
      break;
    case 40:
      altoAscii--;
      if(altoAscii<2)altoAscii=2;
      break;
  }
}

----------------------------------------------------------------------------------------------------------------------

Animación de Ilustres

Propuesta de ASCII Art en Processing PT 2

El primer acercamiento que se tuvo se ve bastante bien, pero es necesario mejorar la cantidad de caracteres. Aquí el código.

PImage img;
int cols, rows;
int altoAscii = 10;
float cellw, cellh;
PFont font;

void setup() {
  size(444,599);
  img = loadImage("CuencaCollage_by_Ultraforce777.png");

  //cargar tipografía
  font = loadFont("Ubuntu-48.vlw");
}

void draw() {
  cellw = int(altoAscii/2);
  cellh = int(altoAscii);
  cols = int(img.width/cellw);
  rows = int(img.height/cellh);
 
  for(int i=0; i<cols; i++) {
    for(int j=0; j<rows; j++) {
      float x = i*cellw;
      float y = j*cellh;
     
      int k = int(x)+int(y)*img.width;
     
      int rojo = int(red(img.pixels[k]));
      int verde = int(green(img.pixels[k]));
      int azul = int(blue(img.pixels[k]));
      int gris = int((rojo+verde+azul)/3);
     
      String caracter = "";

      if(gris>0&&gris<=25){caracter = "#";}
      if(gris>25&&gris<=50){caracter = "@";}
      if(gris>50&&gris<=100){caracter = "&";}
      if(gris>100&&gris<=150){caracter = "i";}
      if(gris>150&&gris<=200){caracter = "*";}
      if(gris>200&&gris<=250){caracter = "+";}
      if(gris>250&&gris<=255){caracter = ".";}

      fill(0);
      textFont(font, altoAscii);
      textAlign(LEFT);
      text(caracter, i*altoAscii*0.5, j*altoAscii);
    }
  }
}

Collage

Otra imagen ASCII

IIIIIIIIIIII????????????????????????????????????IIIIIIIIIIIIIIIIIIIIIIIIIIIIIIII III?????????????????????????????????????????????????????I?IIIIIIIIIIIIIIIIIIIIII I??????????????????????????????????????????????????????????????III??I?IIIIIIIIII ??????????????????????????????????????????????????????????????????????????IIIIII ????????????????+++++++++++++??????????????????????????????????????????????????? ????+?+?++++++++++++++++++++++++++++++?????????????????????????????????????????? ?+++++++++++++++++++++++++++++++++++++++++++???????????????????????????????????? +++++++++++++++++++~+++++++++++++++++++++++++++++++?++???+?????????????????????? +++++++++++=++==+==,==++++==+=++++++++++++++++++++++++++++++++???+?????????????? ++=================.===========+==+++++++++++++++++++++++++++++=?++++??????????? =============I?+=====================++++++++++++++++++++++++++,+++++++++++++??? ======~=====ZI++==~==~~~~==================+===+++=+=++++++OIOII?=+++++++++++++? ~~~=~~~==~~87D7IDI+==~~~~~~~~~~~~=~~~===================8DNOZ$?7I??+++++++++++++ ~~~~~~~~~~~N$++=====~+:~:??:~:7+IZ~~~~~=====~===========O88O7Z?II+++++++++++++++ ~~~~:::~::~Z++===+:=~+?I+??+N?I+?7~~~~~~~~~~~~==~~=~====+OO8D8$ONN++=======+==++ :::::~:,...8I=~~~+:=~=+?=+7?II77+I,,,,::~~~~~~~~+~7=O+==ODD887?I?+===========+++ :::,,.,,...Z?+=+====:+=?+=I7II$?+I::~~~~~~::::::?I?I7I==+DDD8D??I++============= ::::,,,,...O+=~==+~~::::~=Z8Z+=7II,~::::,,:::~~=ZDDNN8O=8DND8O$II?============== ::,,,,.....Z+=~====~~~~O8~=?++I?I??II~II7~?II$7DNNNNDDONDND$7ZZ?7?+====~=~~~~~=~ :,,.,,,.,..O==~===7=7Z87O8+=++?+=+???II=~=~+?ONNNNNMMDOOD8Z8O$8O?=+=~~~~~~~~~~~~ ,,,:,,.,,,,$==+++O:=OZD$OD+?+++=I==++I?I$$II7OODNDNNNZON8$O8O8DI??++~~~~~~~:~~~~ ,,:,,,,,,,87++++?=:+8NNNN887ODZ?+7=Z,~~:~::?O7ZODZZNNDZDN8DD8O8I$???:::::~~~~~~: ,,,,,:=$I:87+++++===8NNNM8ODOO?+?7IZ:~=:=:77Z$7Z8?ID$OOZMN8NOZIII+++:::::::~?++= ?7?$O7?Z8,8I+++===?=88O8ND8DN$OOOZOZ===~~~7$$$7O87OZ8OODNNNND8$II?++:,:::,=:=+I? 7OD8$7$Z$7ZO++I=?=?+OOOO8888OOI88Z8DII~==~=I7IZO8IO=7Z$8NZMOD8OZ??+=?,,~$Z7Z$OOO ?=ID8$78O8N7?=+=?=~?OO$$Z8888OZ$$ZZZ,I=7I?ZZ+I$Z8$?D=$7NNMDOO88ZZ$+?I:888OZ88$7O ZZZZ$ZO$$Z$7====+.?DO8$7?7ZOZOOZ$8Z7.=$,.7++OOZ8O$=?7OZZZDZMO8O8$O$$8OD888DOO888 888OOOOZZ$ZZIIZZZ$ZODZDD77IZDZZDOOOZ.7=.+7,IDD78O~$77?8DN8ND8OODOZZZ8DDOO8D88DDN DDD8D8O88OOOZ$Z88O8O7Z$DZOZDDZOMO$77$OZ7=+8DDNDDD7I+~~INNNNN8NZDDDDNND88O8OD8NMM DDD8O8888ZOOOOZO$$ODD88OD78ZNDZZDZOZZ$$I+$NN8ZIOD88DINDNNMNNMNMODNDN8O8NNNNDDNMD D8DD88ODZOOO88O8OZOZOD8NND8ND$IZ7N7O$I7MM78DON$88DNNMNDMMMNNMN8NDNNNNDMNMMMMMDDD 8DDODD8888OO8O8D8$O8O$ZNDOOOOO7=7NNOZ7+NM88ND8NMMNMMMMND$MNNMMNDNNDD8D8O88DD8OD8 D88O8NDDD88OOZD88NOO7ZOZDI$8D8OOOOZZ77?DNNNDDNMNDDMNMMNMMNNNMMNMNNMNNNDDDDN8N8NN 88888D88DO8888OD888MNZOZO$+?+++++?++++??????????????I77$MD$ODDDDDDDDDNNNMMNMNDDD DO88888DD8OO8DMNDDNNDZOOZZZ?++++++++++++?+++????+???+???M87N???7$ONDNNNNNMMM$8O8 D888D888O8D88MMMMDDNDZ8DOOO++++++=++++???+??+??+?+????IINO78II??II7$$$ZZZ$ZZZOZZ ZZZOZ$ZOZZZDZDNOZDDDOZZ7I?+++=+====+===+==++?++++??IZZ8Z$ZZZZZOZZZOOOZOOOOOOOOOO ZZZZZZZZZZ$ZZZ$$Z$?7+==+??++++++=++=?+++++++++++++++?I$8ZZZOZZZZZ$ZZOZZOOZ8O88OO                                                                  GlassGiant.com

Un ASCII generado

.============================================================================:.  .============================================================================:.  .===============================++=+===+=====================================:.  .============================I?$OI?+++I?77I+=================================~.   ===========================I87I7OZ$7$ZODO888I7+=============================~.   =========================+D$D8DDDDNNNNNNNDDNNDZ?+===========================~.  .=========================+DNNDNNNNNNNNNNNNNNNNDDND==========================~.   ========================?NNNNNNNNNNNNNNNNNNNDDNNNDND$=======================~.  .====================+$NNNNNNNN8NNNNNNNNNNNNNNDNNNNNNND======================~.  .===================IDNNNNNNNDNND8OOO8ODNNNNNNNNNNDNNDNNO====================~.  .==================+DNNNNNNND8Z7I???++??I$ZO8OODNNDNNDNNNO===================~.  .==================8NNNNNN8O7???+++=~======+++++?ODDNDNND7+==================~.  .=================+NNNNNNZI?++=~~~~~~=~~:::~~~~=~+7DNDDNDD===================~.  .=================ZNNNND87?++===~~::::::::::::~~~~+ZNDNDDD8==================~.  .=================8NNNNDZI?+====~~~:~:~~:::::~~~~~~?DDDNDND==================~.  .==+++============8NNNNNZI?+++=~::::::~::::::::::~~=D8DDDDD?=================~.  .+++++++==++=+====DNNNNDII??==~::::,,::,,,,,,,:~~~~=8DNNDDDI=================~.  .+++++++++++++====+NNNNZII?OOOD8Z++:,,,,,,:??77I7~=~IDDNNDDI=================~.  .+++++++++++++++==+NNNNIIDOZ7??I7$7I=:::+?7I?++$$$O+=ZNNDND+==================.  .++++++++++++++++==NNN$?77??$7+??777+~::=??I?+++=~=I~~8NNDD+==================.  .++++++++++++++++++ONNI?$IIZDI7I.??7?~:~++I,D$OII=~=~~=NNNO===+==+++====+=====.  .+++++++++++++++++=?DNI+?II$I~Z~+I+I?~:=?=?++I~+?=~:::~DDNI===+======++==+====.  .+++++++++++++++++$7ON?++??II?+??=I7+~:~=~~=+===~~::::~DZ~=+=+=+++++++==+=====.  .+++++++++++++++++II+NI+=~~~~~~~=+??+~::~~:::,,,,,,,::~D~,=?==++++++++++======.   +++++++++++++++++II+DI?+=::,:~~~=?I?~:~~~:,,:,,,,,,::~D+:=I=++++=+=++=++=====.  .+++++++++++++++++=I?8I?+=~:::~==+?I?~:~=~:,,:,,,,::::~8++=:+++++==+++========.  .++++++++++++++++++=?$Z?+=~::~~~=+?+=,.:~~:,,,,,,,,::~+I?=~=+=++++++++========.  .+++++++++++++++++++?+OI?+=~~:~~=?IO?~~I8~~:,,,,,:,::=7=:~===++====++=+=======.  .+++++++++++++++++++=?O7?+==~~==+?7Z7=:~+==~:,,,,::~~+$~::==+=====+++=========.  .++++++++++++++++++++?7OI?++=~+?7ZODZI$?8ZZ$?:,,,::~~?O+~=+==+===++===========.   ++?++++++++++++++++++=DI???==DDD7+~~,::~:~?DD:,:::~=7Z==+===+=+++++++========.  .++++++++++++++++++++++?7I??I+8Z7OZI=I??=+???OI:~::==7=+=+====+++++++++=======.  .++++++++++++++++++++++=8Z7I$7Z==?+=???+~~:::$7==+=?OI=+=+==+=++++++==========.  .+++++++++++++++++++++++?DDZ$OI=====ONOZ+::::+$7?IZOZ==+==++=++++++++==+======.   +++++?+?+?+++++++++=++==+NDDOI===~~=?=::,:~+I$$OOD7+O=+==+=++=+++++++=+======.   +???+?++++++++++++++++++++DNDZ777$I7=+~+I?7?7O888?+=O=+=+++=++++++++=+++=====.  .+++???+++?++++++++++++++ZN7$NND8DDOZOIZO$$OODNNO++=?D=+=+==+++++=++++=++=====.  .+?????++?+++++++++++++++NN$77DDNNNNNDNNNNNNDD$?~===OD.N=+++++++++++++++=+====.  .+?????++?+++++++++++++?=NN$III78NNNDDNNNDN8Z?===~~+N8I$D8+=+=+++++==++=======   .+??????+?+++++++++?DNNN?DNOIII777D$O88ODO7=+=~+~=+8D,8,DDDDD88++++++====+=++=.  .+??????+?+++++$DDDNNNNN~OND$???????+++=~~~=====~?OI=8:NDDDDNDDDD8$+++++===+=+   .+??????????DNNNNNNNNNNN?OONOI++=++++==~~:~:~~~=I88?Z=DNDDDDNDNDDDDDD8+=++=+==.  .+??????8NNDNNNNNNNNNNNND88DD$+=~~===~::::~~:~?$D7:?$DDDDDDDNDDDDDNDDDDD8+=+++.  .???7DNDNNNNNNNNNNNNNNNNNOND8O?=~:~~~~::::~~+I7DD~~NNDDDDNDNNDNDNNNNDDDNDDDO+=.  .DDNNNNDNNNNNNNNNNNNNNNNNNNNN$I+~::::~~~::~+I7ZDI,NDNDDNDDDDDDNDDDNDNDDNDDDND8.  .DNNNNNNNNNNNNNNNNNNNNNNNN8?NDI+=~:,:::::~~?IN:Z,NNDNDDDDNDDDDDDNDDNNNNNNNDNDD    DDNNNNNNNNNNNNNNNNNNNNNNNNN~7,=~:,,,:::~=+?~D8.DDNDNNNNDDDDDNNNDDNNNNNNNNDNDD    DNNNNNNNNNNNNNNNNNNNNNNNNNI78D+::,,,,:~~=+?ZDNDNNNNNDNNDDDDDNNDNNNNNNNNNNDDDD    DNNNNNNNNNNNNNNNNNNNNNNNNNN8DNZ:,,,,,:~OZDDINNNNNDDNDNNDDDNNDNNDDNNNNNNNNDDDD   .DNNNNNNNNNNNNNNNNNNNNNNNNNNND8NDD,,,~=8ON7NDNNDNDDDDDDDDDDDNNNNNDNNNNNNNNNDDD.  .DDNNNNNNNNNNNNNNNNNNNNNNNNNNN,D8N8I:=$:DDNNNDDNNNDDDDDDDDDDNNNNNNNNNNNDNNNNDD.   DNNNNNNNNNNNNNNNNNNNNNNNNNNNNNND8.,?7NNNNNNDNNNNNDDNDDNDDDDDNNNDNNNNDNNNNNNDD.   DNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNDNNDNNNNNNNNNNNNNNDDNNNNDNDDNNNNNNNNNNNNNNNNND.  .DDNNNNNNNNNNNNNNNNNNNNNNNNNNNNNDDNNNDNDNDNNNNNNDNDNNDDNDNDDNDNNNNNNNNNNNNDNDD    DNNNNNDNNNNNNNNNNNNNNNNNNNNDDNNNNNDNNNNNNNNNNNNNNDNNDNNDNDDDNNNDDNNNNNNNNNNDD.   DDNNNNNNNNNNNNNNNNNNNNNNNDNNNNNNNNNDNNNNNNNNNNNNNDDNDNNDNDDNNNDDNNNNDDNNNNNNN.   DNNNNNNNNNNNNNNNNNNNNNNNNNNNDNDDNNNNNNNNNNNNNNNNNDNNDNNNNDDDNNNNNNNNNNNNNNNND   .DNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNDNNNNNDNNNNNNNNDNNNNNNNNNNND   .DNNNNNNNNNNNNNNNDNNNNNNNNDNNNNNNNNNNNNNNNNNNNNNDNDNNNNNNNDDNNNDNNNNNNNNNNNNDN   .DNNNNNDNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNDNDNNNNNNNNNNNDNDNNNNNNNNND.  .DNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNDDNDNNNNNNNNDNNNNNNNNNNND.  .DNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNDNNDNDNNNNNNNNNNNNNNNNNNN.  .DNNNNNNDNNNNNNNNNNNNNNNNNNDNDNNNNNNNDNNNNNNNNNNNNNNNNNNDNDNNNNNNNNNNNNNNNNNND.   DNNNNNNNNNNNNNNNNNNNNNNDNNNNNNNNNNNNNNNNNNNDNNNNNDNNDNNNNDNNNNDNNNNNNNNDNNNNN.  .DNNNNNNNNNNNNNNNNNNNNNNNNNNNDNNNNNNNNNNNNNNNNNNNNNNNNNNNNNDNNDDDNNNNNNNNNNNDN.  .DNNNNNNNNNNNNNNNNNDDDNNNNNNNDNNNNNNNNNNNNNNNNNNNNDNNDNNDDDDDDNNDNNNNNNNNNNNNN.   DNNNNNNNNNNNNNNNDNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNDDNDDDNNNNNNNNNNNNNNNNNDN.   DNNNNNNNNNNNNNNDNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNDDDDNDDNNNNNNNNNNNNNNNNND   .DNNNNNNNNNNNNDDDNNNNNNNNNNNNDNNDNNNNNNNNNNONNNNNNDNNDNNDDDNDDDDDNNNNNNNNNNNND.   DNNNNNNNNNDNDDNNNNNNNNNDNNNNNNNDNNNNNNNNNNNNNNNNNNNNNNNNNDNNDNNNNNNNNNNNNNNND.   DNNNNNNNNNDNNDNNNNNNNNNNNNNNDNDDNNNNNNNNNNNDNNNNNNNNDNNDNDDNNNNNNNNNNNNNNNNND    DNNNNDNDNNNDNNNNNNNNNNNNNNNNNNNDNNNNNNNNNNNNNNNNNDNNDNNNDDNNNNDNNNNNNNNNNNNND.  .????++++++++++++++++====++++++++????????????+???++++++++++++++===============.                                                                                                                                                    GlassGiant.com

Una propuesta de ASCII Art en Processing

En el uso de los caracteres ASCII como recurso de graficación, se podría crear un algoritmo (de hecho ya existe, habría que investigar) que permita generar a partir de una imagen, un diseño, basado en el hecho de que un caracter que genera más oscuridad representaría sombra (por ejemplo, @), mientras que un caracter que represente luz, se le colocaría un símbolo poco notorio (por ejemplo, +).

Me parecería interesante una propuesta en la que a través de la captura de video de la pantalla se genere una imágen basada en ASCII que represente la captura del video.

Buscando en la red encontré esta página que contiene un algoritmo básico para generar un caracter a partir de los grises encontrados en el sector a transformar:

http://www.c-sharpcorner.com/uploadfile/dheenu27/imagetoasciiconverter03022007164455pm/imagetoasciiconverter.aspx

La propuesta indica que primero es necesario transformar los colores en grises, para lograr esto se coloca lo siguiente (escrito en C#, pero se entiende bastante bien):

int red = (pixelColor.R + pixelColor.G + pixelColor.B) / 3;
int green = (pixelColor.R + pixelColor.G + pixelColor.B) / 3;
int blue = (pixelColor.R + pixelColor.G + pixelColor.B) / 3;
Color grayColor = Color.FromArgb(red,green,blue);

Bien. La idea básica vendría a ser el obtener el color de cada región que ocuparía un caracter en la imágen, trasladarla a un vector, y por cada valor del vector (trasladado a gris a través del proceso anterior) se genera un promedio de grises.

Este promedio de grises se almacena en un vector, donde se traslada el valor en gris por un valor en ascii, basado en el concepto anterior.

Hello World!

Hello World!