Freya Holmér

why are splines? well my god I have good news for you, here's why splines!

if you like my work, please consider supporting me 💖
https://www.patreon.com/acegikmo

This project grew much larger in scope than I had originally intended, and burnout made it impossible for me to do more with it. It was already getting incredibly unwieldy, so I apologize in advance for not covering non-uniform splines, and the general jankiness of some parts. There are also quite a lot of places where I just talk about something without *showing* it, but since I couldn't animate it all, I opted to keep that information in rather than remove it altogether

• Lots of love to
💛 Jazz "queenjazz" Mickle for music & sounds ❱ https://queenjazz.bandcamp.com/
🐈 our children, Thor, Salad & Toast, for helping me out during recording

• How was this video made?
🔨 I made it in Unity, the game engine
⭕ Using Shapes, my vector graphics plugin ❱ https://u3d.as/1W37
📈 Using Mathfs, my math library ❱ https://github.com/FreyaHolmer/Mathfs
...along with a bunch of hacky, partially broken, procedural animation tools I made specifically for this video
💡 Striped studio skybox by ProAssets: https://assetstore.unity.com/packages/2d/textures-materials/sky/studio-lighting-hdri-pack-55154
🎥 Final editing in DaVinci Resolve

• Links
🐦 Twitter ❱ https://twitter.com/FreyaHolmer
📺 Twitch ❱ https://www.twitch.tv/acegikmo
💬 Discord ❱ https://discord.gg/v5VWuga
🌸 Instagram ❱ https://instagram.com/freya_holmer

Timestamps:

00:00:00 Intro
00:01:17 Examples of Paths

00:02:16 CHAPTER 1 - Bézier Curves
00:02:20 Lerp
00:03:16 Quadratic Bézier
00:03:54 Cubic Bézier
00:07:41 n-Degree Bézier

00:09:37 CHAPTER 2 - Bézier Splines
00:10:00 Cubic Bézier Spline
00:10:21 Spline Parameterization
00:11:01 The Anatomy of a Spline
00:11:32 Knot Values & Knot Intervals
00:12:21 Local Control
00:14:03 The flexibility of the Cubic Bézier
00:14:28 Tangent Points

00:15:07 CHAPTER 3 - Continuity
00:15:28 C⁰ (Positional Continuity)
00:16:12 Spline Derivatives
00:17:32 C¹ (Velocity Continuity)
00:20:25 C² (Acceleration Continuity)
00:21:48 Cascading Loss of Local Control
00:23:46 C³ (Jolt Continuity)
00:24:49 C∞ Continuity
00:25:19 Parametric Continuity Summary

00:26:20 CHAPTER 4 - Geometric Continuity
00:26:50 G¹ (Tangent Continuity)
00:27:46 G² (Curvature Continuity)
00:28:05 The Reflection Test
00:28:56 Seams in Circular Arcs
00:29:43 Angle Analysis
00:30:47 Curvature & The Osculating Circle
00:32:26 Curvature Combs
00:32:48 G¹ (Algebraically)
00:33:27 G² (Algebraically)
00:34:52 Geometric Continuity Summary
00:36:30 Continuity Summarized
00:38:06 Cusps

00:39:25 CHAPTER 5: The Extended Universe
00:39:40 Hermite Spline
00:43:35 Hermite ⇔ Bézier Conversion
00:44:09 Linear Spline
00:45:17 Cardinal Spline
00:48:20 Catmull-Rom Spline
00:49:33 Investigating Basis Functions
00:51:02 Basis Function Continuity Analysis
00:51:31 In Search of a C² Spline
00:53:15 B-Spline
00:56:35 Quiz Time!
00:57:12 Cubic Trajectory
00:57:37 Uniform Cubic Splines
00:59:09 Splines & Their Use Cases
01:01:37 Outro
01:02:16 NURBS
01:02:56 Color Spline
01:03:52 Credits & Freya Rambles
01:13:26 Cats helping me w. recording

The Continuity of Splines

Welcome to my three part lecture on shader coding for game devs 💖 I hope you'll find this useful in your game dev journey!

If you are enjoying this series, please consider supporting me on Patreon!
🧡 https://www.patreon.com/acegikmo

00:00:00 - What are shaders?
00:03:00 - Case study/screenshots from FFXIV, Overwatch & more
00:37:42 - The Structure of a Shader
00:42:49 - Vertex shader
00:47:09 - Fragment shader
00:49:32 - Shader vs Material
00:51:29 - A first look at shader code
01:02:17 - Vertex Normals
01:06:17 - Interpolators
01:15:59 - Data types (fixed vs half vs float)
01:21:32 - Fragment shader output
01:24:31 - Swizzling
01:33:48 - Passing data from vertex shader to fragment shader
01:42:04 - Space transformation w. Matrices
01:47:07 - UV coordinates & manipulation
01:53:34 - Gradients
02:01:06 - Values outside of 0 to 1
02:09:20 - Triangle waves using math
02:12:04 - Preprocessor constants
02:25:28 - Pattern manipulation
02:31:48 - Blending Modes
02:39:42 - Depth buffer & depth testing (ZTest)
02:56:40 - Waves, ripples & vertex offsetting
03:12:07 - Textures
03:20:33 - World space coordinates
03:28:04 - Texture masking
03:37:33 - Isotropic mip maps
03:42:17 - Anisotropic mip maps
03:44:36 - Point vs bilinear vs trilinear filtering
03:49:54 - Final questions

