> temp > à-trier > painting-a-selfie-girl-with-maths-raymarching-in-sdf-inigo-quilez

Painting a Character with Maths

Inigo Quilez - 2020-11-28

Today we are painting a cartoon character using mathematics.
Support this channel by subscribing or joining my Patreon: https://www.patreon.com/inigoquilez

This is the link to the real-time rendering code (that you can edit yourself live) for the painting: https://www.shadertoy.com/view/WsSBzh
 
Links I mentioned in the video I'd leave here:
* Raymarching: https://iquilezles.org/articles/raymarchingdf
* SDF of a Line Segment: https://www.youtube.com/watch?v=PMltMdi1Wzg
* Smoothstep: https://youtu.be/bdICU2uvOdU?t=3423
* SDF of a Rounded Box: https://www.youtube.com/watch?v=62-pRVZuS5c

Donate: http://paypal.me/inigoquilez
Subscribe: https://www.youtube.com/c/inigoquilez
Support: https://www.patreon.com/inigoquilez
Twitter: https://twitter.com/iquilezles
Facebook: https://www.facebook.com/inigo.quilez

0:00 Sculpting basic shape
3:45 Blocking basic lighting
6:20 Sculpting face
8:50 Painting face colors
11:38 Eyes
12:55 Face animation
14:58 Hair
16:15 Makeup
17:00 Hoodie
18:42 Background
19:46 Bridge
20:58 Trees
22:22 Finishing
23:21 Conclusion

Music by Bent Stamnes (https://twitter.com/gloom303)

IronWarlord - 2021-03-09

"Jack, I want you to paint me like one of your French girls."
"Alright."
*pulls out TI-83 calculator*

Alistair Stewart - 2021-09-10

hello, my name is Inigo Quilez. You saw my shader. Prepare to cry

Elvis Chege - 2022-04-21

😂

Sergiu - 2022-04-21

😄

lucutes - 2022-04-22

Nerd lol

Hong C Zhu - 2020-11-28

I googled how to feel stupid and this video showed up.

Zan Wright MFWR - 2022-04-29

@Kacper Ozieblowski Ok professor, I have another hypothesis. What if, they're not college students?

بِلَاد ٱلرَّافِدَيْن بِلَاد ٱلرَّافِدَيْن - 2022-04-29

@ThanoSalt no one cares

Jello - 2022-05-11

@ThanoSalt most people here haven't gone back to this type of math in years so yeah you'd probably have a better understanding than a lot of people in this comment section because you're still learning

Amuh - 2022-05-11

@ThanoSalt well then you're exposed to math early on and learnt it in a good method.

Tim White - 2021-03-07

Teachers in high school: Are you an 'arty kid' or a 'maths kid'?

Inigo Quilez: ...Yes

Roxor128 - 2021-10-03

I think my mother would have the same answer. She taught maths in her younger days and teaches art now.

Adam Appleseed - 2020-12-11

It is EXTREMELY satisfying seeing linear algebra concepts being used in something other than textbook notes.

Jasssk Master - 2022-04-20

@No Delay For Days the guy who made the video can do this be cause he paid attention in school and was willing and passionate to study... you can't expect everything to be done for you in the class room. school presents you with the topics, it's your job to put in the effort to study them

X - 2022-04-21

@Jasssk Master Not everyone has to be like him, but alot end up hating math (me included) because they feel bored looking at text books with numbers every single week for years! Doing the same tasks over and over again. Generating paintings and animated 3D models in a math class is much much more interesting for teenagers and they understand better what boring numbers can achieve. Including small robots, which you can program is also nice :) Kids want to see a real result, not just a double underlined number.

Sean Pulga - 2022-04-22

@X true

XennOnBeat - 2022-04-25

@X idk everyone is different ig, I personally found math fun, granted repetition can be boring but mainly helps will skill consolidation

ŦŘΔŞĦ - 2022-04-28

yea tbh if i see how its being used in sum useful thats when i'll have 100% interest

Mazeyar Moeini - 2020-11-28

This is math, computer science and extreme artistic talent.

metacob - 2020-11-30

I just realized that while I could probably learn the math and programming behind this in a reasonable amount of time, the artistic part is beyond me... and I couldn't draw a character with fashion sense since I don't have any of that either.

Alexander Sannikov - 2020-12-17

This might look like a lot of maths, but to be honest it's pretty simple, at least once you do enough of it. Artistic talent to use that math to build something that looks so organic though, that is absolutely next level.

Alexander Sannikov - 2022-04-21

@X if 5% of world population can understand it, it means it's pretty trivial by professional standards. just for comparison, probably only every 100th of those 5% also has an artistic ability nowhere near enough to create something like this art-wise. i'm saying this as someone who works in computer graphics industry.

