domingo, 23 de diciembre de 2012

Computación Gráfica. Processing


La Computación Gráfica es una rama de las Ciencias de la Computación con gran impacto social y acercamiento al público en general.

Usualmente, la graficación está asociada a la interactividad. Actualmente la mayoría de los sistemas o programas interactivos tienen una interface gráfica. Por otra parte, se observa una creciente popularidad de sistemas que traducen modelos abstractos a imágenes visuales (simulación ingenieril, datos obtenidos por
sensores por ejemplo).

La computación gráfica es la disciplina que estudia la representación pictórica sintética de un modelo real o imaginario basándose sólo en una representación numérica.

El procesamiento de imágenes se ocupa del problema inverso: el análisis de una escena a partir de una 
imagen y la reconstrucción del modelo numérico que lo describe.




Aplicaciones


Desde el punto de vista de una breve descripción representativa, se tienen:

• Interfaces: interface gráfica. El teclado se utiliza solamente para ingresar texto.
• Industria del entretenimiento: producción de video-juegos, películas y cortos de dibujos animados, posproducción y efectos especiales de películas y también la creación de utilitarios destinados a la creación de productos en estos rubros.
• Aplicaciones comerciales: elaboración de presentaciones comerciales.
• Diseño asistido (CAD).
• Aplicaciones científicas: desde la simulación hasta la visualización de fenómenos abstractos y su representación gráfica por medio de metáforas visuales asociadas.
• Cartografía y GIS: soporte de sistemas de información geográfica y aplicaciones relacionadas.


Dispositivos gráficos


Una clasificación referida al modo en que los gráficos son manejados por la computadora. Existen dispositivos de los siguientes tipos:

Dispositivos de vectores: reciben de la computadora la información geométrica de la localización y tamaño de las primitivas que soportan.
Dispositivos de raster (o pixels): reciben de la computadora la información de una serie de pixels, que se posicionan de forma continua.


Primitivas gráficas


Una “primitiva” es la unidad mínima de representación. Las primitivas básicas son el punto, el segmento de recta y la circunferencia o el círculo. En términos más amplios, se tiene: Punto, Línea, Polilínea, Polimarca, Polígono, Arco, Círculo, Texto gráfico.

• Puntos: se especifican a partir de su localización y color. Discretización directa.
• Segmentos de recta: se especifican a partir de un par de puntos que representan sus extremos.
• Circunferencias: se especifican por la posición de su centro y su radio.
• Polígonos: indispensables para representar entidades sólidas. Se representan a partir de una secuencia de puntos que determina la poligonal de su perímetro.
• Puntos: putpixel(x,y)
• Recta: line(x1,y1,x2,y2) (atributos: estilo, anchura,color).
• Polilínea: pline (nv,lv) siendo: nv (número de vértices) y lv (lista de vértices).
Atributos: estilo, anchura, color.
• Círculo: Circle(x,y,r).
• Arcos: arc(x1y1,x2y2,e), siendo e: excentricidad.



Formatos de almacenamiento


• Representación vectorial: las imágenes se representan como una serie de líneas o formas. La palabra vector se refiere no sólo a líneas, sino también a formas como cuadrados o círculos. Aplicaciones: dibujo lineal, CAD, etc.
• Representación bitmap: la imagen se descompone en puntos de una cuadrícula, el valor de cada uno de ellos se guarda individualmente. Es fácil de implementar y funciona, con limitaciones, con cualquier imagen. Aplicaciones: fotografías, cuadros e imágenes de video digitalizadas.


¿Qué es Processing?


Es un lenguaje de programación y entorno de desarrollo integrado de código abierto basado en Java, de fácil utilización, y que sirve como medio para la enseñanza y producción de proyectos multimedia e interactivos de diseño digital.

Fue iniciado por Ben Fry y Casey Reas a partir de reflexiones en el Aesthetics and Computation Group del MIT Media Lab dirigido por John Maeda.

Processing es desarrollado por artistas y diseñadores como una herramienta alternativa al software propietario. Puede ser utilizado tanto para aplicaciones locales así como aplicaciones para la web (Applets).

Se descarga desde el sitio: http://www.processing.org y es distribuido bajo la licencia GNU GPL. Su entorno se denomina Processing Development Enviroment (PDE).



Dibujando Primitivas con Processing


Una pantalla de computadora es una grilla de elementos llamados pixels. Cada 
pixel tiene una posición dentro de la grilla determinada por coordenadas. En 
Processing, la coordenada “x” es la distancia desde el borde izquierdo de la 
ventana de display y la coordenada “y” es la distancia desde el tope del borde. Las 
coordenadas del punto se definen como (x,y).



1-Dibujando una ventana: función size()

Dentro de la ventana de display se dibujan las imágenes con elementos de código 
llamados funciones. Estas son los bloques constructivos básicos en Processing. El 
comportamiento de una función es definido por sus parámetros, por ejemplo: un 
programa en Processing utiliza la función size() para definir el ancho y el alto de la 
ventana de display. Si no se la utilizan por defecto la dimensión del display es de 
100*100 pixels.




Por ejemplo, para dibujar una ventana de 400 pixels de ancho * 300 pixels de alto se utiliza la función size() con los parámetros siguientes: size(400,300).




2-Dibujando un punto: función point()


La función point() tiene dos parámetros que definen la posición: la coordenada “x” y la coordenada “y”. Por ejemplo, para dibujar un pequeño punto en el centro de una ventana:

size(480,120);
point(240,60);




3-Dibujando una línea: función line()

Para dibujar una línea entre las coordenadas (20,50) y (420,110), pruebe:


size(480,120); //dibuja una ventana de 480 * 120 pixeles
line(20,50,420,110); //dibuja la línea dentro de la ventana y entre los puntos indicados






4-Dibujando un rectángulo: función rect()


Tanto rectángulos como elipses se definen mediante cuatro parámetros: el primero y el segundo son para las coordenadas “x” e “ del punto de anclaje, el tercero para el ancho y el cuarto para la altura. Por ejemplo, para dibujar un rectángulo desde la coordenada (180,60) con un ancho de 220 pixels y una altura de 40 pixels:

size(480,120);
rect(180,60,220,40);






5-Dibujando una elipse: función ellipse()

Ahora las coordenadas “x” e “y” son el centro de la figura.


Sintaxis: ellipse(a,b,c,d)                                                                                    

Siendo:                                                                                  


a: coordenada “x”.
b: coordenada “y”.
c: ancho, default=80 pixels.
d: altura, default =80 pixels.



Ejemplo: ellipse(50,50,80,80);


Interpretación: se dibuja una elipse con el centro a 50 pixels del borde izquierdo y a 50 pixels desde la parte superior; con un ancho y alto de 80 pixels cada uno.


Si bien existe abundante bibliografía relacionada con Processing, y otras primitivas no indicadas aquí, es importante consultar en el sitio: www://processing.org









0 comentarios: