Rendering basado en imágenes

Transcripción

1 Rendering basado en imágenes. Cap. 10 del RT3 Computación Gráfica Avanzada Ingeniería en Computación Facultad de Ingeniería Universidad de la República Matias Nassi

2 Motivación Modelar las superficies con polígonos es la forma más común de representar objetos en una escena Pero tiene algunas desventajas Generalmente muy costoso computacionalmente Costo proporcional a la cantidad de vértices del modelo Algunos objetos y fenómenos como fuego, nubes, lens flare, pelaje y muchos otros son difíciles de representar 2

3 Motivación Surgen entonces otros paradigmas, como el llamado Image-Based Rendering (IBR) Se utilizan imágenes para representar objetos Ventajas Costo proporcional a la cantidad de pixeles a renderizar Permite representar múltiples objetos y fenómenos complejos que de otra forma son difíciles de representar 3

4 Motivación Generalmente al renderizar una escena se combinan diferentes paradigmas de rendering según el objeto a representar En una escena tendremos Objetos representados por polígonos Objetos representados por imágenes Y más Se busca el equilibrio entre eficiencia/calidad 4

5 Motivación Generalmente al renderizar una escena se combinan diferentes paradigmas de rendering según el objeto a representar Esto mejora la eficiencia En una escena tendremos Objetos representados por polígonos Objetos representados por imagenes Y más IBR: nubes, árboles, cielo, montañas, etc. GBR: personajes, rocas, terreno, etc. 5

6 Agenda Introducción Técnicas más comunes Skyboxes Sprites & Layers Billboards Sistemas de partículas Lens Flare & Bloom Motion Blur 6

7 Introducción 7

8 Introducción El objetivo del rendering es representar objetos en una pantalla No hay una única forma correcta de rendering Cada método de rendering intenta aproximar la realidad de la mejor forma Al menos si el objetivo es simular fotorrealismo Polígonos permiten representar objetos 3D de forma razonable desde cualquier punto de vista Si la cámara se mueve, el objeto no tiene por qué cambiar Aunque muchas veces se utilizan técnicas de optimización para mejorar la calidad y/o eficiencia (LOD) 8

9 Introducción En este punto entran en juego otras técnicas de renderización más eficientes como el IBR Sustituyen polígonos por imágenes Esto es menos costoso, ya que una imágen es procesada más rápidamente por el pipeline gráfico 9

10 Skybox 10

11 Skybox Método para crear entornos que permitan simular que la escena es más amplia de lo que en realidad es Consiste en englobar la escena en un cubo (skybox), y proyectar ciertos objetos en cada una de sus 6 caras mediante cube mapping Cielo Montañas lejanas Edificios lejanos Nubes inmóviles lejanas Y otros objetos inalcanzables 11

12 Skybox La malla sobre la cual se mapea el entorno puede tener otra geometría Si es esférica o semiesférica se le denomina skydome Environment map para un skydome El environment map a mapear puede ser cualquier tipo de textura Fotografía Imagen dibujada a mano Geometría tridimensional ya renderizada 12

13 Skybox El skybox debe Estar centrado en el observador Permanecer estacionario con respecto al observador Por qué? Parallax effect Parallax: diferencia en la posición aparente de un objeto al ser visto desde dos líneas de visión distintas Este efecto es muy notorio para objetos cercanos, ayudándonos a percibir profundidades relativas cuando nos movemos Para objetos lejanos prácticamente no percibimos el parallax effect a medida que nos movemos 13

14 Skybox Por qué? Lo anterior hace que casi no notemos la diferencia en una montaña si la observamos luego de habernos movido unos pocos metros Incluso luego de miles de metros Entonces? Como la skybox se mueve junto con el observador, por el parallax effect aparentará estar muy lejos, creando la ilusión de un entorno tridimensional distante 14

15 Skybox Para que un skybox luzca bien, el enviroment map debe tener buena resolución (1 texel -> 1 pixel) La fórmula aprox. para la resolución necesaria es Esta ecuación se deriva del hecho que la textura de una cara del cube map debe cubrir un FOV de 90º 15

16 Skybox Uncharted 2 16

17 Skybox The Elder Scroll IV: Oblivion 17

18 Skybox RAGE 18

19 Skybox Prince of Persia 19

20 Sprites & Layers 20

21 Sprites & Layers Una de las primitivas más simples y más utilizadas del IBR es el sprite Sprite: una imagen que se mueve sobre la pantalla Se suelen incorporar en escenas tridimensionales complejas sin notar su bidimensionalidad Generalmente no se ven como figuras regulares El alpha channel de la imagen permite renderizar algunos pixeles parcial o completamente transparentes Alpha blending: OFF Alpha blending: ON 21