Tomas Garza - 2022-04-16

That is insane.

You could make a character generator, not only a cheap tool that swap eye/nose/mouth assets and create different combinations, but a true generator from just parameters.

Then in computer games we only need to store the seed which contains the parameters for it instead of the 3D asset and textures, you could even crossover parameters of 2 individuals to create a true children of 2 characters.

Anyways this is insane

Casper van Battum - 2022-04-21

This is not exactly true. The issue is that this whole image is approximated 3D, not rendered 3D. It just creates the illusion of 3D but it is actually built from 2D building blocks. Rotating it is going to be a pain in the ass. Vertices are much easier and also much much faster. Now, you can reproduce the same effect using procedurally generated vertices too, so it's not entirely out of the question. Still takes a lot of performance, but it's certainly possible.

Bow Truckle - 2022-04-21

@Casper van Battum I think, that you could calculate the values for the animations once and store them in a file, so you don’t have to calculate them every single time, which would lead to an increased performance. We only don’t know how much. Any thoughts on that?

Casper van Battum - 2022-04-21

@Bow Truckle yeah that's what I was thinking too. Even just storing the calculated vertices in RAM until a change is made, because you really don't want to be doing all those calculations each frame. Note that a 3D model requires even more calculations than just this painting. The one thing I'm scared of is write times. Even writing to RAM can cause significant lag spikes...

Inigo Quilez - 2022-04-21

This is all full 3D, and rather trivial to rotate, spin around etc. All my paimtimg session was in 3D actually.

Tomas Garza - 2022-04-22

@Bow Truckle Games read heavy files and loads them into RAM during loading screens. For animations... animations arent actually that bad in terms of storage since only a few keyframes are necesary and the rest are interpolated. But since the 3D model would be generated in this case, you would need an algorithm to map the vertices with the armature during loading time which sounds hard, but Blender already has this feature so its doable.

verydump • 27 years ago • edited - 2021-01-17

"Well, the formula itself is build from highschool mathematics actually, it's nothing too complicated in it"

Excuse me?

Tomas Garza - 2022-04-16

Yeah its not complicated at all if you are a math genius.

Which I am not :(

Sebastian Krzyszkowiak - 2022-05-01

Did you find something in there that is not?

draconfir - 2022-05-02

@Sebastian Krzyszkowiak differential calculus

Devin McCall - 2022-05-02

@draconfir I learned that in high school.

Sebastian Krzyszkowiak - 2022-05-03

@draconfir Ah right. It does count as high school math in some places, but not everywhere.

yavnrh - 2020-11-28

Next video: How I made this video. (It's really impressive that every step of the way is animated and visualized. That's an effort to capture all that.)

Crystal Bit - 2020-12-20

​@Inigo Quilez I would be glad to pay only for that single content :)

PythonPlusPlus - 2020-12-23

Step 1: Solve Collatz Conjecture

ralusek - 2021-03-05

@Inigo Quilez I can't wait for the meta-meta-tutorial.

Didier A. - 2021-08-13

I'd be interested, the first thing I thought was how was this video made?

ksotar - 2021-12-26

Just unbelievable! I would very much like to know how it was done with all additional animations, transitions and explanations.

Ksem Almazov - 2020-11-30

Excuse me, but hooooly fuck that's impressive! I'm 6 years in 3d tech and programming professionally, and this just looks like some magic to me, even though I understand what's going on....Good job, Inigo, you are such an insiration for many people like me!

The Art of Code - 2020-11-28

That's some awesome stuff Inigo. A true masterpiece!

Inigo Quilez - 2020-11-28

Thanks Martijn!

Erika Lucas - 2020-11-28

I love that you're doing these sorts of videos for more and more advanced SDFs, I loved your previous tutorials but modelling a human face is so much more detailed and precise, you've really outdone yourself. It's always amazing to see this kind of care being put into procedural art!

Inigo Quilez - 2020-11-28

Thanks! I think I'll alternate between the basic SDF tutorials (deep dives into the equations) and these less tutorial-like but more making-of style more complex SDF work.

Morgan Allen - 2022-04-24

​@Inigo Quilez I remember a landscape-modelling program that was moderately popular back in the 2000s called Bryce that used similar principles related to fractal/procedural texture and geometry generation (and composition of simple solids), but had a much friendlier interface than was typical from other 3D modelling software. Have you ever considered putting together something similar in terms of a UI for non-mathematicians and/or people who aren't as big on shader programming?

The Inscrutable - 2020-12-10

I know math. Most of those formulas that you've presented I've seen at one time or another. I've even examined ray tracing code (a friend did a thesis on ray tracing - back in the day when it was still a new idea). But the application to art demonstrates an understanding of the math that I've never approached.
Your work is amazing.

