Przegląd podstawowych pojęć Kurs ITA-106 (Grafika i multimedia) - Wstęp Jacek Matulewski (e-mail: jacek@fizyka.umk.pl) http://www.fizyka.umk.pl/~jacek/dydaktyka/3d/ http://www.fizyka.umk.pl/~jacek/ita106/ Grafika 3D Przegląd podstawowych pojęć Wersja: 7 listopada 2009

Zagadnienia grafiki 3D Podstawowe zagadnienia grafiki 3D: Modelowanie – budowanie modeli obiektów (ze świata realnego) za pomocą przestrzennych figur geometrycznych (trójkątów, wielokątów). Ilość trójkątów – jakość modelowania (realizm) – wymagany sprzęt Animacja – ruch obiektów – zmiana położenia w poszczególnych kadrach (renderowanych statycznych scenach) Renderowanie – techniczne aspekty przygotowania sceny (alg. rys. linii, bufor głębii, antyaliasing itp.)

Zagadnienia grafiki 3D Podstawowe zagadnienia grafiki 3D: Grafika czasu rzeczywistego programy korzystające z OpenGL, DirectX lub XNA do tworzenia „sterowanych animacji” tj. gier, programy do projektowania i wizualizacji Animacja komputerowa tworzenie obrazów techniką ray tracing, tworzenie filmów animowanych (Toy Story, Shrek) W tle funkcjonują Autodesk Maya i 3ds Max (modele)

Przykład modelowania (niestety to nie XNA, OpenGL lub DirectX, a ray tracing)

Historia grafiki 1960s – projektowanie 2D (Boeing, Peugot, Renault) 1970s – pojawiają się PC, pierwsze gry 2D, SIGGRAPH 1980s – Amiga, gry 2D stają się powszechne, SGI (GL), Luxo Jr. (1986), Flight Simulator (1982-2006) 1990s – OpenGL (1992), Wolfenstein 3-D (1992), Doom (1993), DirectX w Windows 95 (1994), Voodoo (1996), Quake (1996), Unreal (1998), Toy Story (1996) z Pixar (dawniej w IL&M) 2000s – Shrek (2001) i inne => śmierć kreskówki DirectX 9.0c (2004) => gry 3D są powszechne Managed DirectX (MDX, 2002), XNA (2006)

Historia grafiki 1992, id Software

Historia grafiki Quake (1996) Quake II (1997) Quake III Arena (1999) Źródło: http://www.club3d.nl/index.php/thema/subject/index/6

Historia grafiki Flight Simulator 1.0 (1982) Flight Simulator X (2006) Flight Simulator 1.0 (1982) Flight Simulator 2.0 (1984) Flight Simulator 3.0 (1988) Flight Simulator 4.0 (1989) MDA HGC FS 5.1 (1993-1995) CGA EGA VGA SVGA http://en.wikipedia.org/wiki/History_of_Microsoft_Flight_Simulator

Historia grafiki Tron (1982) – Disney Luxo, Jr (1986) – Pixar Toy Story (1996) – Pixar Shrek (2001) Dreamworks

Historia grafiki Zeszłoroczne nominacje do oskara w kategorii animacja Kung-Fu Panda Dreamworks Wall-e Disney/Pixar Madagaskar 2 Dreamworks Piorun Disney Zeszłoroczne nominacje do oskara w kategorii animacja

Modelowanie: wierzchołki Podstawowe pojęcia grafiki 3D: Vertex – wierzchołek figury 2D lub 3D, element siatki rozpiętej w 3D, która jest bazą renderowanej sceny Z werteksem mogą być wiązane własności, m.in: - pozycja i kolor (VertexPositionColor), - normalna (VertexPositionNormalTexture), - współrzędna tekstury (VertexPositionTexture) - inne wybrane przez programistę

