Healthbars, SDFs & Lighting • Shaders for Game Devs [Part 2]

where we take a look at creating the healthbar from the assignment, and learn about SDFs and lighting!

If you are enjoying this series, please consider supporting me on Patreon!

00:00:00 - Healthbar assignment 1a
00:25:09 - Healthbar assignment 1b
00:30:20 - Healthbar assignment 1c
00:40:20 - Questions
00:42:34 - Healthbar assignment 1d
00:56:38 - Questions (during break)
01:01:03 - Healthbar assignment 1e
01:18:57 - Healthbar rounded edges
01:49:08 - Healthbar border
02:01:28 - 3D SDF raymarching showcase
02:02:50 - How SDF raymarching works
02:07:01 - Questions
02:08:29 - Lighting
02:28:48 - Questions
02:12:35 - Diffuse light (Lambert)
02:32:10 - Specular light (Phong)
02:49:10 - Questions during break
02:50:32 - Specular light (Blinn-Phong)
02:58:16 - Gloss remapping
03:02:14 - Compositing (putting it all together)
03:07:31 - PBR & BRDFs
03:11:28 - Energy conservation
03:18:12 - Questions
03:21:53 - Forward vs deferred rendering
03:24:11 - Fresnel glow effect
03:29:00 - Assignment 2

✫ Video Production by Higher Vision:

[tinarina_xo]

anyone else keeps waking up to this? 😂

[rayurebob]

it's mindblowing to have access to this kind of ressources for free. Thank you !

[Mfifn]

Guys ive been waking up to this vid a lot recently and i thought it was just some strange recourring dream that i kept having but its real??? And other ppl are waking up to it too???

[MAP]

1:47:33 when using the clip function, the whole process of actually using the signed distance field properly becomes very opaque, because it's doing the most important step of the whole process (aka Anti-Aliasing at any resolution) without telling us how.

[trejkaz]

54:07 This behaviour of where the sampler takes the sample is easier to think about if you think of a smaller texture, say 2 x 2 texels.

There will be 2 texels stretched across from left to right, but 0.0 is still all the way to the left and 1.0 is still all the way to the right. So no of course 1.0 wouldn't sample in the middle of the texel - in this case you'd need to sample at 0.75 to get that.

For me, this became clear when I tried to implement a shader which cut the texture into multiple sprites, because when you do that, you end up with the same bleeding happening there and have to work around it in your own code by grabbing the texel size from _MainTex_TexelSize and manually clamping your values to the middle of the texel.

[elin]

Really appreciate you uploading these videos here on youtube too, they're fantastic!

[ManSpidernater]

Thanks for making this series. It's really not obvious where people learn this stuff without having done heaps of high level mathematics

[arseneysorokin]

I was trying to learn this for literally years! Watching these videos I understand what is happening for the first time!
You are a great teacher! Thank you very much for this.

[zeescorpio]

Your content is like a goldmine for me currently watching and practicing on repeat. Shader is something i struggle with. But your way of explanation and teaching is superior to anything i have ever seen about shaders. Thank you for you invaluable content.

[maixicek]

Finally YouTube recommends interesting channel. Thank you for video!

[ismaelomaribanez]

Great class Freya. Thanks for all your time and effort. Please do continue with this series! :)

[aloea]

I encountered a problem in the Phone Lighting code, that _WorldSpaceLightPos0 is always “0” and cannot work. Upon checking, I found that this is because I previously set the [Skybox Material] in the Environment settings of the scene to "None". Can someone explain the reason for this problem or provide some relevant information? Thank you !

[bigmistqke]

I love how elegant lambertian light is. Just a line of code.

[kelna]

This is like a full semester of college shader programming in two videos. Thank you so much!

[renatusdev]

I think the lil issue on the first assignment was a good thing. It made me kinda reflect on reasons why it wouldn't work. Then I figured that maybe the first and last pixels of the texture where different; AND THEN BOOM. Fixed. So yeh. (dunno if that was the actual issue but i assumed as much). I now got that error catcher on my toolshed. anywho' round 2 les go

[wootlord]

Yet another video i woke up to an hour through it.

[r.macedo]

18:00

Just a "bit-brushing"

float _Health;
static const float2 _Color = float2(1-_Health, _Health);

[Kabra]

This is gonna be crucial knowledge to me shortly (working on a fighting game atm). Cheers from NZ!!!

[ZedPoirier]

You floored me at 13:01, wrinting in yellow! Great lessons!!!

[dipayond]

You are AWESOME ... All this amazing content for free !!!