Podstawy
Silników gier
Tekstury, materiały i shadery
Paulina Kucharczyk
Tekstura
01
You can enter a subtitle here if you need it
Proces teksturowania
Operacja wykonywana na ściach modelu 3D, pozwalająca na “naklejenie” na nich grafiki 2D.
Mówiąc fachowo, jest to dodawanie cech powierzchni bryły pomiędzy jej wierzchołkami.
teksturowanie
Obraz komputerowy lub funkcja matematyczna przedstawiająca szczegóły powierzchni lub kolorów obiektów przestrzennych.
Nakłada się ją na ściany obiektów 3D.
Tekstura
Źródło: Dream Farm Studios
Proces teksturowania
Model 3D z siatką mesh
Grafika tekstury rozłożona na siatce
+
Proces teksturowania
Model bez tekstury, z odbiciami światła (po lewej) i model z teksturą (po prawej)
Proces teksturowania Jak działa teksturowanie?
Tworzenie bryły modelu przy pomocy siatki wielokątów,
Etap 1 - Tworzenie mesha
Odwzorowanie powierzchni bryły w przestrzeń tekstury.
Etap 3 - Mapowanie tekstury
Określenie współrzędnych w przestrzeni tekstury i bryły.
Etap 2 - Adresowanie Tekstury
Proces teksturowania tworzenie mesha
Mesh - ang. Siatka
Rzeźbienie modelu w przestrzeni trójwymiarowej.
Każda ściana bryły składa się z trójkątów, które stworzone są z trzech wierzchołków. Każdy wierzchołek jest rozmieszczony w przestrzeni i opisany przez współrzędne X, Y, Z. W zależności od gęstości siatki uzyskiwane są odpowiednie dokładności.
Proces teksturowania adresowanie tekstury
Adresowanie tekstury odbywa się z użyciem współrzędnych
w jej przestrzeni, tj. dwuwymiarowych jeśli obraz jest
dwuwymiarowy.
Powszechnie stosowaną nazwą jest tworzenie UV.
Proces teksturowania adresowanie tekstury
Czy UVW i STR to, to samo co XYZ?
I tak, i nie.
W rzeźbieniu czyli przestrzeni 3D używamy współrzędnych X (pozioma oś), Y (pionowa), Z (prostopadła)
W mapowaniu czyli przestrzeni 2D używamy współrzędnych U (pozioma oś), V (pionowa), W (prostopadła)
X = U = S
Y = V = T
Z = W = R
W takim razie skoro jest to, to samo to dlaczego są inne oznaczenia?
A no dlatego, żeby się nie mylić i łatwiej rozróżniać prace w przestrzeni 2D i 3D.
Łatwiej jest też w ten sposób pracować algorytmom.
Skąd takie znaki? Są to po prostu kolejne znaki alfabetu.
Proces teksturowania adresowanie tekstury
Osie: U - pozioma, V - pionowa, W - prostopadła
Proces teksturowania adresowanie tekstury
U góry tekstura, na dole teksturowana bryła.
Źródło: Bartosz Bazyluk, Teksturowanie. Pojęcie tekstury, potok, zastosowania., bazyluk.net
Proces teksturowania adresowanie tekstury
U góry tekstura, na dole teksturowana bryła.
Źródło: Bartosz Bazyluk, Teksturowanie. Pojęcie tekstury, potok, zastosowania., bazyluk.net
Proces teksturowania mapowanie tekstury
Mapowanie jest procesem przypisywania współrzędnych tekstury do wierzchołków obiektu.
Współrzędne tekstury (U,V) należą do przedziału <0, 1>. Na etapie rasteryzacji prymitywów współrzędne te są interpolowane do fragmentów.
Jeśli posłużymy się analogią do owijania pudełka kolorowym papierem, to mapowanie określa która część arkusza papieru trafi na którą stronę pudełka.
Efekt końcowy mapowania zależeć będzie od użytego algorytmu.
Źródło: Zephyris, Representation of the UV mapping of a cube, wikipedia.org
Proces teksturowania mapowanie tekstur
Źródło: Cindy Reed. Texture Mapping in VRML
Proces teksturowania Mapowanie tekstury
Źródło: wrap-r.com
Tekstura
To nie tylko zwykły obrazek!
Tekstura zawiera również informacje o kolorach powierzchni obiektów czy informacje o barwieniu, blasku i przezroczystości po nałożeniu oświetlenia i cieniowania.
Możemy spotkać się z teksturami:
Paramery tekstury
1D, 2D, 3D
Rozmiar
Rozdzielczość
Ilość kanałów, typy danych (int, float)
Format
Wymiarowość
Proces teksturowania
Tekstury proceduralne
Mapa
02
You can enter a subtitle here if you need it
Albedo
Albedo odpowiada za kolor oraz przezroczystość powierzchni.
Po prostu tekstura
Metallic
Określa, czy powierzchnia obiektu ma właściwości metaliczne. Może być kontrolowany zarówno teksturą, jak i suwakiem.
Gdy wartość "Metallic" jest bliska 0, oznacza to, że powierzchnia jest bardziej matowa i zachowuje się podobnie do drewna czy kamienia. Takie obiekty zazwyczaj odbijają mniej światła.
Gdy wartość "Metallic" jest bliska 1, oznacza to, że powierzchnia ma właściwości metaliczne, takie jak stal czy złoto. Metaliczne powierzchnie odbijają dużo światła, ale charakteryzują się również innymi cechami, takimi jak odbicia otoczenia czy kolory wprowadzone przez mapę albedo.
Metallic - Smoothness
Parametr "Smoothness" (gładkość) w kontekście materiałów w Unity jest zazwyczaj związany z efektem rozmycia powierzchni, szczególnie istotnym dla materiałów metalicznych. W skrócie, im wyższa wartość smoothness, tym bardziej powierzchnia obiektu jest gładka i bardziej odbijająca.
Dla materiałów metalicznych w Unity:
Niska wartość "Smoothness" (bliska 0) oznacza chropowatą powierzchnię, co może przypominać matowe wykończenie. Światło odbite przez taką powierzchnię będzie bardziej rozproszone, co sprawia, że obiekt wydaje się mniej błyszczący.
Wysoka wartość "Smoothness" (bliska 1) oznacza gładką, lustrzaną powierzchnię. Światło odbite przez taką powierzchnię będzie bardziej skoncentrowane i obiekt będzie bardziej błyszczący.
Normal map
Określa sposób reagowania materiału na światło - czy w danym miejscu obiektu światło będzie widoczne, czy będzie ciemno
Normal mapy są używane do symulowania detali, takich jak nierówności, zmarszczki, czy inne mikroskopijne elementy na powierzchni obiektu. Dzięki nim światło odbija się od powierzchni w bardziej złożony sposób, co dodaje realizmu bez konieczności zwiększania liczby detali geometrycznych, co byłoby kosztowne dla zasobów komputerowych.
Height map
Wyobraź sobie, że chcesz przedstawić górzysty teren na płaskiej powierzchni, na przykład w grze wideo. Zamiast rysować każdy szczegół terenu, możesz użyć height mapy. Height mapa to po prostu obraz, na którym różne odcienie szarości reprezentują różne wysokości. Jasne obszary mogą oznaczać wyższe tereny, a ciemne niższe.
Occlusion
Określa, które miejsca same się zacieniają, a które nie.
Wyobraź sobie, że masz trzy obiekty: jeden przed drugim. Gdy patrzysz na nie z pewnego punktu, część jednego obiektu może zasłaniać część drugiego. Occlusion mapa pomaga określić te obszary zacienione (zakryte), co pozwala programowi lepiej symulować realistyczne oświetlenie i cienie.
Detail Mask + secondary maps
Zawiera informacje o obszarach, gdzie chcemy dodatkowego szczegółu lub detalu na powierzchni obiektu.
Przykładowo, możemy mieć obiekt, na przykład twarz ludzką, na którą chcemy dodać porowatość skóry. Zamiast umieszczać porowatość na teksturze głównej, możemy umiescić ją na teksturze dodatkowej.
Emission
Obiekt o właściwościach emission sam w sobie działa jak źródło światła, świecąc w otoczeniu.
Emission może być używane do teksturowania obiektów, które świecą własnym światłem, na przykład żarówki, ekrany komputerowe, neonowe znaki czy czerwone diody LED. Obiekty z właściwościami emission mogą wpływać na oświetlenie otoczenia, nadając scenie atmosferę lub akcentując pewne elementy.
Tiling i Offset
Określa jak tekstura jest nakładana i przesuwana na materiale.
W przypadku Tilingu = 1 tekstura będzie rozciągnięta po całej dostępnej szerokości. �Jeżeli Tiling > 1, to tekstura odpowiednio tylukrotnie zostanie “upchnięta” na dany obszar. Jeżeli < 1, to zostanie rozciągnieta by dany obszar tekstury zajął całość.
Offset to z kolei przesunięcie bazowe tekstury - nakładanie tekstury nie zacznie się od punktu (0,0), a od wartości offsetu.
Specular highlights
Specular Highlights, czyli to efekt świetlny, który pojawia się na powierzchni obiektu w wyniku odbicia światła.
Kiedy patrzysz na oświetloną powierzchnię, np. metaliczną, na której pada światło, często zauważasz jasne, błyszczące punkty lub linie. Te błyszczące detale to właśnie specular highlights.
Specular highlights występują na gładkich i błyszczących powierzchniach, takich jak metal, szkło czy woda. Ten efekt jest rezultatem odbicia światła prosto do kamery, co sprawia, że te konkretne obszary są jaśniejsze niż otaczające je fragmenty.
Reflections
Określa czy materiał ma cechy materiału odbijającego inne obiekty
Shader
03
You can enter a subtitle here if you need it
Shadery
https://www.shadertoy.com/
01
05
03
02
06
04
Here you could describe the topic of the section
Here you could describe the topic of the section
Here you could describe the topic of the section
Here you could describe the topic of the section
Here you could describe the topic of the section
Here you could describe the topic of the section
OUR COMPANY
PROJECT STAGES
MAIN REQUIREMENTS
OUR TEAM
PROJECT GOALS
ABOUT THE PROJECT
materiał
04
You can enter a subtitle here if you need it
Teksturowanie
Mercury is the closest planet to the Sun and the smallest one in our Solar System. It’s only a bit larger than our Moon
jupiter
Venus has a beautiful name and is the second planet from the Sun. It’s terribly hot, even hotter than Mercury
saturn
It’s a gas giant, composed mostly of hydrogen and helium. Its name comes from the Roman god of wealth and agriculture
Despite being red, Mars is actually a cold place. It’s full of iron oxide, which gives the planet its reddish cast
MARS
mercury
ABOUT THE PROJECT
Mercury is the closest planet to the Sun and the smallest one in the Solar System—it’s only a bit larger than our Moon. The planet’s name has nothing to do with the liquid metal, since it was named after the Roman messenger god
“This is a quote. Words full of wisdom that someone important said and can make the reader get inspired.”
—SOMEONE FAMOUS
NOW
Venus has a beautiful name and is the second planet from the Sun. It’s terribly hot—even hotter than Mercury—and its atmosphere is extremely poisonous. It’s the second-brightest natural object in the night sky after the Moon
MAIN REQUIREMENTS
Jupiter is a gas giant and the biggest planet in our Solar System
Venus has a beautiful name and is the second planet from the Sun
Neptune is the fourth-largest planet by diameter in our Solar System
06
04
05
03
01
02
Despite being red, Mars is actually a cold place. The planet is full of iron oxide
Saturn is the ringed one. It’s a gas giant, composed of hydrogen and helium
Mercury is the smallest planet in our Solar System. It’s only a bit larger than our Moon
BUDGET
6,000,000
mercury
jupiter
venus
saturn
Mercury is the smallest planet in our Solar System
Jupiter is the largest planet in our Solar System
Venus is the second planet from the Sun
Saturn is composed of hydrogen and helium
1,000,000
2,500,000
500,000
2,000,000
PROJECT GOALS
If you want to modify this graph, click on it, follow the link, change the data and replace it
2019
60%
35%
5%
2017
mercury
jupiter
venus
30%
10%
60%
mercury
jupiter
venus
PREDICTED RESULTS
5,000,000
50%
300
Saturn is the ringed one. It’s a gas giant
Neptune is the farthest planet from the Sun
Despite being red, Mars is a cold place
Electronic Sports Company Project Proposal
Here is where your presentation begins
Major requirements
02
You can enter a subtitle here if you need it
SNEAK PEEK
Insert your multimedia content here
PROJECT STAGES
Despite being red, Mars is actually a cold place. It’s full of iron oxide dust, which gives the planet its reddish cast
STAGE 1
Venus has a beautiful name and is the second planet from the Sun. Its atmosphere is extremely poisonous
STAGE 3
Mercury is the closest planet to the Sun and the smallest one in our Solar System. It’s only a bit larger than our Moon
STAGE 2
TIMELINE
STAGE 1
Saturn is a gas giant, composed mostly of hydrogen and helium
STAGE 2
Jupiter is a gas giant and the biggest planet in our Solar System
STAGE 3
Despite being red, Mars is actually a cold place. It’s full of iron oxide dust
OUR TEAM
RICHARD SMITH
You can replace the image on the screen with your own
JENNA�DOE
You can replace the image on the screen with your own
Pytania? Zachęcam do kontaktu:
pkucharczyk@technikumkreatywne.pl
KUCHARCZYK.DEV
Dziękuję za uwagę!
CREDITS: This presentation template was created by Slidesgo, including icons by Flaticon, and infographics & images by Freepik and illustrations by Stories
Źródła
Strony internetowe:
- Morele.net
- Wikipedia.pl
- UsugiWInternecie.prv.pl
- http://www.impossible3ds.com/jak-mapowac-obiekty-opis-uvw-map/
Literatura:
- Agnieszka i Tomasz Klekot “Tworzenie stron i aplikacji internetowych oraz baz danych i administrowanie nimi”, WSiP 2019
THANKS
Does anyone have any questions?
youremail@freepik.com
+91 620 421 838
yourcompany.com
Follow the project updates
Please keep this slide for attribution.
CREDITS: This presentation template was created by Slidesgo, including icons by Flaticon, and infographics & images by Freepik and illustrations by Stories
Icon pack: gaming
BUSINESS ICONS
SOCIAL MEDIA ICONS
ALTERNATIVE RESOURCES
Find more illustrations like these on Stories by Freepik
RESOURCES
VECTORS
ICONS
Find more illustrations like these on Stories by Freepik
Instructions for use
In order to use this template, you must credit Slidesgo by keeping the Thanks slide.
You are allowed to:
- Modify this template.
- Use it for both personal and commercial projects.
You are not allowed to:
- Sublicense, sell or rent any of Slidesgo Content (or a modified version of Slidesgo Content).
- Distribute Slidesgo Content unless it has been expressly authorized by Slidesgo.
- Include Slidesgo Content in an online or offline database or file.
- Offer Slidesgo templates (or modified versions of Slidesgo templates) for download.
- Acquire the copyright of Slidesgo Content.
For more information about editing slides, please read our FAQs or visit Slidesgo School:
https://slidesgo.com/faqs and https://slidesgo.com/slidesgo-school
Fonts & colors used
This presentation has been made using the following fonts:
#37474f
#455a64
#1fb299
#263238
#27debf
#7debd9
#23c7ac
#efefef
Stories by Freepik
Create your Story with our illustrated concepts. Choose the style you like the most, edit its colors, pick the background and layers you want to show and bring them to life with the animator panel! It will boost your presentation. Check out how it works.
Use our editable graphic resources...
You can easily resize these resources, keeping the quality. To change the color, just ungroup the resource and click on the object you want to change. Then, click on the paint bucket and select the color you want. Don’t forget to group the resource again when you’re done.
...and our sets of editable icons
You can resize these icons, keeping the quality.
You can change the stroke and fill color; just select the icon and click on the paint bucket/pen.
In Google Slides, you can also use Flaticon’s extension, allowing you to customize and add even more icons.�
Educational Icons
Medical Icons
Business Icons
Teamwork Icons
Help & Support Icons
Avatar Icons
Creative Process Icons
Performing Arts Icons
Nature Icons
SEO & Marketing Icons