22 Sprites & Layers Series de sprites para representar un objeto permiten simular animaciones Se dibujan los sprites en secuencia Frame 1 Frame 2 Frame 3 Frame 4 Frame 5 La ilusión puede ser débil para objetos grandes en la pantalla, debido al switcheo entre un sprite y otro 22

23 Sprites & Layers Red Alert II 23

24 Sprites & Layers Una forma de ver una escena es como una serie de layers, como se suele hacer en la animación 2D - Puerta del remolque delante de gallina - Gallina delante de cabina - Cabina delante de ruta y arboles 24

25 Sprites & Layers Cada capa tiene una profundidad asociada Renderizando las capas de forma back-to-front podemos construir la escena sin necesidad de un Z-Buffer Más rápido Menor consumo de recursos Esta misma organización de las capas y sprites se mantiene para muchos puntos de vista diferentes Pero si el punto de vista cambia demasiado Los sprites ya no serán válidos La apariencia de los objetos debe cambiar Se deben regenerar los sprites Determinar cuándo realizar esta regeneración es uno de los mayores retos del IBR 25

26 Billboarding Aspectos generales Tipos Screen-aligned billboard World-oriented billboard Axial billboard 26

27 Billboarding Aspectos generales Tipos Screen-aligned billboard World-oriented billboard Axial billboard 27

28 Billboarding Aspectos generales Billboarding: orientar un polígono texturado (sprite) en base a la dirección de observación Billboard: el polígono cuya orientación varía En combinación con alpha texturing y animación permite representar una gran cantidad de fenómenos complejos Vegetación (arboles, pasto, etc) Humo Fuego Niebla Explosiones Nubes Y muchos más 28

29 Billboarding Aspectos generales Para poder orientar el polígono necesitamos 1. Normal a la superficie o Look vector (n) 2. Up vector (u) Los elementos anteriores son suficientes para definir un sistema de coordenadas ortogonal para la superficie Definen la matriz de rotación necesaria para rotar el polígono a su posición final Adicionalmente, se define un punto de referencia del cuadrilátero (anchor point) que permitirá establecer su posición en el espacio Muchas veces, la normal n y el vector u no son perpendiculares Pero no deberían ser paralelos 29

30 Billboarding Aspectos generales Cómo calcular la matriz de rotación? 1. Uno de los vectores n o u debe establecerse como fijo en todo momento (generalmente n) 2. Crear un right vector r ortogonal a n y u r = n x u 3. Normalizar r, ya que será utilizada como un eje del sistema r = r/ r 4. Modificar el vector a ajustar (aquel que no es fijo, sea n o u) por uno ortogonal al vector fijo y r, para obtener un nuevo vector n o u u = n x r 5. Normalizar n o u según corresponda u = u / u 6. Crear la matriz de rotación compuesta por los 3 vectores obtenidos M = (r,u,n) 30

31 Billboarding Aspectos generales La matriz ortogonal resultante de este proceso (para n fijo) lleva un cuadrilátero en el plano XY, centrado en su anchor point, a su ubicación correcta Luego se le aplica una matriz de traslación para mover el anchor point a la posición deseada Sabiendo todo esto, solo debemos definir qué vectores n y u utilizar para especificar la orientación del billboard, lo cual depende del tipo de billboard a utilizar 31

32 Billboarding Aspectos generales Tipos Screen-aligned billboard World-oriented billboard Axial billboard 32

33 Billboarding Screen-aligned billboard Es la forma más simple de billboarding Similar a un sprite bidimensional La imagen es siempre paralela a la pantalla Up vector u constante e igual al up vector de la cámara Normal a la superficie n es el vector inverso a la normal al plano de vista Como n y u ya son perpendiculares, simplemente se calcula el right vector r como su producto vectorial Con estos 3 vectores se forma la matriz de rotación Será la misma para todos los billboards de este tipo Porqué? Este tipo de billboard es útil para representar textos, ya que siempre estará alineado con la pantalla 33

34 Billboarding Aspectos generales Tipos Screen-aligned billboard World-oriented billboard Axial billboard 34

35 Billboarding World-oriented billboard Para algunos sprites el up vector de la cámara no es apropiado Si representa un objeto físico, estará orientado con respecto al up vector del mundo no al de la cámara Para estos sprites utilizamos entonces el up vector del mundo como vector u para derivar la matriz de rotación El vector normal n, que será el vector fijo, se define nuevamente como el inverso a la normal al plano de vista A partir de estos dos vectores se deriva un nuevo up vector ortogonal de la forma que ya presentamos para obtener el sistema local de coordenadas del billboard La matriz resultante puede ser reutilizada para todos los sprites Porqué? 35

36 Billboarding World-oriented billboard Este tipo de billboard es útil para representar muchos fenómenos como llamas, humo, explosiones y nubes Una técnica es agrupar y solapar sprites de forma aleatoria Permite disimular el patrón iterativo de la secuencia animada Evita que cada explosión se vea igual 36