Modelowanie: primitiwy Podstawowe pojęcia grafiki 3D: Primitiwy – figury zbudowane z vertexów, dwustronny obiekt modelowany jest z tysięcy trójkątów XNA: werteksyTrójkąta = new VertexPositionColor[3]{ new VertexPositionColor(położenie, kolor), new VertexPositionColor(new Vector3(-0.5f, -0.5f, 0), Color.Yellow), new VertexPositionColor(new Vector3(0, 0.5f, 0), Color.Magenta)}; OpenGL: glBegin(typ prymitiwu); glVertex3f(współrzędne); glColor3f(składowe); glVertex3f(współrzędne); … glEnd(); gd.DrawUserPrimitives<VertexPositionColor>(PrimitiveType.TriangleList, werteksyTrojkata, 0, 1);

Modelowanie: primitiwy Podstawowe pojęcia grafiki 3D: Primitiwy – figury zbudowane z vertexów, dwustronny obiekt modelowany jest z tysięcy trójkątów zbiór wierzchołków PrimitiveType.PointList Prim..Type.TriangleList Pri..Type.TriangleStrip PrimitiveType.LineList PrimitiveType.LineStrip Prim..Type.TriangleFan Używanie trójkątów (i pasów): najbardziej wydajne numerycznie, zmniejsza artefakty inna jest ilość werteksów używanych do narysowania linii i ciągu linii Brakuje czworokątów (quad) i wielokątów – trzeba je samodzielnie budować z trójkątów

Modelowanie: potok Podstawowe pojęcia grafiki 3D: Potok (ang. pipeline) – ciąg przekształceń macierzy (sprzętowo zrównoleglone) dane wejściowe: wierzchołki (vertices) w 3D transformacje: translacje, obroty (m. model-widok), obcięcia: frustum (ograniczenie ilości wierzchołków) rzutowanie: macierz rzutowania + mieszanie kolorów wynik: piksele obrazu 2D (współrzędne ekranu) Operacje na wierzchołkach i pikselach wykonywane są w procesorach strumieniowych karty graficznej (shadery)!

Modelowanie: potok Aplikacja XNA Shader werteksów Shader pikseli Rasteryzator Interpolator Shader werteksów Strumień werteksów Współrzędne werteksów w układzie ekranu Kolor, normalne, współrzędne tekstury Shader pikseli Test bufora głębi Bufor ramki Monitor Strumień pikseli

Efekt (klasa Effect) Klasa reprezentująca Pixel i Vertex Shadery w kodzie C#. Dostęp do własności wyświetlania (GraphicDevice). Bez przygotowywania własnych shaderów można używać klasy BasicEffect: macierze świata i widoku: własności World i View macierz rzutowania: własność Projection domyślne oświetlenie: DirectionalLight0-2, światło tła + efekt mgła (nie można zmieniać położenia źródeł św.) teksturowanie: własność Texture

Transformacje Podstawowe pojęcia grafiki 3D: Transformacje – określane we współrzędnych sceny 3D translacja (Matrix.CreateTranslation, macierz 4x4!), obrót (Matrix.CreateRotationXYZ, z osi obrotu i kąta, yaw+pitch+roll, klasa Quaternion) skalowanie (Matrix.CreateScale), pochylenie złożenie – dowolna macierz 4x4 (Matrix.Multiply) Rozdzielenie macierzy świata i widoku (wygoda!) Transformacje są wykonywane „od końca” (post-multiplication)

Transformacje Współrzędne jednorodne (homogenous coordinates) Wprowadzone w 1946 przez E. Maxwella (rzutowanie) W 1965 L. Roberts użył ich do zunifikowania zapisu wszystkich transformacji: translacji, obrotów, skalowanie i pochylania Opis punktów n-wymiarowej przestrzeni za pomocą n+1 współrzędnych Obcinanie we współrzędnych jednorodnych może odbywać się w prostopadłościanie zamiast w ściętym ostrosłupie (znacznie efektywniejsze numerycznie)

