The SDF of a Box

Поделиться
HTML-код
  • Опубликовано: 25 ноя 2024

Комментарии • 122

  • @MaGnAFraG
    @MaGnAFraG 5 лет назад +73

    The escalation to "visualizing the SDF of a 3D projection of a 4D box" near the end was quick :)

  • @dmdjt
    @dmdjt 5 лет назад +62

    That's the best explanation I've seen so far... Thank you!

  • @xellart
    @xellart 5 лет назад +71

    Sir you are a beast. Everytime my googling about raymarching gets concrete you appear in the results. Phenomenal work and resources you put out there, thank you so much!

    • @InigoQuilez
      @InigoQuilez  5 лет назад +10

      Thanks. I have more coming!

    • @slowestjabroni
      @slowestjabroni 2 года назад +7

      No kidding man! i don't think anyone would know how to do raymarching without this guy

  • @sea-saw
    @sea-saw 5 лет назад +26

    That was great. The visual going from 2D to 3D to 4D was fantastic!

  • @BartKevelham
    @BartKevelham 5 лет назад +37

    Great explanation, wonderful visualization, what a resource! Keep it up!

  • @SpencerYonce
    @SpencerYonce 2 года назад +1

    You are a true wizard, my friend. Continue to share the magic of numbers, as this wizardry is contagious to the mind of fellow thinkers.

  • @psykoj
    @psykoj 9 месяцев назад

    So well explained! Why didn’t I have teachers like this growing up. thank you!

  • @milosavpavlovic7548
    @milosavpavlovic7548 2 года назад +2

    Thanks, this was great, even the shading of the outside and inside of the shape, in the end, was purposeful.

  • @xbzq
    @xbzq 5 лет назад +10

    Excellent animations there. I bet it was a lot of work, but it shows in the result.

  • @Dudevid
    @Dudevid 5 лет назад +5

    I echo the sentiment in the comments that I would adore a series of these videos covering each primitive, getting progressively more complex and building on previous videos! Thanks for the amazing work, IQ.

  • @5up5up
    @5up5up Год назад

    i love how the expression involves vectors, so it doesnt matter what are the dimensions, i love the elegance of this whole thing, thanks for explaining it!!

  • @RostamiMagic
    @RostamiMagic 5 лет назад +4

    Thank you for the clear explanation. The graphics are stunning!!

  • @25knightcrawler
    @25knightcrawler 5 лет назад +16

    My god. These are some top notch quality videos :O Thank you :)

  • @geoffcunningham6823
    @geoffcunningham6823 5 лет назад +104

    Are you planning on doing a series of these for the other primitives on your website? Would be really useful for basic understanding - as it's a lot better than just copying formulas. Also I don't have the brains to derive these myself! They aren't obvious, to me a least, but with explanation really make sense.

    • @InigoQuilez
      @InigoQuilez  5 лет назад +50

      I have many videos in the pipe, and a few are about deriving SDFs, yes!

  • @lemonjumpsofficial
    @lemonjumpsofficial Год назад +1

    OMG YOU'RE ON RUclips!!! I SAW YOUR WORK ON SHADERTOY!!!

  • @Blacksoul444
    @Blacksoul444 4 года назад

    the most powerful compact explanation and formula I've seen so far!!
    Stunning!!, absolutely amazing!

  • @CraigPerry
    @CraigPerry 5 лет назад

    How is it possible there’s only 10k subscribers to this channel. This is one of the most interesting and educational channels ever!

  • @armenmichaeli6704
    @armenmichaeli6704 Год назад +1

    I wanted to mention one little thing which I myself seem to have noticed for the first time, watching this video -- I think music, the right kind of music (which I guess is subjective, admittedly), will help one learn better. It relaxes the mind and helps you put your mind closer to the "zone". At least that's my impression. Either that or it's Inigo's soft Spanish accent that he speaks with, or simply his method of explaining the difficult using simpler terms. Anyway, think about it -- music as a catalyst of learning math...

  • @esbensloth
    @esbensloth 5 лет назад +1

    Great video! I have learned so much from reading your articles over the years, very happy that you are expanding to videos as well!

  • @sociamix
    @sociamix 5 лет назад +1

    Cool thank you, can't wait for the next one !

  • @noonansean1979
    @noonansean1979 5 лет назад +1

    I really wish you would do more videos, in fact I wish you would do an entire course right here on youtube. There's so much many of us could learn from you.

    • @InigoQuilez
      @InigoQuilez  5 лет назад +2

      I'm on it! My goal is to lower the quality bar a bit so I can make more and more quickly. As I said, I'm on it

    • @noonansean1979
      @noonansean1979 5 лет назад

      I'll have to raise my bar so I can follow along! Mr. Quilez I can't think of a better course I'd love to watch than something produced by yourself. Thank you.

  • @Saturos02
    @Saturos02 5 лет назад +2

    Deeply appreciated! Hope to see more derivations in the future!

  • @yaafl817
    @yaafl817 4 года назад +1

    You are one incredible teacher, thank you for this, it's amazing!

  • @TheArtofCodeIsCool
    @TheArtofCodeIsCool 5 лет назад +2

    Nice one! Great visualizations!

  • @geoffrey3668
    @geoffrey3668 4 года назад

    Mind blowing is the right thing to say! Thank you to make complicated thing very easy to understand.

  • @ragingwolfaboo
    @ragingwolfaboo Год назад

    You're an inspiration, man! Thank you for all of your work and resources.

  • @jochenfeldkotter1987
    @jochenfeldkotter1987 5 лет назад +1

    thank you.. Finally understood the df I used so many times without thinking about it :)

  • @smthsmth111
    @smthsmth111 5 лет назад

    Cool tut. Thanks a lot, Inigo!

  • @mactyler
    @mactyler 5 лет назад +9

    Looking to give 3 blue 1 brown some competition I see!

  • @iaobardar3452
    @iaobardar3452 5 лет назад +1

    I love this explanation! please do more!

  • @felipegutierrez3477
    @felipegutierrez3477 5 лет назад +2

    Very elegant formula! Saludos desde Colombia

    • @rongovard6761
      @rongovard6761 3 года назад

      Do you have cocaine ?

    • @felipegutierrez3477
      @felipegutierrez3477 3 года назад

      @@rongovard6761 So funny, shame that thousands of people suffer from a war to take drugs to richer countries.

  • @mattschaeferdesign
    @mattschaeferdesign 5 лет назад

    Was just talking about your video tut abilities over lunch! And you drop this craziness around the same time haha.

    • @InigoQuilez
      @InigoQuilez  5 лет назад +1

      I'm learning for sure! Also, telepathy? See you soon!

  • @sidekick3rida
    @sidekick3rida Год назад

    The math is fascinating. Would love if you did a course.

  • @atomictraveller
    @atomictraveller Год назад +1

    "SIGNED distance field" somewhere on the page/in the content ;)

  • @colinleungNiloCat
    @colinleungNiloCat 5 лет назад +1

    thank you for the explanation

  • @connellpaxton6615
    @connellpaxton6615 Год назад

    THESE ARE AWESOME VIDEOS!! THANKS SO MUCH!!

  • @pako_powr
    @pako_powr 5 лет назад

    Very nice explanation!

  • @ReBufff
    @ReBufff Год назад

    Really helpful, thank you!

  • @sunflower4031
    @sunflower4031 3 года назад +2

    good video man

  • @smiley_haha
    @smiley_haha 5 лет назад

    I found it easier when trying to think of an SDF for a box to just intersect boxes of infinite volume and simplify from there.
    i.e. for 3D use 6 versions of sdInfiniteBox(vec3 p, float height) { return h - p.y; }, inline them, and then try to minimize the formulas. Ends up reducing to a few max and min operations if I remember correctly.
    I do like how your approach generalizes to more dimensions though, that is really cool.

    • @InigoQuilez
      @InigoQuilez  5 лет назад +1

      The intersection of infinite boxes won't work in most applications. What you get is a bound for the distance, not a real (euclidean) distance. That might be okey for some types of colission detection or slow marching, but generally you want the exact distance to the box, not just an approximation.

  • @nehuelarmenanzas
    @nehuelarmenanzas 4 года назад +1

    Subscribed! Amazing!

  • @geko2867
    @geko2867 Год назад

    You should have mentioned that this is pretty much the sphere function but using chebychev distance instead of euclidean distance. A curve that has equal euclidean to a point forms a circle, while using chebychev forms a square- and manhattan distance forms a smaller square rotated by 45 degrees.. or a "diamond"

  • @frankeke8541
    @frankeke8541 5 лет назад +1

    you are amazing

  • @miktilk4818
    @miktilk4818 5 лет назад

    Cool! Just, simply cool!

  • @grisevg
    @grisevg 3 года назад

    Thank you

  • @NonTwinBrothers
    @NonTwinBrothers 3 года назад

    Stop blowing my mind, aaaaaaijoasih

  • @eventhorizon8014
    @eventhorizon8014 5 лет назад +1

    Really cool ! :)

  • @Ganerrr
    @Ganerrr 2 года назад

    Would this be more optimal? it only makes a call to length when necessary
    float sdf_rect(vec3 p, vec3 s) {
    vec3 adj = abs(p) - s;
    return vmin(adj)

  • @KaletheQuick
    @KaletheQuick 2 года назад

    Oh cool a saquare!
    Ingo: "Look, it's a cube now!"
    Oh cool!
    Ingo: "Now a tesseract!"
    AHHHHHHHHHH!

  • @RicardoGarcia-mm3fo
    @RicardoGarcia-mm3fo 4 года назад

    brilliant!

  • @Yashar-yp3yc
    @Yashar-yp3yc 4 месяца назад

    Perfect🔥❤️

  • @redoxee
    @redoxee 5 лет назад

    Nice!

  • @lemonjumpsofficial
    @lemonjumpsofficial Год назад

    omg that's so cooll!!!!!!!!

  • @ollllj
    @ollllj 3 года назад

    distance to parabola and quadraticBezier next!

  • @pedroenmanuelfuenteszambra8873
    @pedroenmanuelfuenteszambra8873 4 года назад

    Are you planning to bring the theme of voxels? Im very interested in this theme. There are some experiments and tech demos coming out recently that are showing how far can you go in realtime with this things. But most of the sources are written in a very technical lingo. I saw your video and I understood box collision logic immediatly. I would like to see something like this in voxels. pls

  • @sarvagyagupta1744
    @sarvagyagupta1744 4 года назад +1

    This is amazing. One question though. At 5:28, what is the value of R? I understood the equation before it and how we are generalizing it but to go to the next equation, we'll need the direction of vector P to get the value of R right?

    • @InigoQuilez
      @InigoQuilez  4 года назад +2

      R is just the dimension of the box, it's a constant vector. In 2D, it would be R = (Rx, Ry)

    • @sarvagyagupta1744
      @sarvagyagupta1744 4 года назад +1

      @@InigoQuilez Hmm. I think I got confused. abs(P) I assumed as the magnitude of P. So are we basically subtracting a point on the edge of the surface to some extension of the same point?

    • @InigoQuilez
      @InigoQuilez  4 года назад +2

      No, abs(p) is the component-wise absolute value of p. It's still a vector. The magnitude is length(p). Basically abs is |x| and length is ||x||. It's not necessarily the most logical, but that's how GLSL and most graphics programming languages call things.

    • @sarvagyagupta1744
      @sarvagyagupta1744 4 года назад +1

      @@InigoQuilez Makes so much sense. Yeah, abs(p) is nothing but the abs value of each element. My bad that I confused it with what "length" does. And now, it makes perfect sense how ||abs(p)-R|| (length(abs(p)-R)) gives us what we want.

  • @dmitryparadise7618
    @dmitryparadise7618 5 лет назад

    Спасибо!

  • @christopher8116
    @christopher8116 4 года назад

    The SDF of a box is the distance from any point in space to the box ? What must be learned to get to this point in mathematics; unless a break down video can be created ?

  • @HuyPhamChnl
    @HuyPhamChnl 3 месяца назад

    Sir!

  • @zayaerme
    @zayaerme 2 года назад +1

    I am a professional Instructional Designer with 3D as a hobby. I would love to help you on creating full blown 3D courses for free. Learning from you would be invaluable for me.

  • @turboblaat
    @turboblaat 5 лет назад

    Hi Iq! thx for all these aswesomness,
    I want to dive some deeper in sdf functions, and would like to use the plane shading used in this example.
    Could you share that in a shadertoy with a 3d sdf drawing the gradient on a 3d plane?

  • @oluwasanmiadenaiye3630
    @oluwasanmiadenaiye3630 2 года назад

    What is abs()?
    Absolute of components or length of v from 0?

  • @Chribit
    @Chribit 2 года назад

    Hey iq,
    While experimenting with offline SDF rendering, i noticed that the sdf for a box is almost exactly the same as the one for the elongation operation… as in the datatypes, math operations and function calls are all identical besides the length() and „primitive()“ calls in each.
    Trying to figure out how that can be interpreted. Is it similar to how the SDF of a capsule is basically an elongated sphere? If yes, what exactly would be a non-elongated primitive in a box?

  • @pedroenmanuelfuenteszambra8873
    @pedroenmanuelfuenteszambra8873 5 лет назад +1

    BTW very good quality video. A couple more like this and way less noobs on the streams will be asking what is NDotL.

  • @cycomkid
    @cycomkid Год назад

    What is the benefit of this?
    Where it is used?

  • @newtoo8767
    @newtoo8767 5 лет назад +1

    Hey Inigo Quilez! I looked at your 6 hour tutorial and repeated everything. I got -50% fps for every added primitive. Is SDF rendering really faster than polygonal rendering? Is SDF useful in videogames? Can i get more perfomance using SDF?

  • @weinsim3856
    @weinsim3856 4 года назад +1

    What is maxcomp()?

    • @InigoQuilez
      @InigoQuilez  4 года назад +2

      The largest component of a vector.
      maxcomp(v) = max(v.x, max(v.y, ...))

    • @weinsim3856
      @weinsim3856 4 года назад +1

      @@InigoQuilez thank you, i already found it on your website.

  • @Monogrammaton
    @Monogrammaton 4 года назад +1

    Bob Saget is one of his patreon supporters??

  • @carmo122
    @carmo122 3 года назад

    Why is it that you use the absolute value of P instead of just P in the q = abs(P) - R? I tried without the abs in the shadertoy example in your website but couldn't notice a visible difference.

  • @mathieug9860
    @mathieug9860 5 лет назад

    Fantastic stuff! But isn't the max() operator implemented with if/else statements?

    • @InigoQuilez
      @InigoQuilez  5 лет назад +3

      No, not at all. MAX is like ADD, SUB or CMOV, it's a branchless instruction of the processor.

  • @mjthebest7294
    @mjthebest7294 4 месяца назад

    But this doesn't really get rid of the branching, they are just hidden in the max funcions!
    Still nice, there are intrinsincs that perform max very quicly.

    • @InigoQuilez
      @InigoQuilez  4 месяца назад

      No, the max() function doesn't use branching, it uses a CMOV instruction which does NOT jump but use masking to combine bits. That's the whole point.

    • @mjthebest7294
      @mjthebest7294 4 месяца назад

      like this?
      mov eax, dword [esp+8]
      mov ebx, dword [esp+4]
      cmp eax, ebx
      cmovl eax, ebx
      ret
      I'm not sure the max/min functions from the standard library uses this trick tho

    • @InigoQuilez
      @InigoQuilez  4 месяца назад

      Yhat's old school, but yes,I guarantee wr haven't done bramches for min/max many decades. Same for GPU, it's a hardware instruction since forever.
      In fact it's the other way around, and many if() statements are simulated with min/max.

    • @mjthebest7294
      @mjthebest7294 4 месяца назад

      @@InigoQuilez that is very interesting! I know there are sse intrinsics like _mm_max_ps() that emit direct cpu instructions for doing it wide, so yeah it makes sense.
      Thank you!

  • @Corbnorb
    @Corbnorb 2 года назад

    how does length() work?

    • @Alex-Dev
      @Alex-Dev 2 года назад

      sqrt(Px² + Py²)

  • @besusbb
    @besusbb 3 года назад

    isn't the max() usually implemented with a branch operation?

    • @InigoQuilez
      @InigoQuilez  3 года назад

      No, unless you don't really have any other choice and have to do it that way.

  • @Davi-c4q
    @Davi-c4q 5 лет назад

    Why isn’t the max function considered a branch? Doesn’t it have to compare 2 numbers internally?

    • @blondieresource767
      @blondieresource767 5 лет назад

      Shader units have a built-in max() function that is a single instruction.

    • @InigoQuilez
      @InigoQuilez  5 лет назад +2

      The GPU can compute the max of two numbers without branching, like it can compite the addition or subtraction of two numbers without branching. It's most likely a combinatorial circuit.

  • @rawwars
    @rawwars 5 лет назад

    can you add some reference in the description to read something about it? for now i will simply go with the google flow XD

    • @InigoQuilez
      @InigoQuilez  5 лет назад

      All the references are in the desctiption of the video, in particular iquilezles.org/www/index.htm is where I have all the tutorials and maths realted to SDFs.

  • @mihailazar2487
    @mihailazar2487 2 года назад

    06:27
    I'm sorry, but how can the distance function ever be less than 0 in this case where if you add a parameter to the length function can only yield a positive value

    • @InigoQuilez
      @InigoQuilez  2 года назад +2

      q's components can be negative and maxcomo(q), the largest component of q can be negative. So when adding it to the lengrh (which is zero in the interior of the box), you get a negative value for the SDF.

  • @LukePettit3dArtist
    @LukePettit3dArtist 5 лет назад

    I dont suppose a follow up on why or how this used could be forthcoming. I found it interesting but the shriveled and aged maths side of my Brain was wondering how it is used or useful.

  • @GameDevAraz
    @GameDevAraz Год назад

    all i wanted was to mask a texture so the edges are soft but ohwell. unreal

  • @yaafl817
    @yaafl817 4 года назад

    Is there a way to derive a direction from this?

    • @Chribit
      @Chribit 2 года назад

      If you mean a direction when recieving a „sphere“ during sphere tracing, the first derivative of the distance function will give you the gradient / slope -> you can get the direction from the signs

  • @zapparello
    @zapparello 4 месяца назад

    Amazing, but this function does not make a difference for inside or outside the box. It always returns a positive value.

  • @zXHAcKeRzXz
    @zXHAcKeRzXz 2 года назад

    Vous avez mis le SDF où ????????

  • @manaierchannel7646
    @manaierchannel7646 3 года назад

    ‏لا اله الا الله

  • @Toomnyrabbo
    @Toomnyrabbo Год назад

    WHO WATCHES THIS?!??!?!?!??!?!

  • @MDBadhon-w4o
    @MDBadhon-w4o 2 месяца назад

    hi

  • @pedroenmanuelfuenteszambra8873
    @pedroenmanuelfuenteszambra8873 5 лет назад +1

    How you made the animation at the start of the video? You made a shader for that? Are you working on a framework or something? Cant think of someone doing that thing in ShaderToy.

    • @InigoQuilez
      @InigoQuilez  5 лет назад +3

      I actually made it in Shadertoy. I modified my original Greek Temple shader and added the animations, it was pretty quick to do.

  • @mav45678
    @mav45678 Год назад +2

    Nice video. However, using background music for math videos is IMO counterproductive. The listener is supposed to be be maximally focused while listening to you, and the music is distracting

    • @johnadams6249
      @johnadams6249 11 месяцев назад

      I don’t think music is inherently out of place in math videos. Just look at 3Blue1Brown. If the pinnacle of mathematics education on RUclips uses background music, then surely it can’t always be a bad thing. I do think there’d an issue with the audio mixing though. The music changes volume throughout the video (although I think I remember watching a video saying that RUclips uses auto-gain so it may not be intentional) and the music is a little too loud during the speaking parts of the video. Perhaps a different style of background music might lend itself better to the video as well, the techno music is a bit busy.

    • @MasonSchmidgall
      @MasonSchmidgall 10 месяцев назад

      Objectively wrong

  • @leiliu83
    @leiliu83 2 месяца назад

    Omg