Project Download & Assignments: https://docs.google.com/document/d/1h_7O9n5-q8Kb-rhnMJyF4Tab6i3lH97E4Ykn7tsP-zc

Originally streamed as a course for students at http://futuregames.se/, who were super kind to let me both stream this live as well as upload it here! so massive thanks to the people at FutureGames!!

💖 Patreon ❱ https://www.patreon.com/acegikmo
🐦 Twitter ❱ https://twitter.com/FreyaHolmer
📺 Twitch ❱ https://www.twitch.tv/acegikmo
💬 Discord ❱ https://discord.gg/v5VWuga
🌸 Instagram ❱ https://instagram.com/freya_holmer

✫ Video Production by Higher Vision:
➥ https://twitter.com/HigherVision1
➤ Edited by Stelly: https://twitter.com/stelly47050876

Shader Basics, Blending & Textures • Shaders for Game Devs [Part 1]

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!
🧡 https://www.patreon.com/acegikmo

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

Project Download & Assignments: https://docs.google.com/document/d/1h_7O9n5-q8Kb-rhnMJyF4Tab6i3lH97E4Ykn7tsP-zc

Originally streamed as a course for students at http://futuregames.se/, who were super kind to let me both stream this live as well as upload it here! so massive thanks to the people at FutureGames!!

💖 Patreon ❱ https://www.patreon.com/acegikmo
🐦 Twitter ❱ https://twitter.com/FreyaHolmer
📺 Twitch ❱ https://www.twitch.tv/acegikmo
💬 Discord ❱ https://discord.gg/v5VWuga
🌸 Instagram ❱ https://instagram.com/freya_holmer

✫ Video Production by Higher Vision:
➥ https://twitter.com/HigherVision1
➤ Edited by Stelly: https://twitter.com/stelly47050876

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

🔽 Click for Timestamps & Info


It's here! The 5 hour spline-based procedural geometry stream! Enjoy~

👩‍💻 Source code / Unity project ❱ https://www.patreon.com/posts/29301827
📚 Slides ❱ https://docs.google.com/presentation/d/10XjxscVrm5LprOmG-VB2DltVyQ_QygD26N6XC2iap2A
➰ Play with a Béziér curve ❱ http://acegikmo.com/bezier/

Timestamps available below - thank you all so much for watching!!

💖 Patreon ❱ https://www.patreon.com/acegikmo
🐦 Twitter ❱ https://twitter.com/FreyaHolmer
📺 Twitch ❱ https://www.twitch.tv/acegikmo
💬 Discord ❱ https://discord.gg/v5VWuga
🌸 Instagram ❱ https://instagram.com/freya_holmer

00:00 - Intro
03:02 - Content Index
04:12 - Pre-Stream Chatting
12:38 - Structure of a Mesh
15:04 - Generating a Quad
1:08:48 - Generating a Quad Ring
3:00:20 - Béziér Curves in Flowstorm
3:15:26 - Béziér Control Points & Gizmos
3:24:45 - Constructing a Béziér Curve
3:51:12 - Béziér Space Coordinates
4:00:14 - Creating a 2D Mesh Format
4:41:32 - Extruding Along the Curve

Procedural Geometry - An Improvised Live Course

In this final lecture we dive into normal maps, tangent space, height maps and image-based lighting

If you are enjoying this series, please consider supporting me on Patreon!
🧡 https://www.patreon.com/acegikmo

00:00:00 - Intro
00:01:17 - Recap
00:10:34 - Multi-light support (assignment 2)
00:14:48 - .cginc include files
00:21:18 - Multiple passes
00:24:20 - Macros
00:25:15 - Unity's lighting macros
00:47:05 - Questions
00:49:45 - Garden of the sea example 
00:54:39 - Color/Albedo texture
01:00:10 - Normal maps & tangent space
01:27:51 - Questions
01:44:00 - Normal map intensity
01:46:43 - Height/Displacement maps
01:58:18 - Vertex shader texture sampling
02:01:29 - Vertex offset & mesh normal caveats
02:07:29 - Questions
02:24:47 - The importance of ambient light
02:26:18 - Basic ambient light
02:29:35 - Image-based lighting (IBL)
02:33:50 - Skybox shader
02:36:46 - Rectilinear skybox sampling
02:42:00 - Diffuse IBL
02:52:02 - Specular IBL
03:10:23 - Outro

Project Download & Assignments: https://docs.google.com/document/d/1h_7O9n5-q8Kb-rhnMJyF4Tab6i3lH97E4Ykn7tsP-zc

Originally streamed as a course for students at http://futuregames.se/, who were super kind to let me both stream this live as well as upload it here! so massive thanks to the people at FutureGames!!