Transformacje We współrzędnych kartezjańskich (2D) obrót i translacja mogą być zapisane: We współrzędnych jednorodnych: O korzystaniu ze współrzędnych jednorodnych w osobnej prezentacji!

Kolor Składowe RGB + A (atrybut figury), alternatywa HSB R = 650 nm, G = 530 nm, B = 450 nm Możliwość cieniowania wewnątrz figury (atrybut wierzchołków)

Kolor Inne układy wsp. kolorów nie są wspierane w XNA: CMY(K), HSB, YPbPr, CIE xyY, CIE LUV, CIE Lab Klasa Microsoft.Xna.Framework.Graphics.Color RGB – dobre dla monitorów, TV (emisja światła), odpowiada fizjologii oka CMY(K) = 1 – RGB – drukarki (absorpcja światła)

Kolor HSB (HSV, HSL) – hue, saturation, brightness (value, lightness, luminance) Bardziej intuicyjne, używane w interakcji z człowiekiem

Fizyka i biologia koloru Składowe RGB + A (atrybut figury), alternatywa HSB R = 650 nm, G = 530 nm, B = 450 nm

Światło (cieniowanie) Fizyczny model oświetlenia – na efekt końcowy (tj. kolor piksela) wpływają „własności emisyjne” źródła światła, „własności absorpcyjne” materiału, który jest oświetlany i własności ewentualnych ciał półprzezroczystych + = Typy źródeł oświetlenia: Światło otoczenia (ambient) – światło słoneczne w białym pomieszczeniu Rozproszone (diffuse) – mleczna żarówka, świeca Rozbłysk (specular) – reflektor, odbicie od lustra Dla każdego typu parametry materiału ustalane są osobno Typy źródeł oświetlenia: Światło otoczenia (ambient) Rozproszone (diffuse) – posiada źródło, ale jest jednorodne we wszystkich kierunkach Generalnie: Jasność proporcjonalna do kosinusa kąta padania (normalna) Typy źródeł oświetlenia: Światło otoczenia (ambient) – bez źródła i kierunku – rozświetla jednorodnie całą scenę, także wewnątrz figur) – nie daje cieni na obiekcie (nie ma złudzenia 3D) Typy źródeł oświetlenia: Światło otoczenia (ambient) Rozproszone (diffuse) Rozbłysk (specular) – źródło i kierunek reflektor, efekt „zajączka” – rozbłysku na gładkich pow.

Model oświetlenia Phonga + = Opracowany w 1975 przez Phong Bui-Tuonga Jest jedynie zgrubnym przybliżeniem praw optyki Zakłada trzy niezależne komponenty odbitego światła Światło rozproszone – model Lamberta (1760) Model cieniowania Phonga (coś innego niż model ośw.) = interpolacja normalnych (uśrednianie normalnych)

Model oświetlenia Phonga + = W XNA i Direct3D model Phonga jest uzupełniony o światło emisji (emission) Imitacja źródła światła (jednak nie oświetla innych aktorów na scenie!) Realizowane podobnie jak światło otoczenia

Model Lamberta Model światła rozproszonego Jasność przedmiotu (natężenie światła) równa jest Ii. Jest ono jakąś funkcją natężenia światła padającego na powierzchnię i kąta odbicia b (= padania) Model zakłada, że natężenie światła odbitego Id jest proporcjonalne do „efektywnej powierzchni” widzianej przez obserwatora Acos(b ). N – wektor normalny, L – promień św. odbitego N L Id = Ii cos(b ) Obliczanie cos(b ) jest szybkie: cos(b ) = NxLx+NyLy+NzLz

Model Phonga Model światła specular („zajączek”) Wprowadzony przez Phonga – nie ma podstaw fizycznych N – wektor normalny L – promień św. odbitego V – kierunek do obserwatora N L V Is = Ii cos n (a ) Parametr n kontroluje „ostrość” zależności od kąta pod którym oglądamy fragment powierzchni n ~ B..Effect.SpecularPower n = 1, 5, 10, 20, 50, 100