Anders Malm - 2020-11-28

This is insane, do you see the world as a large sdf?

Layke Findley - 2020-11-30

Now you are beginning to see the matrix. ;)

Peter Sobieraj - 2020-11-28

Each sentence that you said in this video require many hours or days of work to do. And it's almost 25min video.
And for most elements you make animation demonstrating how it's created. Which had to be time consuming.
Thank you.

HIDPCM - 2020-12-21

WHAT!!!! I know everything we do in 3D works by maths, but I never see someone doing it by "hand" with such a beautiful result!! Jaw dropping!

John Cook - 2020-12-03

This is amazing work. I wish I had seen something like this when I was in school learning maths, it really would have motivated me to dig in and learn more.

Ana Coolkid - 2020-12-13

I think most really exciting, interesting applications or areas of math take a long time and a deep background in basic math to understand. And that’s really the goal of high school math - to give you a solid foundation so you can then go on and understand all this other complicated stuff.

However, I do agree with you that these sort of demos/applications should be showed to high schoolers to motivate them! If I knew in school how exciting and amazing math could be, it would certainly have motivated me to dig in an learn more like you said.

David Bravo - 2020-11-30

I'm speechless. What kind of mathematical wizardry is used to do that? That's is a true genius work there, congrats. You make me want to re-study some of those long forgotten concepts. Brilliant, Iñigo.

YiamiYo - 2020-11-28

I believe this explanation with all the animations took you longer than the painting itself. You're awesome, man! Very clear representation of each step.

Inigo Quilez - 2020-11-28

You are right in your believe, yes

Briedys101 - 2020-11-28

This is the best example of how math should be taught !

Jikku Jose - 2021-05-16

My dear friend!!! I am near tears, I really didn't think you were serious when you showed the first image and mentioned that you will create it! Out of words looking at the result!! I can't imagine the effort that went into creating that video! Just blown off!!!

Gfdgdfgdfgdfg Gfdgdfgdfgdfg - 2022-04-21

Because this image is generated by just one function, this would be very useful for AI training. In the future I can tell an AI what type of movie I want and it could render it.

Diego F. Goberna - 2020-11-28

We already knew for years you are incredibly talented with "mathmagics", but the amount of craft and dedication you are showing with these tutorials is outstanding. Thanks man, respect!

Aman Kumar - 2020-11-28

I already love proceduralism and this was a treat to my eyes and the brain. I loved how you included every single detail.

Mohammad Heidari - 2020-12-02

Never saw something similar to this anywhere. truly amazing. thanks for sharing

Patrick Hogenboom - 2020-11-30

We are so lucky that a master like Inigo is willing to educate us
Inigo, thank you for your generosity

Jiffi Joff - 2022-04-06

After about 25 years of computer science and computer graphics I feel unworthy after watching this video... Left me speechless. ❤️😊

KCG - 2020-11-28

I love these animations explaining everything visually! this is so helpful!

25knightcrawler - 2020-11-28

This is truly a masterpiece! You not only have an incredible talent for making such paintings with math but you are an excellent teacher as well. I loved how you break down the entire process with the help of animations. It would be very difficult for a beginner to know what goes into such a painting by just looking at the code so thank you for sharing this with the world. I can't even begin to imagine the amount of effort you would have had to put in to create this video.

howiemnet - 2020-11-30

Good heavens. This is astonishing. And incredibly well explained and illustrated. Well done and thank you!

Vale Tosco - 2022-04-29

This is unbelievable, I've never seen it done like this, excellent presentation of the video btw. Amazing work!

Soulztorm - 2020-12-10

Amazing work as always!
The thing I find even more impressive is how you made this video in the first place.
I Imagine in addition to all of the animations for the scene itself, you also animated all of the tutorial-esque steps as well and rendered them with raymarching?
Keep it up, love your stuff!

Inigo Quilez - 2020-12-10

That's exactly right, the video itself is a mathematical video in a shader

Seb Kean - 2020-12-12

Every video you release just blows my mind! I think I have read most of the articles on your website, and have written quite a few ray marchers using different techniques from it, but these videos do such a beautiful job of illustrating exactly what each of these functions actually does. Both your videos and the knowledge you freely share with the community is an inspiration! And, to top it off, you really have an artists eye. Sculpting characters is difficult enough with regular tools( blender, etc), but to do it from such a technical perspective is really something else! Please keep up the great work!

experiment0003 - 2022-04-22

Just when you think you're getting somewhere with your coding journey, you come across someone like this that sets you back 20 years!

Robin Seibold - 2020-12-01

This is amazing! Loved every minute of it.

GamingRevenant - 2020-12-06

I lost it when the numbers became letters... 😂 In all seriousness, this is beyond my ability of understanding. Pure magic.

John De León - 2020-12-11

