Coding Challenge #20: 3D Cloth with toxiclibs

Subscribers:
1,750,000
Published on ● Video Link: https://www.youtube.com/watch?v=jrk_lOg_pVA



Category:
Tutorial
Duration: 30:40
90,273 views
1,396


Boing! Using some particles and some springs with the Toxiclibs physics library, I create a 3D cloth simulation in Processing. Toxiclibs can now be downloaded from Processing's library manager. Code: https://thecodingtrain.com/challenges/20-3d-cloth-simulation

๐Ÿ•น๏ธ p5.js Web Editor Sketch: https://editor.p5js.org/codingtrain/sketches/U6n24GfsD

๐ŸŽฅ Previous video: https://youtu.be/z86cx2A4_3E?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
๐ŸŽฅ Next video: https://youtu.be/6z7GQewK-Ks?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
๐ŸŽฅ All videos: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH

References:
๐Ÿ“ Toxiclibs Physics Library: http://haptic-data.com/toxiclibsjs

Live Stream Archive:
๐Ÿ”ด Coding Train Live 42: https://youtu.be/nfU-NqnXn1o?t=8453s

Related Coding Challenges:
๐Ÿš‚ #62 Plinko with Matter.js: https://youtu.be/KakpnfDv_f0
๐Ÿš‚ #159 Simple Pendulum Simulation: https://youtu.be/NBWMtlbbOag
๐Ÿš‚ #160 Spring Forces: https://youtu.be/Rr-5HiXquhw

Timestamps:
0:00 Introduction
1:10 What is Verlet Physics?
1:54 Code! Create Particles
5:27 Add Physics to the Particles
6:17 Add Gravity
8:41 Create Springs between Particles
11:51 Lock Particles
13:26 How to make a Cloth?
14:06 Code! Create a Cloth
20:22 Add Gravity back in
21:30 Make it 3 dimensional
24:06 Pin the Cloth on 4 Corners
28:18 What you can do with Toxiclibs
28:40 Where missing some Springs

Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound

๐Ÿš‚ Website: http://thecodingtrain.com/
๐Ÿ‘พ Share Your Creation! https://thecodingtrain.com/guides/passenger-showcase-guide
๐Ÿšฉ Suggest Topics: https://github.com/CodingTrain/Suggestion-Box
๐Ÿ’ก GitHub: https://github.com/CodingTrain
๐Ÿ’ฌ Discord: https://discord.gg/hPuGy2g
๐Ÿ’– Membership: http://youtube.com/thecodingtrain/join
๐Ÿ›’ Store: https://standard.tv/codingtrain
๐Ÿ–‹๏ธ Twitter: https://twitter.com/thecodingtrain
๐Ÿ“ธ Instagram: https://www.instagram.com/the.coding.train/

๐ŸŽฅ Coding Challenges: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
๐ŸŽฅ Intro to Programming: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA

๐Ÿ”— p5.js: https://p5js.org
๐Ÿ”— p5.js Web Editor: https://editor.p5js.org/
๐Ÿ”— Processing: https://processing.org

๐Ÿ“„ Code of Conduct: https://github.com/CodingTrain/Code-of-Conduct

This description was auto-generated. If you see a problem, please open an issue: https://github.com/CodingTrain/thecodingtrain.com/issues/new

#3d #cloth #physics #simulation #processing #toxiclibs







Tags:
coding
challenge
3d
cloth
patreon
processing
processing tutorial
nature of code
tutorial
coding challenge
creative coding
programming challenge
object oriented programming
algorithms
oop
p3d
p3d processing
processing (programming language)
learning processing
cloth simulation
verlet physics
verlet physics tutorial
particles
springs
spring tutorial
javascript verlet physics
3D cloth