Rendering no fotorrealista

Rendering no fotorrealista. Cap. 11 del RT3 y NPRRFCA Computación Gráfica Avanzada Ingeniería en Computación Facultad de Ingeniería Universidad de la República Matias Nassi

Agenda Introducción Toon shading Silhouette edge rendering Surface Angle Silhouetting Procedural Geometry Silhouetting Silhouetting by Image Processing Silhouette Edge Detection Otros estilos 2

Introducción 3

Introducción 1. Rendering fotorrealista Se intenta que una imagen sea indistinguible de una fotografía Mediante complejos algoritmos matemáticos se simulan Efectos de luz (halos, destellos, etc) Sombras Reflejos Refracciones Y muchos otros efectos Algunos algoritmos Raytracing Radiosity Photon Mapping 4

Introducción Photorealism is like pornography, It leaves nothing to the imagination Cassidy Curtis (graphic artist) 5

Introducción 2. Rendering NO fotorrealista Se busca generar imágenes que no luzcan como una fotografía Varias utilidades Crear imágenes similares a ilustraciones técnicas, pero mostrando solo aquellos detalles relevantes Simular múltiples formas de pintura» Lápiz o tinta» Papel carbónico» Crayola» Acuarela» Cartoon style» Y más 6

Introducción 2. Rendering NO fotorrealista Utilizado tanto en películas y videojuegos como en ilustración arquitectural Hay diversos algoritmos de NPR Varian dependiendo del efecto a implementar 7

Introducción 8

Introducción 9

Introducción 10

Toon shading 11

Toon shading También llamado Toon rendering o Cel rendering Diseñado para hacer que las imágenes parezcan dibujos animados Los objetos son dibujados con líneas sólidas que separan zonas de diferentes colores Las siluetas son usualmente renderizadas en color negro para amplificar el aspecto caricaturista 12

Toon shading Se utiliza hace más de una década para integrar gráficos 3D con animaciones 2D Algunos videojuegos que lo utilizan Okami Cel Damage Valkyria Chronicles Borderlands El Shaddai Dragon Ball Z Ultimate Tenkaichi 13

Toon Shading Okami 14

Toon Shading Cel Damage 15

Toon Shading Valkyria Chronicles 16

Borderlands Toon Shading 17

Toon Shading El Shaddai 18

Toon shading Existen varios enfoques diferentes para implementar Toon Shading Para modelos con texturas pero sin iluminación, el aspecto de caricatura puede aproximarse directamente por las texturas Para modelos con iluminación hay dos alternativas 1. Solid shading: rellenar los polígonos con colores sólidos sin iluminación 2. Hard shading: utilizar dos colores (two-tone) para representar áreas iluminadas y sombreadas 1 2 19

Toon shading Solid shading es trivial Hard shading se puede realizar remapeando los elementos tradicionales de la ecuación de iluminación a diferentes paletas de colores 20

Toon shading Una posible forma de implementar tow-tone shading es Calcular la iluminación difusa para cada vértice como N*L y usar este valor para acceder a un mapa de textura unidimensional El mapa de textura contiene solo dos tonos: luz y oscuridad Cos(θ) Mapa de textura dark light 21

Toon shading Una posible forma de implementar tow-tone shading es Calcular la iluminación difusa para cada vértice como N*L y usar este valor para acceder a un mapa de textura unidimensional El mapa de textura contiene solo dos tonos: luz y oscuridad 22

Toon shading Una posible forma de implementar tow-tone shading es En suuso convencional se pueden dar dos casos» N*L <= 0: se selecciona el tono oscuro de la textura» N*L > 0: se selecciona el tono claro de la textura -1 0 1 dark light Pero se pueden utilizar valores distintos del umbral -1 0.5 1 dark light De forma similar se puede utilizar una textura unidimensional simple para incorporar brillo especular Todo el procedimiento anterior puede implementarse por CPU o mediante un Vertex Shader 23

Toon shading Comparación de los diferentes métodos Gourad-shaded Toon-shaded Solid shading Two-tone shading -1 0.5 1 Specular/diffuse three-tone shading 24

Aspectos generales Silhouette edge rendering Tipos Surface Angle Silhouetting Procedural Geometry Silhouetting Silhouetting by Image Processing Silhouette Edge Detection 25