@Soken50 Yeah, we sound like that when speaking English. That, and the fact that I know he's Spanish :)

Soken50 - 2020-12-11

@John De León Interesting, I'm French so I've heard Spanish speakers on occasion as they're bordering us but I wouldn't have recognised the accent here ^^'

Nikolas Pattakos - 2020-12-15

@Soken50 On his web site it says that he is Spanish/Basque and grew up in San Sebastián :) That said, the equations are not really difficult, they are indeed high school level. In my opinion however only very gifted students or people who achieve a higher/deeper level of understanding can use them like he does. Nowadays it is "easy" to begin understanding if you start plotting each one of them and experimenting with function composition (there are a number of web pages that offer online function plotting)

BSC - 2020-12-30

@Soken50 concerning his accent I believe it might not sound very Spanish cos he has been living in the USA for a while.

Jaba Adams - 2021-01-29

Really, it's not -- maybe just for now. It's like learning a foreign language. When numbers turn into letters, it's because you want to say something about any number, not just a particular number. This is the beginning of algebra. So if I wanted to say "any number plus 0 is just the original number", I could say 1 + 0 = 1, and 2 + 0 = 2, and 100 + 0 = 100, and .... but I can't explicitly list or name all the numbers. So instead I might say "if we let the letter 'a' represent any number, then a + 0 = a." It sounds a bit weird at first to talk about the "number" a, but you get used to it. So "a + 0 = a" is a RULE that applies to all numbers. As long as you choose the same number for a on the left and right hand side of the equation.

Regarding his use of the word "gradient". This is a more general version of the slope of a line or curve. In high school, you might have heard the word "derivative". In non-English speaking countries they'll often call that the "gradient". In English, we don't call it the gradient, unless it's in 2D or 3D or beyond. Think of a hilly terrain. Imagine you're standing at some point on that terrain. The gradient is the direction in which the height of the terrain increases most steeply. Once we're talking about 2D surface in 3D space, we see that the change in height from where I'm standing to immediately adjacent points could have an amount (+ for up and - for down) but also a direction. Shading relies on curvature of surfaces, and gradients are a natural way to express / compute local curvature.

MastadonMounds - 2020-11-28

this is so cool, thanks, you've been a big inspiration for many years now!

rexyduplex - 2020-11-30

Sin palabras. ¿Por qué no se enseñarán las matemáticas de esta forma tan estupenda? Es pura belleza y aplicación práctica.

Jan Myburgh - 2022-04-19

Love how all this works together. I'm amazed at the complexity involved. It gives me an appreciation for the process behind it all.

damianGray - 2020-11-28

Once again you blow my mind with your insane math skills man! Fantastic work!

Prakhar Bhardwaj - 2020-11-28

I can't even draw with a pen or a pencil, while you are drawing with maths. FML.

On a serious note, love your videos and blog, as they have kept motivating me to keep getting better at math, so that one day I can possibly make stuff like this.

Jonathan Whitaker - 2021-04-24

Absolutely incredible, and every step so well explained. Thank you for all the work you put in to sharing your skills with us :)

Francisco Torres - 2020-11-28

This is the coolest thing I've ever seen. I really want to learn how to do this all this and you're a great inspiration. Thank you!

espi sepi - 2020-11-28

Estos tutoriales son otro nivel, muchas gracias por tus videos!

dark808bb - 2021-05-21

This is such a great presentation of how these types of shaders are made. Amazing video, iq. Thanks so much !

Gabriel Alejandro - 2021-03-14

If my calculus professors would explain the subjects like this i would've paid more attention.

Alessandro Angioi - 2021-05-04

I have been following your work since when I was about 10 and watched demos on my pc, dreaming of attending some demoparty. I never got to attend any, nor write any stunning code for procedural generation, but you always were a great source of inspiration, and one of the reasons why I decided to study something math-heavy (I have a PhD in theoretical physics now).

Super glad to see you on youtube too!

bejoscha - 2020-11-30

Was pointed here by some random comment on a random Discord server. Glad I was. Super impressive and the most clear "step-by-step" math-2-result illustration I've seen on YouTube so far. Well done. Minor observation: Cool how the head is bobbing around a tiny bit throughout the video (noticeable when fast-moving through it only.)

Wyrade - 2022-04-18

Beautiful, and it's incredible how well you animated the steps of the creation process itself, it's very nice to visually see what you're doing at the time and how. :)

Aurélien Noce - 2020-11-29

Awesome, can’t imagine how long it took to complete this video 🙏

Tonjevic - 2020-11-28

I'm always astonished at what you manage to accomplish with such simple primitives. The hair braid construction was particularly pleasing. Simply gorgeous.

Francis Chen - 2020-11-28

So true. Very strong use of 3D primitives