37 Billboarding World-oriented billboard Para la animación de billboards es conveniente almacenar todos los frames animados en una misma textura Reduce el overhead asociado al switcheo de texturas Ejemplo: nubes en Microsoft Flight Simulator Formadas por desde 5 a 400 billboards cada una Solo 16 texturas sprites de base, ya que pueden modificarse y rotarse para formar una gran variedad de tipos de nube Modificación de transparencia basados en la distancia al centro de la nube para simular disipación y formación de la nube Por eficiencia, nubes distantes renderizadas en un conjunto de 8 texturas de panorama que rodean la escena (similar a skybox) Efecto de disipación de la luz en nubes densas mediante el oscurecimiento de las zonas de menor altitud Colores asociados con diferentes direcciones de luz solar permiten simular mediodías o atardeceres 37

38 Billboarding World-oriented billboard Sprites Simulating formation & dissipation with without Dissipation of light Directional shading 38

39 Billboarding World-oriented billboard El solapado de billboards semitransparentes debe ser realizado de forma ordenada (más lejano -> más cercano) De todos modos, billboards que representan humo o niebla pueden causar artefactos no deseados al intersectar con objetos sólidos 39

40 Billboarding World-oriented billboard En estos casos se pierde la ilusión Lo que debería ser un volúmen es visualizado como un conjunto de capas Posible solución? Hacer que el pixel shader chequeé la profundidad de los demás objetos mientras procesa cada billboard Si el objeto está cerca de la profundidad del billboard en ese pixel, se incrementa la transparencia del billboard Billboards de este tipo se denominan soft particles Existen otros casos particulares en los que se pueden producir artefactos no deseados como el anterior Por ej: cuando el observador atraviesa nubes Un billboard puede desaparecer por completo cuando pasa al frente del plano near, causando un salto repentino en la animación 40

41 Billboarding Aspectos generales Tipos Screen-aligned billboard World-oriented billboard Axial billboard 41

42 Billboarding Axial billboard En este tipo de billboarding el objeto texturizado normalmente no está orientado directo al observador En vez de esto, puede rotar alrededor de algún eje fijo de coordenadas de mundo y alinearse a si mismo de forma que enfrente al observador tanto como sea posible En este caso el up vector de mundo es fijo y la dirección de vista es utilizada como el vector ajustable Una vez se genera la matriz de rotación, el objeto es trasladado a su posición 42

43 Billboarding Axial billboard Este tipo de billboarding generalmente es útil para representar arboles distantes En vez de representarlo con una superficie sólida se lo representa como un único billboard El árbol afrontará al observador a medida que éste se mueve Se utiliza el up vector de mundo como un eje a lo largo del tronco del árbol 43

44 Billboarding Axial billboard Pero presenta un problema no menor Si el usuario sobrevuela la escena y mira hacia abajo Se pierde completamente la ilusión Los arboles se verán como las figuras planas que realmente son 44

45 Billboarding Axial billboard Soluciones? Una posible solución es agregar una textura circular del árbol que lo corte horizontalmente Esta nueva sección no necesita billboarding Otra solución es utilizar técnicas de LOD para reemplazar el impostor por un modelo poligonal Existen técnicas automáticas para realizar este tipo de transformaciones Existen muchas otras técnicas de renderización de árboles en real-time 45

46 Sistemas de partículas 46

47 Sistemas de partículas Sistema de pequeños objetos individuales que son puestos en movimiento utilizando cierto algoritmo No son una forma de rendering sino más bien un método de animación Implementados como parte del physics engine Existen controles para crear, mover, modificar y eliminar partículas en todo su ciclo de vida Se utilizan para simular Fuego Humo Explosiones Fluidos (agua, lava, etc) Y muchos otros fenómenos 47

48 Sistemas de partículas Cómo representar una partícula? Un punto renderizado en la pantalla Una línea (lluvia, etc) Un billboard Si las partículas son redondas, para orientarlas necesitamos solo su posición Cada partícula es un billboard screen-aligned y con una alpha texture Con el tiempo varía en tamaño y shading 48

49 Sistemas de partículas Adicionalmente a una imagen de textura que represente una partícula se pueden incluir también otras texturas Por ejemplo, un normal map Las GPU modernas permiten además Generar paths de animación para las partículas Realizar detección de colisiones con el entorno y entre partículas Además de ser utilizadas para explosiones y otros fenómenos, también se pueden utilizar para el rendering Se pueden modelar árboles utilizando sistemas de partículas para representar la geometría (bone structure) Se generan y muestran más partículas a medida que el observador se acerca al modelo 49

50 Sistemas de partículas Sistema de partículas utlizado en la demo Cascades Realizado con DirectX 10 por NVIDIA Corporation 50