💖 Patreon ❱ https://www.patreon.com/acegikmo
🐦 Twitter ❱ https://twitter.com/FreyaHolmer
📺 Twitch ❱ https://www.twitch.tv/acegikmo
💬 Discord ❱ https://discord.gg/v5VWuga
🌸 Instagram ❱ https://instagram.com/freya_holmer

✫ Video Production by Higher Vision:
➥ https://twitter.com/HigherVision1
➤ Edited by Stelly: https://twitter.com/stelly47050876

Normal Maps, Tangent Space & IBL • Shaders for Game Devs [Part 3]

🔽 Click for Timestamps & Info


This is a several hours long improvised live introductory course to shader coding in Unity! It has been slightly edited in the beginning to remove useless info and me messing around with the mic. The rest is the stream in its fullest!

Timestamps available below!

💖 Patreon ❱ https://www.patreon.com/acegikmo
🐦 Twitter ❱ https://twitter.com/FreyaHolmer
📺 Twitch ❱ https://www.twitch.tv/acegikmo
💬 Discord ❱ https://discord.gg/v5VWuga
🌸 Instagram ❱ https://instagram.com/freya_holmer



2:00 - Pre-stream chatting

Part 1: The Basics
28:53 - Shader vs Material
35:27 - Anatomy of Shaders
58:32 - Shader Code
1:09:20 - UV Coordinates
1:34:00 - Normals

Part 2: Diffuse Lighting
1:48:05 - Lambert Shading & Dot Product
2:15:05 - Tonemapping & HDR
2:21:33 - Properties & Surface Color
 
Part 3: Specular Lighting
2:30:30 - View Vector & World Position
2:48:38 - Phong BRDF & View Reflection
3:00:58 - Gloss & Interpolators

Part 4: Manipulating Values
3:26:36 - Cel Shading & Thresholding
3:31:40 - Lerp, Inverse Lerp & Posterization
3:55:13 - Passing Data to Shaders
4:07:30 - Waves & Time

Part 5: Showcase
4:31:29 - Water in Garden of the Sea
4:37:03 - SDF Raytracing in Garden of the Sea
4:41:53 - SDF Raytracing of a Fractal
4:48:40 - Flowstorm Gameplay
4:50:24 - Flowstorm Level Editor

Intro to Shader Coding in Unity - An Improvised Live Course

🔽 Click for Timestamps & Info


This is from the improvised tutorial stream on core math concepts in game dev!
Timestamps at the bottom of the description~

Also, a little note: when drawing the curve for tan(x) I accidentally drew the sec(x) curve! Apologies for that!

Anyhow, enjoy!

💖 Patreon ❱ https://www.patreon.com/acegikmo
🐦 Twitter ❱ https://twitter.com/FreyaHolmer
📺 Twitch ❱ https://www.twitch.tv/acegikmo
💬 Discord ❱ https://discord.gg/v5VWuga
🌸 Instagram ❱ https://instagram.com/freya_holmer

00:00 - Intro
22:01 - Scaling & Ratios
46:04 - Vectors & Dot Product
1:54:45 - Trigonometry
2:30:05 - Degrees & Radians
2:52:32 - Cross Product
3:07:03 - Local vs World Space & Transformation
3:20:27 - Lerp
3:33:45 - Derivatives
3:46:35 - Framerate Independence
3:55:28 - Outro

Math for Game Dev - An Improvised Live Course

triangles - are they for you? find out in this angular journey through trigonometry

If you are enjoying this series, please consider supporting me on Patreon!
🧡 https://www.patreon.com/acegikmo

00:00:00 - Intro
00:01:10 - Asgmt. 4 solution (Bouncing laser)
00:09:36 - Asgmt. 5 solution (Mesh surface area)
00:30:28 - Asgmt. 6 solution (The turret)
00:44:31 - Angles
00:50:43 - Radians
01:01:47 - Cosine & sine
01:20:14 - Tangent
01:47:24 - Angle to vector
01:51:17 - Vector to angle
02:04:07 - Angle between vectors
02:25:31 - Questions 
02:31:46 - Solving triangles
02:38:48 - Camera FoV example in unity
02:52:19 - Determinant

Assignments:
Asgmt. 7 (Regular Polygons)
Asgmt. 8 (Adaptive FoV)
https://docs.google.com/document/d/1Nou1ZAbNOkELggW9YqZ9LTRIW9Hc-isUpURbQ8gjiMM

Originally streamed as a course for students at http://futuregames.se/, who were super kind to let me both stream this live as well as upload it here! so massive thanks to the people at FutureGames!!

💖 Patreon ❱ https://www.patreon.com/acegikmo
🐦 Twitter ❱ https://twitter.com/FreyaHolmer
📺 Twitch ❱ https://www.twitch.tv/acegikmo
💬 Discord ❱ https://discord.gg/v5VWuga
🌸 Instagram ❱ https://instagram.com/freya_holmer

✫ Video Production by Higher Vision:
➥ https://twitter.com/HigherVision1
➤ Edited by Stelly: https://twitter.com/stelly47050876