Model oświetlenia Phonga Trójkomponentowy model oświetlenia ambient diffuse specular + = ka kd ks Ia Id Is ka kd ks Ii cos(b ) Ii cos n (a ) Ia + + = I W rzeczywistości (tj. w XNA, Direct3D) takie obliczenia prowadzone są osobno dla każdej składowej koloru (RGB)

Modele cieniowania Cieniowanie płaskie – jasność określana jest wzorem Phonga dla całej płaskiej powierzchni trójkąta w modelu. W przypadku powierzchni płaskich efekt jest „kanciasty” Dodatkowo niekorzystny efekt pasm Macha Jak kolorować powierzchnie zaokrąglone?

Modele cieniowania Cieniowanie Phonga – obliczenia koloru dla każdego punktu trójkąta z wektorem normalnym wyznaczonym na podstawie interpolacji na bazie trzech wektorów normalnych przypisanych do każdego wierzchołka trójkąta płaskie Phong

Modele cieniowania Cieniowanie Gourauda – kolor punktu na prymitywie uzyskiwany jest przez interpolację składowych koloru jego wierzchołków (tylko te wyznaczane są np. wzorem Phonga) Mniej wymagający numerycznie, ale też mniej realistyczny Model to żona Henri Gourauda, Sylvie. Wada: wyraźnie widać granicę użytych figur (wymaga gęstszej sieci niż met. Phonga)

