Tema 1 Introducción David Vallejo Fernández Curso 2007/2008 Escuela Superior de Informática
Índice de contenidos 1.Computer Graphics. 2.Principales aplicaciones. 3.APIs gráficas. 4.. 5.Resumen. 2
1 Computer Graphics 3
Computer Graphics Computer Graphics: término que describe cualquier uso de computadores para crear o manipular imágenes. Requisitos: HW específico. Formatos gráficos. APIs de programación. 4
Computer Graphics Principales áreas: Modelado: manejo de especificaciones matemáticas de formas (y sus propiedades) representables en computadores. Rendering: creación de imágenes a partir de las descripciones de modelos 3D. Animación: creación de una ilusión de movimiento a través de secuencias de imágenes (Modelado + rendering a lo largo del tiempo). 5
Computer Graphics Modelado 6
Computer Graphics Rendering 7
Computer Graphics Otras áreas... Interacción con el usuario. Realidad virtual. Procesamiento de imágenes. Escaneo 3D. 8
2 Principales aplicaciones 9
Principales aplicaciones Videojuegos. Dibujos animados. Efectos especiales. CAD. Simulación. Medicina. 10
Principales aplicaciones Animatrix (Hermanos Wachowski) -2003 Shenmue (Yu Suzuki) - 2000 Gollum (J. R. R. Tolkien) -1954 11
3 APIs gráficas 12
APIs gráficas API: interfaz software que proporciona un modelo sobre cómo un programa puede acceder a la funcionalidad del sistema. Ej: dibujar una imagen en una ventana. interface Agent { idempotent void setstate(estate state); idempotent EState getstate(); void inform(agent* proxy, ServiceDescriptionSeq services); ["ami"] void receivemessage(aclrepresentation encoding, Payload content); void destroy(); }; 13
APIs gráficas Dos temas clave al tratar con gráficos. Tratar con llamadas gráficas. Ej: dibujar un triángulo. glbegin(gl_polygon); glvertex2f(0.0, 0.0); glvertex2f(0.0, 3.0); glvertex2f(4.0, 3.0); glvertex2f(6.0, 1.5); glvertex2f(4.0, 0.0); glend(); Tratar con interacciones del usuario. Ej: presionar un botón. void glutkeyboardfunc( void (*func)(unsigned char key, int x, int y)); 14
APIs gráficas Retrollamadas (callbacks). Código que se pasa como argumento a otro código. Ej: contenido de una ventana a mostrar. void glutdisplayfunc(void (*func)(void)); void display (void) { // Dibujar. // Dibujar más. }... int main (int argc, char **argv) { // Inicialización. glutdisplayfunc(display); // Finalización. return 0; } 15
APIs gráficas Dos paradigmas predominantes. Java. Herramientas para gráficos e interfaces de usuarios integradas. Paquetes portables estandarizados y soportados como parte del lenguaje. java.lang.object extended byjava.awt.component extended byjava.awt.container extended byjavax.swing.jcomponent extended byjavax.swing.abstractbutton extended byjavax.swing.jbutton 16
APIs gráficos Dos paradigmas predominantes. Direct3D y OpenGL. Los comandos gráficos forman parte de una biblioteca software ligada a un lenguaje. El software de la interfaz de usuario es una entidad independiente que puede cambiar de un sistema a otro. La portabilidad puede suponer un problema. 17
4 18
El pipeline es el motor capaz de crear imágenes a partir de escenas 3D. Principal función: generar (renderizar) una imagen 2D a partir de... Cámara virtual. Objetos tridimensionales. Fuentes de luz. Modelos de luz. Texturas.... 19
Tres etapas conceptuales: Aplicación. Geometría. Rasterización. 20
Aplicación: Implementada en SW. Detección de colisiones, algoritmos de aceleración, animaciones... Geometría: Implementada en SW o HW. Trata con transformaciones, proyecciones... Qué ha de dibujarse? Cómo? Dónde? Rasterización: Dibujar (renderizar) la imagen final. 21
Ejecutada en la CPU. Implica que el programador tiene el control. Ejemplos. Detección de colisiones. Técnicas de aceleración. Animación. Tarea más importante. Enviar las primitivas de renderizado (puntos, líneas y triángulos) al hardware gráfico. 22
Detección de colisiones. Generación de una respuesta a los objetos. Posible dispositivo de retroalimentación. Gestión de otros dispositivos. Ante una colisión entre dos objetos... Teclado, ratón, casco de realidad virtual... Otros procesos... Animación de texturas. Algoritmos de aceleración. 23
Responsable de la mayoría de operaciones a nivel de polígono o de vértice. División funcional. Puede o no haber equivalencia con etapas de un pipeline (implementación). Etapa de alto cómputo. En torno a 100 operaciones PF por vértice. 24
Qué ocurre en esta etapa? Movimiento de objetos. Movimiento de cámara. Calculo de la luz en los vértices de un triángulo. Proyecciones en la pantalla (3D a 2D). Clipping. Traslación a la pantalla. 25
Objetivo: asignar los colores correctos a los píxeles para renderizar una escena correctamente. Toma la salida de la etapa de geometría. Añade texturas y otras operaciones por píxel. 26
En resumen... El programador envía primitivas a renderizar a través del pipeline (uso de APIs). La etapa de geometría lleva a cabo las operaciones a nivel de vértice. La etapa de rasterización lleva a cabo las operaciones a nivel de píxel. 27
Originalmente, un modelo reside en su propio espacio. Cada modelo tiene asociado una transformación (matriz 4x4). Distintas transformaciones (localización, orientación, tamaño...) con el mismo modelo. Coordenadas del modelo --> Espacio global de 28 coordenadas.
Para facilitar la proyección y el clipping, la cámara y los modelos se transforman con la transformación de vista (matriz 4x4). z x 29
Color (o textura) asociada a cada vértice. Calculado en función de... Localización y propiedades de las fuentes de luz. Posición y vector normal del vértice. Propiedades del material perteneciente al vértice. 30
Simular el comportamiento real de la luz. Técnicas de interpolación (Gouraud shading). Más efectos de luz (pixel shading). 31
Dos métodos: Ortogonal (poco usado). Perspectiva (más común). 32
Perspectiva... A mayor distancia, menor tamaño. Simula cómo percibimos el tamaño de los objetos. Uso de matrices 4x4 (de nuevo). Modelos en un espacio de coordenadas normalizado. 33
Recorta las primitivas en relación al cubo obtenido de la proyección. 34
Las coordenadas x e y de cada primitiva se transforman en coordenadas de pantalla. Operación de escalado. Dichas coordenadas, más la z, pasan a la etapa de rasterización. 35
36
Objetivo: asignar los colores correctos a los píxeles para renderizar una escena correctamente. Scan conversion. Texturizado. Interpolación sobre un triángulo. Z-buffering. Double buffering.... 37
Scan conversion. Vértices de los triángulos como entrada de la etapa de geometría. Conversión de vértices bidimensionales en píxeles. Operación a nivel de píxel sobre dichos píxeles: Interpolación. Texturizado. Z-buffering.... 38
Texturizado. Pegar imágenes sobre objetos geométricos. Usos y otras aplicaciones. Más realismo. Bump mapping. Store lighting.... 39
Interpolación. De colores sobre el triángulo. Interpolación Gouraud. 40
Z-buffering. El HW gráfico sólo pinta triángulos. Sin embargo, un triángulo cubierto por otro más cercano no debería ser visible. Renderizado en orden? 41
Z-buffering. Soluciona el problema del orden. Almacena la coordenada z (profundidad) de cada píxel (depth buffer). Cuando se trata con un triángulo, se calcula la coordenada z de cada píxel del triángulo. Comparación de z con el valor z del Z-buffer. Si z es menor que el z del Z-buffer... Si no... Actualizar el valor del Z-buffer y del color buffer. No hacer nada. Se puede renderizar en casi cualquier orden. 42
Double buffering. El monitor muestra una imagen en un momento. Efecto pop up (siguiente imagen a mostrar). Dos buffers: Front buffer (el mostrado). Back buffer (el renderizado). Swap entre buffers. 43
Aplicación: Implementada en SW. Detección de colisiones, algoritmos de aceleración, animaciones... Geometría: Implementada en SW o HW. Trata con transformaciones, proyecciones... Qué ha de dibujarse? Cómo? Dónde? Rasterización: Dibujar (renderizar) la imagen final. 44
5 Resumen 45
Resumen Importancia de la informática gráfica. APIs gráficas. Gran cantidad de aplicaciones. Dos paradigmas.. Núcleo del rendering en tiempo real. 46
Resumen Referencias. Fundamentals of Computer Graphics (2nd Ed). Real-Time Rendering (2nd Ed). Capítulo 1. Introduction. Capítulo 2. The graphics rendering pipeline. Transparencias Tomas Akenine-Moller. http://www.realtimerendering.com. 47