Silhouette edge rendering Los algoritmos utilizados para el rendering de aristas en el Toon Shading son una de las técnicas más importantes en esta área Los métodos para el trazado de siluetas se pueden caracterizar en base a Ángulo entre las superficies Geometría procedural Procesamiento de imágenes Detección de aristas de silueta Híbrido de las anteriores 27

Silhouette edge rendering Tipos de aristas utilizados en Toon Shading Border edge Arista no compartida por 2 polígonos Por ej: el borde de una hoja de papel Un objeto sólido típicamente no posee border edges Crease edge Arista compartida por 2 polígonos, tales que el ángulo entre los polígonos (dihedral angle) es mayor a cierto valor predefinido Las normales difieren entre los 2 polígonos vecinos 28

Silhouette edge rendering Tipos de aristas utilizados en Toon Shading Material edge Aristas en las que los dos polígonos que la comparten difieren en material o causan un cambio en el sombreado También aristas que no entran en las demás categorías pero que el artista desea dibujar Línea quesepara pantalón y remera del mismo color Silhouette edge Arista en la que los dos polígonos vecinos apuntan a direcciones diferentes comparadas con algún vector dirección Usualmente el vector dirección es un vector desde el observador hacia algún punto de la arista Arista es silhouette edge si la cara de un polígono está mirando al observador y la del otro está oculta 29

Silhouette edge rendering Border edge Crease edge Material edge Silhouette edge 30

Aspectos generales Tipos Silhouette edge rendering Surface Angle Silhouetting Procedural Geometry Silhouetting Silhouetting by Image Processing Silhouette Edge Detection 31

Silhouette edge rendering Surface Angle Silhouetting Técnica basada en los ángulos de las superficies al igual que el surface shader anterior Para obtener una silhouette edge, se utiliza el producto interno entre el vector dirección hacia el observador y la normal a la superficie Si es cercano a 0, la superficie está casi de perfil al observador y por lo tanto es probable que esté cerca de una silhouette edge Se puede implementar utilizando un vertex shader 32

Silhouette edge rendering Surface Angle Silhouetting Esta técnica es equivalente a sombrear una superficie utilizando un environment map esférico con un anillo negro como contorno Lo que está alejado de una arista se mapea con el relleno del spheremap A medida que nos acercamos a las aristas comienza a mapearse con el contorno del spheremap 33

Silhouette edge rendering Surface Angle Silhouetting En la práctica puede utilizarse un texture map unidimensional en vez de uno esférico Este tipo de técnicas funciona solo para modelos que presentan una relación entre la normal a la superficie y la silhouette edge Desventaja del método: las líneas de silueta son dibujadas con ancho variable dependiendo de la curvatura de la superficie Polígonos planos muy grandes serán pintados enteramente de oscuro al estar cerca de una arista En Cel Damage esta técnica dio excelente resultados para ¼ de los modelos, pero falló para el resto 34

Silhouette edge rendering Procedural Geometry Silhouetting Es una de las primeras técnicas de silhouette rendering en tiempo real Idea básica: renderizar las caras frontales normalmente y luego las caras traseras de forma que se hagan visibles sus silhouette edges Hay varias formas de renderizar las caras posteriores, cada una con sus ventajas y desventajas Todas ellas parten de la base que ya se dibujaron las caras frontales Luego se habilita el frontface culling y deshabilita el backface culling y se dibuja De esta forma se muestran solo las caras traseras Observar que se hacen 2 pasadas de dibujado 36

Silhouette edge rendering Procedural Geometry Silhouetting Una forma de renderizar las silhouette edges es dibujando solos las aristas (no las caras) de las backfaces Utilizando ciertas técnicas se puede asegurar que esas líneas serán dibujadas justo por delante de las frontfaces Esto hace que todas las líneas estés ocultas, excepto las silhouette edges Una forma de hacer las líneas mas gruesas es Dibujar las backfaces completamente de negro Sin ningún desplazamiento esas backfaces serán invisibles, por lo que luego se las desplaza hacia adelante en la pantalla (Z-bias) Como resultado sólo serán visibles las aristas de las backfaces 37

Silhouette edge rendering Procedural Geometry Silhouetting Existen varios métodos para realizar el desplazamiento Desplazar según una cantidad fija Desplazar según cierta cantidad dependiente de la profundidad Utilizar un desplazamiento depth-slope (glpolygonoffset en OpenGL) El problema con estos métodos es que no crean líneas con un ancho uniforme Depende de la backface, la frontface y el ángulo que forman 38