Modele cieniowania Cieniowanie globalne Jim Kajiya, 1986 (Microsoft) Przy obliczaniu składowych światła odbitego uwzględnia nie tylko światło pochodzące ze źródeł, ale również odbite od innych pow. Obliczenia rekurencyjne Używane w metodzie śledzenia promieni (ray tracing) Powoli wchodzi do silników graficznych działających w czasie rzeczywistym Automatycznie generuje także cienie obiektów rzucane na inne powierzchnie I(x, x') – sumaryczna intensywność (składowe koloru) w punkcie x z punktu x' g(x, x') = 0 jeśli x i x‘ są przesłonięte, = 1/d 2 w przeciwnym wypadku, d = odl. między punktami x i x' e(x, x') – intensywność emitowana przez x' do x r(x, x ',x'') – intensywność światła odbitego z x'' do x przez x' S – wszystkie punkty na wszystkich powierzchniach odbijających światło

Przykłady użycia ray tracing Źródło: http://hof.povray.org

XNA Idea 1: dostęp do Direct3D i DirectDraw z języków .NET Idea 2: przenośność (PC z Windows, Xbox 360, Zune) skupienie na grze, a nie na platformie sprzętowej Idea 3: pełne wykorzystanie obecnych kart graficznych (programowalne jednostki kart graficznych)

Architektura XNA edytor, debuger, IntelliSense (IDE) Matrix, Vector3 3/28/2017 11:14 AM edytor, debuger, IntelliSense (IDE) Framework Matrix, Vector3 klasy opakow. DX GC, C# 3.0 wątki, IO DirectX Gamepad Źródło: Mitch Walker, prezentacja na Gamefest 2008

Czego potrzebujemy… Karta graficzna zgodna z DirectX 9.0 (Shader 1.1) Visual Studio 2008 lub Visual C# 2008 Express Edition Platforma .NET 3.5 (instalowana razem z VS/VC#) XNA Game Studio 3.0 (XNA = XNA Not Acronymed) NVidia FX Composer 2.5 – narzędzie bardzo pomocne do programowania shaderów

Czego nie musimy… Znać algorytmów cieniowania (shading) chyba, że programujemy procesory strumieniowe Zajmować się algorytmami kreślenia linii z pikseli (programowaniem antyaliasingu, itp.) Algorytmy optymalnego rysowania trójkątów, zapełniania wielokątów, rysowania krzywych Usuwać niewidocznych na scenie werteksów, powierzchni przesłoniętych przez innych aktorów To robią karty graficzne i biblioteka XNA!

Nie musimy także… Znać algebry wektorów i macierzy (Vector34, Matrix) (w tym macierz translacji, obrotu, rzutowania itd.) Tworzyć pętli głównej, dbać o timery inicjujące renderowanie sceny i „odświeżanie” logiki aplikacji Wiedzieć, czym są współrzędne jednorodne, w których pracują karty graficzne Obsługiwać sterowników urządzeń wejścia (sterowników gier) i wyjścia (karty dźwiękowej) To robi biblioteka XNA!

Co musimy zrobić sami… Cienie rzucane na podłoże i inne przedmioty rzutowanie cieni, shadow mapping, volumetric shadows Wykrywanie kolizji, rozwiązywanie równań ruchu, rigid są biblioteki komercyjne i rozwiązania sprzętowe (GPU) Wszelkie odstępstwa od domyślnego oświetlenia i teksturowania wymagają programowania shaderów (w tym już zmiana pozycji źródeł światła) Programowanie logiki w C# Zaplecze w XNA 3.0: .NET Framework 3.5 (LINQ) Możliwość przygotowania wizualizacji danych z b.d.

Co dalej? Struktura projektu XNA (Visual C# 2008/XNA GS 3.0) Definiowanie figur w przestrzeni trójwymiarowej Transformacje, animacja, współrzędne jednorodne Oświetlenie i teksturowanie Dźwięk Obsługa kontrolerów gier Jutro: Pixel Shader i Vertex Shader (Tomasz Dziubak) Wkrótce w skrypcie: cienie (shadow mapping), fizyka

Pokazy Minjie (Reversi, Othello) T:\Wydawnictwa\XNA dla ITA (Microsoft)\JM\materialy z Internetu\Gry z CreatorsClub\EXE Minjie (Reversi, Othello) Simple Animation, Skinning Sample, Shatter Effect Particle 3D, Shadow Mapping, Normal Mapping Space War (Starter Kit, 2D) Racing Game (Starter Kit, 3D) Więcej: http://creators.xna.com/en-US/education/catalog/

Co dalej? Witryny oferujące kursy XNA (j. ang.): XNA Creators Club (http://creators.xna.com) oficjalna witryna Microsoft poświęcona technologii XNA, zawiera także kurs tworzenia gier dwu- i trójwymiarowych RB Whitaker's Wiki (http://rbwhitaker.wikidot.com/xna-tutorials) kurs zawierający wiele prostych i krótkich lekcji, w sam raz na początek znajomości z XNA XNA Resources (http://xnaresources.com, j. ang.) – spora witryna z tutorialami i innymi zasobami przeznaczonymi dla programistów XNA Riemer’s XNA Tutorials (http://www.riemers.net, j. ang.) witryna autora bardzo dobrej książki o XNA (zob. niżej), układ witryny nieco nieprzejrzysty Brakuje dobrych (i jakichkolwiek) materiałów w języku polskim!

Co dalej? Książki o XNA 2.0: Riemer Grootjans, XNA 2.0 Game Programming Recipes: A Problem-Solution Approach (Books for Professionals by Professionals), Apress Alexandre Santos Lobao, Bruno Pereira Evangelista, José Antonio Leal de Farias, Beginning XNA 2.0 Game Programming: From Novice to Professional (Expert's Voice in Game Programming), Apress James Silva, John Sedlak, Building XNA 2.0 Games: A Practical Guide for Independent Game Development (Books for Professionals by Professionals), Apress Jim Perry, Allen Sherrod, Essential XNA Game Studio 2.0 Programming, Wordware Publishing Benjamin Nitschke, Professional XNA Programming: Building Games for Xbox 360 and Windows with XNA Game Studio 2.0, Wrox Na razie nie ma książek o XNA 3.0! Nie ma żadnych książek po polsku.