51 Lens Flare & Bloom 51

52 Lens Flare & Bloom Lens Flare: fenómeno causado cuando un lente es apuntado hacia una luz brillante Halo: causado por las fibras radiales de la estructura cristalina de los lentes. Se ve como un anillo alrededor de la luz Corona ciliar: provocada por fluctuaciones de densidad en el lente. Aparece como rayos que emanan de un punto Bloom: causado por dispersión en los lentes, creando un resplandor alrededor de la luz 52

53 Lens Flare & Bloom Artefactos cada vez menos comunes en las cámaras modernas Actualmente se los agrega digitalmente o renderiza para dar la ilusión de aumento de brillo en una escena Brindan efectos visuales más realistas al observador 53

54 Lens Flare & Bloom Se utiliza un conjunto de texturas para los glare effects Cada una es aplicada a un cuadrado orientado hacia el observador La textura es tratada como un alpha map que determina qué tan transparente será el billboard Cada cuadrado suele tener cierto color Generalmente rojo, verde o azul para simular los efectos prismáticos de la corona ciliar Al solaparse y mezclarse con otros cuadrados se generan otros colores 54

55 Lens Flare & Bloom Implementando Lens Flare El lens flare debería cambiar con la posición de la luz Posible solución Conjunto de sprites alineados desde la posición de la luz a través del centro de la pantalla Si la luz está lejos del centro, los sprites son más chicos y más transparentes A medida que se acerca al centro se hacen más grandes y opacos Implementando Bloom Objetivo: generar una imagen que se vea sobreexpuesta en las zonas brillantes Posible solución Crear una imagen constituida por los objetos brillantes que estarán sobreexpuestos Aplicarle un efecto de blur, generalmente en varias pasadas Componer la imagen resultante con la original 55

56 Lens Flare & Bloom 56

57 Lens Flare & Bloom 57

58 Motion Blur Its amazing how much motion blur can add extra excitement and feeling to dramatic action sequences in games/movies. -- Anonymous -- 58

59 Motion Blur Para renderizar imágenes convincentes en aplicaciones interactivas es importante tener Una frame rate estable, para tener un movimiento suave y continuo Lo suficientemente alta, ya que frame rates bajas se experimentan como jerky motion Las películas se muestran a 24 FPS, pero Los teatros son oscuros y hace que el ojo sea menos sensible al flicker Proyectores muestran cada imágen desde 2 a 4 veces Pero lo más importante es que cada frame de película usualmente contiene una imagen desenfocada (motion blurred) lo cual brinda naturalmente más realismo Las imágenes en gráficos interactivos no lo poseen, por lo que es conveniente simularlo 59

60 Motion Blur Mover objetos rápidamente sin motion blur no es percibido de buena forma Nos salteamos varios pixeles entre frames Esto se puede ver como una forma de aliasing En este sentido, el motion blur se puede ver como una forma de antialiasing temporal Pero Así como incrementar la resolución de pantalla puede reducir el aliasing pero no eliminarlo, incrementar la frame rate no elimina la necesidad de motion blur 60

61 Motion Blur En particular, los videojuegos presentan movimientos rápidos de la cámara y de los objetos, por lo que el motion blur puede mejorar significativamente el aspecto visual 30 FPS con motion blur usualmente son mejor percibidos que 60 FPS sin motion blur El motion blur depende del movimiento relativo Si un objeto se mueve de izquierda a derecha, será desenfocado horizontalmente en la pantalla Si la cámara está siguiendo a un objeto, no se desenfoca el objeto sino el fondo 61

62 Motion Blur Enfoques para producir motion blur en el rendering por computador 1. Modelar y renderizar el blur Se agrega geometría delante y detrás de los objetos a medida que se mueven Enfoque sencillo Pero muy limitado 62

63 Motion Blur Enfoques para producir motion blur en el rendering por computador 2. Utilizar accumulation buffer Se utiliza el buffer para promediar varias imágenes Se mueve el objeto a un conjunto de los puntos que ocupa durante el frame y se mezclan las imágenes resultantes Se obtienen mejores resultados Pero Disminuye la velocidad de los fotogramas Puede generar algunos artefactos si el objeto se mueve muy rápido 63

64 Motion Blur Radial blurring para incrementar aún más la sensación de movimiento 64

65 Motion Blur Need for Speed: The Run 65

66 Motion Blur Mirror's Edge 66

67 Motion Blur Sonic the Hedgehog 67

68 Motion Blur Star Wars: The Force Unleased 2 68

69 Referencias 10 most beautiful looking Skyboxes in videogames 2D programming in a 3D world Fire in the Vulcan Demo Next-generation SpeedTree rendering 10 videogames with beautiful Motion Blur 69

70 Preguntas? 70

71 FIN Matias Nassi