Silhouette edge rendering Procedural Geometry Silhouetting Triangle fattening: una posible solución al problema anterior consistente de expandir cada triángulo de backface a lo largo de sus aristas una cantidad necesaria para que se vea una línea uniformemente gruesa La inclinación del triángulo y la distancia al observador determinan qué tanto expandirlo Dos formas de realizar el desplazamiento 1. Se desplaza cada vértice en el plano donde se encuentra y luego se los une para formar un nuevo triángulo 2. Se desplaza cada arista y luego se las une formando un triángulo truncado 39

Silhouette edge rendering Procedural Geometry Silhouetting Comparación de los métodos de backfacing edge Thick lines Z-bias Fattened triangle 40

Silhouette edge rendering Silhouetting by Image Processing Se extiende la utilización de G-buffers para realizar toon rendering Se opera con datos almacenados en buffers, sin modificar (e incluso concer) la geometría de la escena La idea básica es implementar NPR aplicando técnicas de procesamiento de imágenes sobre varios buffers de información Discontinuidades en valores vecinos del Z-buffer permiten identificar la mayoría de las silhouette edges Discontinuidades en valores vecinos de normales a la superficie permiten encontrar border edges 42

Silhouette edge rendering Silhouetting by Image Processing Para hacer esto en tiempo real Se renderiza la escena en una textura del tamaño de la pantalla Utilizando vertex shaders se renderizan las normales y z-depths de la escena en nuevas texturas del tamaño de la pantalla El próximo paso es encontrar las silhouette, border y crease edges Para encontrarlas se toman varias muestras de las texturas anteriores y se les aplica un filtro de Sobel para detección de aristas De la composición de las anteriores se obtiene una textura de aristas Finalmente se componen las imágenes resultantes, es decir, la textura original de color y la textura de aristas 43

Silhouette edge rendering Silhouetting by Image Processing Ejemplo 1. Se renderiza la escena en una textura del tamaño de la pantalla 2. Se renderiza la información de z-depth en una textura del tamaño de la pantalla 44

Silhouette edge rendering Silhouetting by Image Processing 3. Se renderiza la información de normales a la superficie en una textura del tamaño de la pantalla 4. Se aplica un filtro de Sobel para detección de aristas en las texturas anteriores para obtener una textura de aristas 45

Silhouette edge rendering Silhouetting by Image Processing x = 5. Finalmente, se componen las texturas de color y aristas para obtener el render final 46

Silhouette edge rendering Silhouette Edge Detection Las técnicas anteriores tienen el defecto de tener que realizar varias pasadas para el renderizado de las silhouette edges Una mejor forma de encarar el problema es detectando las silhouette edges y renderizándolas directamente Esto proporciona un mejor control de cómo se dibujan las líneas Debido a que de esta forma las aristas son independientes del modelo, se pueden crear diversos efectos Por ej: hacer que la silueta salte sorpresivamente mientras la malla se mantiene 48

Silhouette edge rendering Silhouette Edge Detection Existe una silhouette edge cuando uno de los polígonos está de frente hacia el observador y el otro de espalda Por lo tanto, el test a realizar es (N0*V > 0) <> (N1*V > 0) N0 y N1 son las normales a ambos polígonos V es la dirección desde el observador hacia la arista El método estándar es iterar todas las aristas y realizar el test anterior para cada una Una vez que las aristas son encontradas se dibujan con line drawning, texture impostors u otro método 49

Silhouette edge rendering Silhouette Edge Detection Problema Eficiencia! Realizar el test para todas las aristas es poco performante Algunas soluciones Culling de aristas de polígonos coplanares Si los 2 polígonos vecinos para una arista caen en el mismo plano, no se agrega esa arista a la lista de aristas a testear Reusar los cálculos del producto entre vectores 50

Otros estilos 09/11/2011 Computación Gráfica Avanzada: Rendering basado en imágenes 51

Otros estilos NPR agrupa una gran variedad de estilos mas allá del toon shading Praun presenta un método en tiempo real consistente en generar stroke-texture mipmaps y aplicarlas a las superficies Estos mapas se denominan TAM (Tonal Art Maps) 09/11/2011 Computación Gráfica Avanzada: Rendering basado en imágenes 52

Otros estilos Ejemplo de modelos renderizados de esta forma: 09/11/2011 Computación Gráfica Avanzada: Rendering basado en imágenes 53

Preguntas? 09/11/2011 Computación Gráfica Avanzada: Rendering basado en imágenes 54

FIN Matias Nassi