Coding Challenge 177: Soft Body Physics

Embark on a squishy adventure as I attempt to create a soft body physics simulation for a character with toxiclibs.js and p5.js! Code: thecodingtrain.com/challenges...
🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-...
p5.js Web Editor Sketches:
🕹️ Soft Body Character: editor.p5js.org/codingtrain/s...
🕹️ Soft Body Character Enhanced: editor.p5js.org/codingtrain/s...
🕹️ Soft Body Dancing Skeleton: editor.p5js.org/codingtrain/s...
🕹️ Soft Body Letters: editor.p5js.org/codingtrain/s...
🕹️ Blank Canvas: editor.p5js.org/codingtrain/s...
🎥 Previous video: • Coding Challenge 176: ...
🎥 All videos: • Coding Challenges
References:
🔗 Nature of Code: nature-of-code-2nd-edition.ne...
🔗 ToxicLibs.js: haptic-data.com/toxiclibsjs/
🔗 ToxicLibs Java Reference: shiffman.github.io/toxiclibs-...
🔗 Advanced Character Physics: www.cs.cmu.edu/afs/cs/academic...
🔗 Thi.ng: thi.ng/
Videos:
🚂 Toxiclibs Verlet Physics playlist: • 5.13: What is Toxiclib...
🚂 Matter.js playlist: • 5.17: Introduction to ...
🎥 Physics of JellyCar: • Physics of JellyCar: S...
🎥 The Making of Nokia and Friends: • Nokia Friends (Making ...
Related Coding Challenges:
🚂 20 3D Cloth with Toxiclibs: • Coding Challenge #20: ...
🚂 63 Texturing Cloth Simulation: • Coding Challenge #63.1...
Timestamps:
0:00 Introduction
2:51 Physics libraries
5:30 Elements in ToxicLibs
5:47 Start coding
7:04 Object destructuring
8:10 Add gravity
9:00 Adding elements to the world
10:35 Updating the physics world
11:40 Adding a spring
15:23 Refactor code
18:07 Inheritance
18:57 Super class
23:31 Spring length
25:44 Create a closed-filled shape to draw the character
26:49 Suggestions for variations
27:07 Other types of springs
27:36 Update about the Nature of Code book!
28:56 Outro
Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound
🚂 Website: thecodingtrain.com/
👾 Share Your Creation! thecodingtrain.com/guides/pas...
🚩 Suggest Topics: github.com/CodingTrain/Sugges...
💡 GitHub: github.com/CodingTrain
💬 Discord: thecodingtrain.com/discord
💖 Membership: kzread.infojoin
🛒 Store: standard.tv/codingtrain
🖋️ Twitter: / thecodingtrain
📸 Instagram: / the.coding.train
🎥 Coding Challenges: • Coding Challenges
🎥 Intro to Programming: • Start learning here!
🔗 p5.js: p5js.org
🔗 p5.js Web Editor: editor.p5js.org/
🔗 Processing: processing.org
📄 Code of Conduct: github.com/CodingTrain/Code-o...
This description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecod...
#softbody #toxiclibs #verletphysics #p5js #javascript

Пікірлер: 146

  • @TheCodingTrain
    @TheCodingTrain Жыл бұрын

    🚂 Source code and passenger showcase: thecodingtrain.com/challenges/177-soft-body-character 💫 Support the Coding Train and watch ad-free on Nebula: nebula.tv/videos/codingtrain-coding-challenge-177-soft-body-character

  • @CodeParticles

    @CodeParticles

    Жыл бұрын

    @TheCodingTrain, Huge fan sir thank you for this upload! I know you're incredibly busy these days but with all due respect, I feel that you should have done this from scratch like you've done with the quadtree tutorial, 2d physics, the boids tutorial, and countless others instead of using an external library!

  • @tile-maker4962

    @tile-maker4962

    Жыл бұрын

    This is great. Do you think it is possible to integrate angles instead of springs between points to make it? Like a spring angle or something?

  • @TheCodingTrain

    @TheCodingTrain

    Жыл бұрын

    @@CodeParticles I appreciate the feedback, you might like to see the spring challenge which has some more implementation details! kzread.info/dash/bejne/hKZhl6qiiNTbmNo.html

  • @CodeParticles

    @CodeParticles

    Жыл бұрын

    @@TheCodingTrain Thank you! 👍

  • @mathcat4

    @mathcat4

    Жыл бұрын

    Amazing you found time to post another video, your enthusiasm always motivates me to program again!

  • @yohansaba5179
    @yohansaba5179 Жыл бұрын

    Thank you for everything Daniel, you have such a wonderful soul.

  • @ezrakornfeld8436

    @ezrakornfeld8436

    Жыл бұрын

    He’s like the bob ross of programming

  • @xnick_uy
    @xnick_uy Жыл бұрын

    This is the Coding Challenge video with the highest quality so far: well scripted narrative, lots of tips and logical arguments, an easy to follow and well organized code. Also, the part about how to set up the html and the imports is very appropriate. The video edition also superb. This goes to show your experience making these videos, and also dedicating so much time to the book possibly has an impact on your story-telling style, for the better.

  • @TheCodingTrain

    @TheCodingTrain

    Жыл бұрын

    Thank you for this feedback, I really appreciate it!!

  • @ethanmendelson6978

    @ethanmendelson6978

    Жыл бұрын

    @@TheCodingTrain Definitely the best presentation yet. Got halfway through the video without opening my IDE because I was fixed on just watching.

  • @Lurkingbird

    @Lurkingbird

    10 ай бұрын

    @@TheCodingTrain do more apple ii videos it is so good

  • @hotrodhunk7389
    @hotrodhunk7389 Жыл бұрын

    I just started learning coding. After finding your content it is like a breath of fresh air! You make it seem so fun! The ability to do anything with a computer is really cool and powerful. Thanks for your videos.

  • @mmilerngruppe
    @mmilerngruppe Жыл бұрын

    Thank you, Daniel, your videos always make me happy!

  • @sambeard4428
    @sambeard4428 Жыл бұрын

    When I watch your videos, I feel you talk to me, not just saying something, but actually talking to me, like I'm a child. But not at all in the negative sense. Your instructions are clear, friendly and unassuming. I hope you either have kids or will some day because I'm sure they'll turn out as marvelously curious little beings. Little bit of a weird post, I know, but this is just how I like to express my gratitude.

  • @tehcakelie17
    @tehcakelie17 Жыл бұрын

    This is amazing! this came in clutch when I've been researching simple way to create softbody physics. Thank you for this!

  • @richardsymes1844
    @richardsymes1844 Жыл бұрын

    So good to see you back and with another interesting challenge.

  • @niczoom
    @niczoom Жыл бұрын

    Super clear explanations. I learn something new every video watched!

  • @Sayamak
    @Sayamak Жыл бұрын

    Daniel really is a great educator and entertainer. Thank you Sir for your videos and especially The Nature of Code where I am currently enjoying the chapter about fractals.

  • @PeranMe
    @PeranMe Жыл бұрын

    Oooh, new NoC version! Pardon my drooling here...

  • @cpasket122

    @cpasket122

    Жыл бұрын

    How the hell did you comment 7 hours ago if the video was released 5 hours ago???

  • @PeranMe

    @PeranMe

    Жыл бұрын

    @@cpasket122 What? I'm just that fast, ok? Keep up! (Subscribers sometimes get videos early)

  • @cpasket122

    @cpasket122

    Жыл бұрын

    @@PeranMe oh, thought you were a time traveler or something lol

  • @zer001
    @zer001 Жыл бұрын

    nice to have you back.

  • @WilderPoo
    @WilderPoo Жыл бұрын

    Amazing! Thank you for really demystifying soft body physics. I thought it would be much more complicated than a few springs 😄

  • @nagesh007
    @nagesh0076 ай бұрын

    Awesome , Mind Blowing 😍

  • @wxr
    @wxr Жыл бұрын

    I receive every video of the Coding Train as it was a Christmas gift and I was 5 years old ! I'm so happy and excited !

  • @RedEyedJedi
    @RedEyedJedi Жыл бұрын

    OMG you're writing a new version of the nature of code :D I have the original and its my favourite book by a mile.

  • @pierregof
    @pierregof Жыл бұрын

    Thank you Daniel 🙏

  • @nimlhug138
    @nimlhug138 Жыл бұрын

    WOW... I got a flashback of a younger version of me having fun with SodaConstructor back in 2000-2001

  • @sodaplayer

    @sodaplayer

    Жыл бұрын

    Ooh, I loved playing with that. >.> I even still have my username named after it.

  • @AaronAsherRandall
    @AaronAsherRandall Жыл бұрын

    I have always loved your videos! I am a novice game programmer in C# and Unity, it seems like a lot of these tools in Javascript could be expanded to make games with complex physics and graphics in the browser!

  • @manuelm.561
    @manuelm.561 Жыл бұрын

    Génial !!!

  • @redpug5042
    @redpug5042 Жыл бұрын

    it sure would be fun to write the physics engine on your own. I just spent about an hour or so making a quick engine with a system for springs and force fields (a force applied to specified particles based on the particle's conditions like location, hence "field")

  • @jayjasespud
    @jayjasespud Жыл бұрын

    This train sure has come a long way since departure.

  • @Haapavuo
    @Haapavuo Жыл бұрын

    Greetings from Finland! 🇫🇮 That is where you inspiration came from this time! 😉

  • @chopstix9093
    @chopstix9093 Жыл бұрын

    its been too long since a coding train video ;-; thank you!!!

  • @shachargabbay1496
    @shachargabbay1496 Жыл бұрын

    wow. you are simply a magician. I've been dreaming about this for years!!!!

  • @Parasbhattarai1
    @Parasbhattarai1 Жыл бұрын

    ❤❤love everything done for us and teaching in. Such a cool way❤❤❤

  • @partymarty1856
    @partymarty18567 ай бұрын

    glad to see you making video (I've watched one so far"

  • @kapilishere
    @kapilishere Жыл бұрын

    It was fun to watch, I'd definitely code my own squishie character!

  • @Hoobizone
    @Hoobizone11 ай бұрын

    Such a great content! Thanks!!

  • @zer001
    @zer001 Жыл бұрын

    Danke! Thank you!

  • @TheCodingTrain

    @TheCodingTrain

    Жыл бұрын

    Thanks for the generous support!

  • @user-rq8wm5bu9s
    @user-rq8wm5bu9s Жыл бұрын

    Thank u so much! I can’t express how much your video helped me but I ‘m surely that you have saved the whole of my college life!😂

  • @mrthomaschannelearth
    @mrthomaschannelearth Жыл бұрын

    Code refactoring is one of the few things that bring me true joy in this life

  • @parkeranderson7599
    @parkeranderson7599 Жыл бұрын

    Soft body physics... my doctor has been wanting me to work on this!😉

  • @IzUrBoiKK
    @IzUrBoiKK Жыл бұрын

    I am mainly a python programmer, but often use your videos as a tutorial for things. Thanks bro for all this. ❤❤❤

  • @pbenikovszky1
    @pbenikovszky1 Жыл бұрын

    ah finally a new video :) great as always :).

  • @spacelamaglama
    @spacelamaglama3 ай бұрын

    what a nice video! You are like the Bob Ross of developing

  • @Masda.X
    @Masda.X Жыл бұрын

    Thanks a lot sir!

  • @Liloulalalala
    @Liloulalalala Жыл бұрын

    Yeeeees new coding challenge !!

  • @wlockuz4467
    @wlockuz4467 Жыл бұрын

    Can't wait for Nature of Code!

  • @KnakuanaRka
    @KnakuanaRka9 ай бұрын

    I need to catch up on the Coding Challenges.

  • @LoPhatKao
    @LoPhatKao Жыл бұрын

    pretty cool that you're doing a rewrite of NoC read it last year and played around with Processing niftiest sketch I did was an ant pheromone trail behaviour simulation, reminiscent of SimAnt surface view

  • @offtheball87
    @offtheball87 Жыл бұрын

    I'd love to see the making of the final character!

  • @anon_y_mousse
    @anon_y_mousse Жыл бұрын

    Are you going to do rigid body physics next? Maybe throw a squishy sphere at a brick wall at varying speeds and animate it bouncing off and breaking through.

  • @olasoderlind5685
    @olasoderlind5685 Жыл бұрын

    more videos , fun watching. :)

  • @robinkelmen6332
    @robinkelmen6332 Жыл бұрын

    Hi, Loved the video! Would you be able to do a video with collision detection between 2 shapes consisting of a set of points and springs?

  • @RupertBruce
    @RupertBruce11 ай бұрын

    I don't have notifications on and it took YT 2 months to suggest this. I have surely watched enough of your videos to get instant feed updates regardless of the notification settings.

  • @KakoriGames
    @KakoriGames Жыл бұрын

    Fun fact, soft body simulations actually have a lot of similarities with finite element analysis. In fact, one could use a soft body to simulate a ideal truss structure. When it comes to 2D, or 3D, structures, the main difference becomes that the rigidity of the system is calculated based on the shapes between springs, called elements, and there's some resistance to rotation in the nodes, so a square shape doesn't fall flat. But the idea of modeling a continuous body as a set of discrete points forming a graph, that exhibit some degree of rigidity between them, is very much akin to elastic finite element analysis.

  • @beefox__
    @beefox__ Жыл бұрын

    fun fact! the youtuber who explained recently how jelly car worked, he actually made jelly car!

  • @FridgeFucker96
    @FridgeFucker96 Жыл бұрын

    I swear if someone ever hurts this man I'll track them down personally

  • @DOROnoDORO
    @DOROnoDORO Жыл бұрын

    RETURN OF THE KING

  • @donnierussellii4659
    @donnierussellii4659 Жыл бұрын

    Thanks for helping the programming community own the toxi libs.

  • @mthia
    @mthia Жыл бұрын

    another coding challenge nice!!!

  • @kimeg7294
    @kimeg7294 Жыл бұрын

    Hello Daniel, this was very fun to watch and educational for learning how particles behave based on soft body interactions. Would this principle be applicable for simulating a "verlet cloth" effect on particles forming a 2D rectangular shape?

  • @TheCodingTrain

    @TheCodingTrain

    Жыл бұрын

    Yes! You can see more about this in an older video: kzread.info/dash/bejne/nKafwc6Il8LWhqQ.html

  • @Freestila
    @Freestila Жыл бұрын

    I never did javascript. I code java for a living, but js and p5 was new to me :) But this looked soo fun, that i wanted to try it. got some problems with preview in vs code (since web editors are not my thing...), but it was really fun :) So thanks for that :)

  • @NinjarioPicmin
    @NinjarioPicmin Жыл бұрын

    0:30 that is truly beautiful. Any idea on where to read up on how that was done?

  • @WhateverOwO

    @WhateverOwO

    Жыл бұрын

    it's probably pressure soft-body physics with really low pressure and k parameters

  • @namelastname4077
    @namelastname4077 Жыл бұрын

    Another Dane saves the day. They invented C++, PHP, C# and V8

  • @itsjase92
    @itsjase92 Жыл бұрын

    Is there a reason you prefer the p5js web editor over something like openprocessing? I only recently discovered it but it seems much nicer

  • @emilie1977
    @emilie1977 Жыл бұрын

    wow good subject! I want simulate my home under earthquake ;)

  • @felipe1876
    @felipe1876 Жыл бұрын

    i understand 15% of the eps, but it is so cool even so

  • @dreamofeternalhappiness8001
    @dreamofeternalhappiness8001 Жыл бұрын

    Yay. 👽✌️ Keep making programming fun for everyone and become rich. You are super fun. Knowledge is boring only if there is none to play with it. ❤ * individual physical position vector.

  • @o_2731
    @o_2731 Жыл бұрын

    I really regret i didnt find this video when i started coding

  • @Michi0-0
    @Michi0-0 Жыл бұрын

    You are the nicest guy ever❤❤❤

  • @mileshunter3280
    @mileshunter3280 Жыл бұрын

    Great video. What's the name of the tune at 3m30s?I can't get it out of my head.

  • @jf4715
    @jf4715 Жыл бұрын

    I miss your videos!

  • @nathanroed6924
    @nathanroed6924 Жыл бұрын

    please do a series where you make a rigid body physics system without physics libraries like box 2D

  • @vsueiro

    @vsueiro

    Жыл бұрын

    Hi, Nathan! In his Nature of Code playlist, Dan builds the basics of a physics engine from scratch… It’s just amazing!

  • @nathanroed6924

    @nathanroed6924

    Жыл бұрын

    @@vsueiro thanks, I'll be sure to watch it!

  • @pablobribiesca2596
    @pablobribiesca2596 Жыл бұрын

    I was like "Ohh this reminds of Jelly car... Great game and amazing memories with my brother" Popped up out of the blue

  • @Bromon655
    @Bromon655 Жыл бұрын

    This is gonna sound crazy but the conversation about repetitive code starting at 15:04 really helped me visualize the purpose of object oriented programming as opposed to procedural programming. Noobish and oddly specific but still

  • @TheCodingTrain

    @TheCodingTrain

    Жыл бұрын

    I'm so glad to hear this!

  • @drobotk
    @drobotk Жыл бұрын

    Would it be possible to make 2 buddies collide and bounce together using this library?

  • @cypher2960
    @cypher2960 Жыл бұрын

    hi daniel. thank you for everything, you've tought me alot. but could you please try to demessify you playlists please. you have so many greate tutorials and course but they are all out of order and sometimes missing. thankfully someone else has make a playlist of you coding challanges. you've tought a whole lot but honestly i makes my head explode going through it all to find the ones i want. i would learn alot more if your playlists and courses where organized in your channel or a website per say. just a segestion.

  • @meguellatiyounes8659
    @meguellatiyounes8659 Жыл бұрын

    new to the channel , thank for presenting this beautiful topic don't you notice the 3D illusion effect 23:55

  • @euglossine4ever
    @euglossine4ever Жыл бұрын

    ❤❤❤❤❤

  • @stormwix
    @stormwix2 ай бұрын

    1:32 The second picture to the left kinda reminds me of a Hyperbolic tessellation 🤔. Anyone else?

  • @Stiegosaurus
    @Stiegosaurus3 ай бұрын

    LOL @ toxic libs. What a great name. Dual meaning

  • @SleepyGarysGameStream
    @SleepyGarysGameStream Жыл бұрын

    👍👍

  • @Zzkkb98
    @Zzkkb98 Жыл бұрын

    The only place wheyi feel that i can code what i want

  • @bwremjoe
    @bwremjoe Жыл бұрын

    What about detecting and resolving colisions between two soft body objectS? Sounds like a can of worms ^^'

  • @zer001
    @zer001 Жыл бұрын

    07:24 is this like the using system.windows.forms in C#?

  • @alwysrite
    @alwysrite Жыл бұрын

    jesus ! you have risen from the dead ! happy easter : )

  • @alexandermcclure6185
    @alexandermcclure61852 ай бұрын

    but how do i make the springs themselves without toxiclibs :(

  • @PS3centere
    @PS3centere Жыл бұрын

    when destructuring you can write {VerletPhysics2D: physics} to rename the destruct.

  • @TheCodingTrain

    @TheCodingTrain

    Жыл бұрын

    Oh! I did not know this!!

  • @ToastaToast
    @ToastaToast Жыл бұрын

    I'd like to learn more about object destructuring

  • @deanolium

    @deanolium

    Жыл бұрын

    It's pretty straight forward. Say you have an object `X` with the properties `a`, `b`, and `c`. You can access these by doing: X.a X.b X.c You can also assign these to local variables to make it easier to access: let a = X.a let b = X.b let c = X.c Object destructuring is a thing which lets you do all this in a single line by doing: let {a, b, c} = X This then creates local variables which are set to the properties on `X` that have the same name. You can use this to pick and choose which properties you want: let {a, c} = X // This only picks X.a and X.c You can also rename properties: let {a: newA} = X // We now have a variable called newA that is the same as X.a Finally you can store the remaining, non-picked properties using the rest operator `...` let {a, ...otherProps} = X // We now have the variables `a` and `otherProps` where `otherProps` is an object with properties otherProps.b and otherProps.c It's all basically shorthand but very, very useful.

  • @joshblitz194
    @joshblitz194 Жыл бұрын

    Is there a circuit emulator playlist on this channel?

  • @codingcompetitiveprogrammi6118
    @codingcompetitiveprogrammi6118 Жыл бұрын

    can you make video about algorithm and structure sir you should become professor and teaching in highest university like MIT and harvard

  • @x_czt
    @x_czt Жыл бұрын

    The ToxicLib is the next Golan Levin

  • @lucbloom
    @lucbloom Жыл бұрын

    The JellyCar update is triggering a revisit of softbody physics projects by a bunch of devs :-)

  • @darkfrei2
    @darkfrei2 Жыл бұрын

    Is it code for slime and truss physics?

  • @andrewcrook6444
    @andrewcrook64447 ай бұрын

    Don’t they have dampeners with springs?

  • @sharadkumarsingh4802
    @sharadkumarsingh4802 Жыл бұрын

    Write a "complete" physics engine (from scratch) [in 60 mins]

  • @bbbasia100
    @bbbasia100 Жыл бұрын

    Does anyone done that in Visual Studio Code? I have problem with toxiclibsjs 🥺

  • @russellg3775
    @russellg3775 Жыл бұрын

    Wait, new edition of The Nature of Code coming?

  • @TheCodingTrain

    @TheCodingTrain

    Жыл бұрын

    Slowly but surely!

  • @matthewhook3375
    @matthewhook337510 ай бұрын

    Novice here, please could someone explain why referencing a global variable from within a class is considered bad practice (as discussed at 20:38)?

  • @unveil7762
    @unveil7762 Жыл бұрын

    🎉❤🎉

  • @gorillasun
    @gorillasun Жыл бұрын

    Juhani, look! You're on TV!

  • @ernest3rd

    @ernest3rd

    Жыл бұрын

    🤯

  • @howardalien2720
    @howardalien2720 Жыл бұрын

    How would one make this without a physics engine? Like from a raw programming language?

  • @garrethutchington1663

    @garrethutchington1663

    Жыл бұрын

    Learn the basic principles of physics and code it yourself 😊

  • @gower1973

    @gower1973

    Жыл бұрын

    You don’t need a physics library to do what he did here, it’s pretty simple stuff, have a look at his spring and pendulum videos, I took what he did there and implemented it c++ with direct 2d as the canvas

  • @deanolium

    @deanolium

    Жыл бұрын

    The paper he linked to has the basic formulae needed to create this. Basically it's about figuring out what the next position of a point is based on the previous position and acceleration vector applied to it. Then you add in the constraints, but rather than it be fixed, you use the constraints to change the acceleration vector applied to the point based on how far from the 'ideal' length the point is. Add gravity and you get your own physics engine.

  • @howardalien2720

    @howardalien2720

    Жыл бұрын

    thanks guys

  • @gknomics
    @gknomics10 ай бұрын

    hey daniel i tried copying the code but on my end it isnt working can you pls explain?

  • @gknomics

    @gknomics

    10 ай бұрын

    btw really great video

  • @superdepressif6047
    @superdepressif6047 Жыл бұрын

    i missed you 😞

  • @aliciadelpino8209
    @aliciadelpino8209 Жыл бұрын

    I'm doing it on vs code and it says that 'GravityBehavior' is undefined and that it cant access "physics" before initialization :(

  • @TheCodingTrain

    @TheCodingTrain

    Жыл бұрын

    Can you pop into the coding train discord we can help there! Link in description.

  • @aliciadelpino8209

    @aliciadelpino8209

    Жыл бұрын

    @@TheCodingTrain Thank you for replying so fast! that's amazing, I will do that, thank you!

  • @01binaryboy
    @01binaryboy Жыл бұрын

    Buy the Book(Nature of Code 2nd edition) option not working

  • @TheCodingTrain

    @TheCodingTrain

    Жыл бұрын

    It's not out yet, the site is just a preview! (old version: natureofcode.com/)

  • @toastyPredicament
    @toastyPredicament Жыл бұрын

    Finally

  • @luigidabro
    @luigidabro Жыл бұрын

    Me learning C# now, yay!