Fantasy Health Meter Part 5 - Procedural Shapes and Patterns - Episode 23
Ben Cloward
Dec 12, 2024 16:00
Create an account to hide videos, mark them watched, or save them to Don't Miss.
Create an account to hide videos, mark them watched, or save them to Don't Miss.
Create an account to hide videos, mark them watched, or save them to Don't Miss.
In this shader tutorial, we finish off the series of videos on creating a Diablo-style health meter by adding animated bubbles to the liquid in our crystal vial. We also add an alpha channel so this UI element can be transparent.
Here's the code for the hash function:
uint2 v = (uint2) (int2) round(In);
v.y ^= 1103515245U; //Xor equal
v.x += v.y;
v.x *= v.y;
v.x ^= v.x >> 5u; //right bit shift
v.x *= 0x27d4eb2du;
Out = (v.x >> 8) * (1.0 / float(0x00ffffff));
Unfortunately, YouTube won't allow me to use angled brackets (greater than, less than symbols) in a description, so in the code above where it says > (on the fifth line and the seventh line) you'll need to replace that manually with a greater than symbol.
------------------------------------
Subgraph/Material Function Index:
Gradients
LinearGradient - https://youtu.be/sZBzg-v9d04?si=QDiy1CsgW-mMVsUJ&t=251
SampleGradient - https://youtu.be/rSn7lUWUN0E?si=WPlixz4L8prnV32G&t=2223
Sphere Gradient - https://youtu.be/d3VNolKJ_bw?si=Z6uaqA92_sClqpv-&t=85
Helpers
AntiAliasing - https://youtu.be/sZBzg-v9d04?si=yJwmNYRkhzW4JFiP&t=761
AspectRatio - https://youtu.be/fDjEq30dwNM?si=5iScu5SYD9shcxkh&t=1758
Gradient - https://youtu.be/rSn7lUWUN0E?si=bMv1Wk0DYGsHV2Ty&t=2200
HistogramScan - https://youtu.be/nj7kKHr8QNM?si=-3Odzad3nCI_eNsm&t=290
Mirror - https://youtu.be/jxr4YK_m8hc?si=WsT2TJjLEqPQbKsC&t=835
Posterize - https://www.youtube.com/watch?v=lfY0v4q2dtw&t=1408
RoundedCorners - https://youtu.be/fDjEq30dwNM?si=Znv2wk6lcJDL1R2T&t=1254
Patterns
Animated Cloud Pattern - https://youtu.be/qB8GKIWKOp4?si=Zz_sp2E1yR9JPVvJ&t=1136
AnimatedSheen - https://youtu.be/jxr4YK_m8hc?si=OO1tL6VqiPE3kVo_&t=70
Bars - https://youtu.be/rSn7lUWUN0E
CircleSegments - https://youtu.be/CXY7RNwokPU?si=igwTDBogjSz4KwoM&t=56
SquareTiles - https://youtu.be/ChaXcYB4xvQ?si=dye3PAsDSxVCe8Yo&t=657
SDFs
Circle - https://youtu.be/GMQym0in8OY?si=X9tSSWsdCwoKvPKy&t=316
Rectangle - https://youtu.be/fDjEq30dwNM?si=6pataNA5gQySVmQl&t=89
Operators
SDFUnite - https://youtu.be/R_5CTBgkfZ0?si=sy2t2ppeTviChNog&t=114
Time
LinearTime - https://youtu.be/jxr4YK_m8hc?si=P80Q0RBWMcmiKRG6
SineTime - https://youtu.be/R_5CTBgkfZ0?si=m6nMyzw7Pb76hPnq&t=1420
UV
GridTiles - https://youtu.be/ChaXcYB4xvQ?si=NO-_A1AL92GrWCs2&t=121
Move - https://youtu.be/R_5CTBgkfZ0?si=5aMYA2ocVdqHzdQj&t=1010
Perspective - https://youtu.be/rSn7lUWUN0E
Polar Coordinates - https://www.youtube.com/watch?v=lfY0v4q2dtw&t=1011
Scale - https://youtu.be/6UYqtdRoKQ4?si=eVy6RFwycKjYaH4r&t=602
Tilt - https://youtu.be/jxr4YK_m8hc?si=RyE0GLt0BzDH0w6q&t=207
Here's last week's video on how to add ripples to the top of the liquid:
https://youtu.be/Ki2X2F31cGc
Here's the playlist for the whole series:
https://www.youtube.com/playlist?list=PL78XDi0TS4lF5ASo3vpUFKenMkhMVeZ5y
Shader Book Recommendations
https://www.bencloward.com/resources_books.shtml
------------------------------
Theme Music
Peace in the Circuitry - Glitch Hop
http://teknoaxe.com/Link_Code_3.php?q=1526
Background Music
Speo - The Little Things
https://www.youtube.com/watch?v=kvCYuyyLgC0
#UnrealEngine #shadergraph #Unity
Education
#UE4
#UE5
#Unreal
#Unreal Engine
#Unity
#shader
#material
#material editor
#game development
#real-time
#tutorial
#training
#graphics
#3d
#GPU
#tech art
#computer graphics
#fundamentals
#shader graph
#patterns
#shapes
#meter
#sphere
#bubbles
#circle
#distortion