It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf ·...
Transcript of It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf ·...
![Page 1: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/1.jpg)
It’s Just Data!The Wonderful World of Shaders
Daniel S. Buckstein
VT Game Developers Meetup
Feb. 22, 2018
Daniel S. Buckstein
![Page 2: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/2.jpg)
Hello World
Dan “ShaderMan” Buckstein
Assistant Professor, Champlain
College (Game Programming)
– M.Sc, Computer Science, UOIT
– B.IT, Game Development & Entrepreneurship, UOIT
– Favourite games: Dragon Quest I-VI, Super Mario 64, Banjo-Kazooie
Daniel S. Buckstein
![Page 3: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/3.jpg)
What are we talking about?
• The technical yet cross-discipline perspective.
• Not really shaders for Unity, Unreal, Maya...
1. “It’s just data!”
2. Shaders are for everyone
3. Tricks of the trade
Daniel S. Buckstein
![Page 4: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/4.jpg)
How much is there to discuss?
• This talk:
45-ish minutes
• Graphics curriculum in EGP at Champlain:
90 – 135 cr. hoursDaniel S. Buckstein
![Page 5: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/5.jpg)
My First Shader
• CircaFeb. 20-something, 2011
• I was bored.
Daniel S. Buckstein
![Page 6: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/6.jpg)
What are shaders?
Daniel S. Buckstein
https://www.lri.fr/~mbl/ENS/IG2/docs/opengl-stm.pdf
![Page 7: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/7.jpg)
What are shaders?
• Shaders are the “programmable” in “programmable pipeline”
Daniel S. Buckstein
http://www.3dgep.com/wp-content/uploads/2014/02/OpenGL-4.0-Pipeline.png
Data input/output (API/framebuffer)OpenGL-controlled process
Shader: programmer-controlled process
Don’t forget me…
![Page 8: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/8.jpg)
What are shaders?
• Shaders are the “programmable” in “programmable pipeline”
• A chain of shaders is called a shader program
– E.g. VS TCS TES GS FS
– E.g. VS GS FS
– E.g. VS FS (most popular)
– E.g. VS (minimum requirement)
– E.g. CS (must be standalone)
Daniel S. Buckstein
![Page 9: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/9.jpg)
What are shaders?
• Well-known shading languages:
• Cg: C for graphics (Nvidia) rip
• HLSL: High-Level Shading Language (v6.0)
• GLSL: The OpenGL Shading Language (v4.6)
• Metal: Apple’s proprietary language (v2.0)
• SPIR-V: Vulkan’s core language (v1.0)
Daniel S. Buckstein
![Page 10: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/10.jpg)
Daniel S. Buckstein
![Page 11: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/11.jpg)
The one rule to rule them all:
It’s just
data!Daniel S. Buckstein
![Page 12: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/12.jpg)
It’s just data!
• A shader program eats raw data:
• API defines geometry, stores it in vertex buffer
• Vertex shader reads this only as you tell it to!
Daniel S. Buckstein
Data in interleaved VBO:
𝑝0𝑥 𝑝0𝑦 𝑝0𝑧 ො𝑛0𝑥 ො𝑛0𝑦 ො𝑛0𝑧 𝑢0 𝑣0 𝑝1𝑥 𝑝1𝑦 𝑝1𝑧 ො𝑛1𝑥 ො𝑛1𝑦 ො𝑛1𝑧 𝑢1 𝑣1
“position” “normal” “texcoord”
The first vertex (all of it!) The second vertex…
![Page 13: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/13.jpg)
It’s just data!
• A shader program also outputs raw data:
Off-screen render pass(assume same size as display)
DepthBACK BUFFER (main target)
Daniel S. Buckstein
![Page 14: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/14.jpg)
It’s just data!
• Shaders are fancy data readers and writers.
• They are crazy fast.
• And they don’t give a damn.
Daniel S. Buckstein
![Page 15: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/15.jpg)
What can shaders do?
• The misnomer: a shader does not “shade”
• Its true purpose is to manipulate data
Vertex shader Vertices (mesh data)
Tessellation Mesh detail (LOD)
Geometry Primitives (multiple VS)
Fragment Framebuffer (“color”)
Compute Whatever you want
Daniel S. Buckstein
![Page 16: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/16.jpg)
What can shaders do?
• Sprite sheet animation vertex shader
• Mesh deformation vertex shader
• Particles geometry shader
• Stereo 3D/VR parallel geometry shader
• Any and all shading fragment shader
• Post-processing fragment shader
• Anything and everything compute shader
Daniel S. Buckstein
![Page 17: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/17.jpg)
What can shaders do?
• Compute is easier than it sounds…
Daniel S. BucksteinCourtesy of Michael G.
![Page 18: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/18.jpg)
Who cares about shaders?
• Programmer: build the framework, feed data
• Artist: manipulate data to make pretty things
• Designer: high-level code… you can code too!
• Producer: graphics player $$$$$
• Other: simulation… film… stage… audio…
Daniel S. Buckstein
![Page 19: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/19.jpg)
Who cares about shaders?
• Engines and editors (e.g. Unity, Unreal, Maya) write the shader programs for you…
• …anyone can define the “materials”:
Daniel S. Buckstein
![Page 20: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/20.jpg)
How do we manipulate data?
• Why should I tell you…
Daniel S. Buckstein
…when I can show you?
![Page 21: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/21.jpg)
Conclusion
• What does my future hold???
• What does your future hold???
Better graphics.
Better games.
Daniel S. Buckstein
![Page 22: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/22.jpg)
Conclusion
• Where can you get started?
• www.kickjs.org VS & FS
• www.shadertoy.com only FS
• Check out some other people’s work: • Pac-Man: https://www.shadertoy.com/view/Ms3XWN
• Doom: https://www.shadertoy.com/view/lldGDr
• Others: https://shadertoyunofficial.wordpress.com/2017/11/11/playable-games-in-shadertoy/
Daniel S. Buckstein
![Page 23: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/23.jpg)
Conclusion
• Where can you get started?
• Learn some math.
• Read a book.
• Just do it.
Daniel S. Buckstein
Vectors, matrices, quaternions.
OpenGL SuperBible, Real-Time Rendering
![Page 24: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/24.jpg)
Conclusion
• It’s just data…
• Communication with the GPU is key.
• Get busy, there’s so much to do!
Daniel S. Buckstein
![Page 25: It’s Just Data! The Wonderful World of Shadersseawisphunter.com/pdf/dan-buckstein-shaders.pdf · 2018. 3. 15. · It’s just data! •A shader program eats raw data: •API defines](https://reader035.fdocuments.in/reader035/viewer/2022063019/5fde546f2cef2318e54396ec/html5/thumbnails/25.jpg)
The end.
• Questions? Comments? Concerns?
Daniel S. Buckstein