Live data from Hacker News

Tearable Cloth Simulation in JavaScript

codepen.io

141–150 of 159 posts

Re: Tearable Cloth Simulation in JavaScript

#141

Without wishing to appear negative, I do find it odd the way that a technical crowd react to these online demos. Would you have found this impressive if it was a compiled executable? Because this is just the same thing, just running slower because it's on the web. It's not technically novel in any way. If you're curious about the algorithm, then take a look at the presentation 'Advanced Character Physics' by Jacobson…

Please let us be impressed by whatever impresses us.

Re: Tearable Cloth Simulation in JavaScript

#142
post #29
post #25

Can anyone speak to what's going on in these algorithms? I'm interested in the physics/math behind them. For example, how much about partial differential equations do I need to know to understand them?

It's very simple really. It's a grid of point masses with constraints between them (the lines you see) that says to keep the points at a constant distance from each other. Think of the constraints as springs that follow Hooks law[1], only infinitely stiff. You iterate through all the constraints and move the two points of each constraint apart if they are too close, or closer if they are too far apart. You need some…

One of the things I love about encountering things like this on HN are comments like these, which are even more informative than the original post. I'd seen the demo in the OP, and thought, "neat". Later on, I read comments that say, "Oh, you just need to ___ the ___ with ___, and use ___'s Law to ____ for the whole grid" --- most of which is completely over my head. In some perspectives this might seem discouraging -- trivializing the difficulty of learning it. However, I find it tremendously invigorating: the idea that it's simple for someone with the right learning and knowledge means that it's something I could do to, if I wanted to spend the time to learn it.

Thanks for posting comments like this. It opens my eyes to questions I didn't even know I had. ("What's a verlet?" "Oh man, I need to re-learn my linear algebra someday...")

Re: Tearable Cloth Simulation in JavaScript

#143

Without wishing to appear negative, I do find it odd the way that a technical crowd react to these online demos. Would you have found this impressive if it was a compiled executable? Because this is just the same thing, just running slower because it's on the web. It's not technically novel in any way. If you're curious about the algorithm, then take a look at the presentation 'Advanced Character Physics' by Jacobson…

Imagine if HN and comp.sys.ibm.pc.demos really would have the same audience. So everybody'd be like "oh, cloth simulation. we did that in the 90s", as well as, "... in javascript, even! ... just like scenerdude303 did 8 years ago, except he didn't have a canvas-element back then, web browsers were still make of wood and he had to get up at 5am to write the code in the snow when it was still fresh, type with his bare…

    When making art, there is tremendous value 
    in doing what has been done before. 
    It's called practice, and the value is having 
    the experience of having done something yourself.
This is so true, and so often overlooked in the rush to "innovate" or "disrupt" or compete with those around us. The most creative creations are an act of play, and it takes a lot of practice to get that good at playing.

Re: Tearable Cloth Simulation in JavaScript

#144

Without wishing to appear negative, I do find it odd the way that a technical crowd react to these online demos. Would you have found this impressive if it was a compiled executable? Because this is just the same thing, just running slower because it's on the web. It's not technically novel in any way. If you're curious about the algorithm, then take a look at the presentation 'Advanced Character Physics' by Jacobson…

Without wishing to kick even more sand in your face, I thought it was pretty cool. I was as impressed with codepen (which I hadn't seen before) as I was with the demo (oh, they really can do some pretty neat stuff in javascript these days).

It's like this video: http://www.youtube.com/watch?v=GcDshWmhF4A

Where a guy builds a binary adding machine out of wood and marbles. I've seen them before. I've even seen nicer ones (more expertly constructed). His little counter / adder isn't really a feat in any way. I could even show you how to build a vastly better one with a CPLD. Yet, I am still impressed, and amused when I see that someone has built one. Wood, Minecraft, Little Big Planet, anything else.

But, don't stop being a hater. I even got something useful from your post 'Advanced Character Physics' by Jacobson. which is interesting, and which I probably wouldn't stumble across on my own.

Re: Tearable Cloth Simulation in JavaScript

#145
post #66

Earlier quoted context omitted.

Yes, I would find it impressive. Problem is, there's about a 5% chance I'd ever get to downloading and running it. Especially since it very likely wouldn't be compiled for mac or linux (the only systems I have) and I very very likely wouldn't feel inclined to compile it myself. That's why we love javascript demos. We're lazy sods.

In which case the impressiveness must be coming from the lack of domain familiarity. It's basically getting excited about a game physics 'Hello World'. I remember a good few years ago a colleague writing a fully textured 3D cloth sim that would remotely unfurl on your screen, displaying a given message on the cloth. He used it to display goatse.cx to me, which I wasn't very pleased about. This was developed in python…

It's true, stuff like this was covered with free sample code in Game Developer magazine 10-15 years ago.

OTOH, realize that many readers here were probably not programming then.

Programming is the archetypal field where everything old is new again. The antidote -- dig up all those 1-2 day projects you did 10 years ago that you think are stupid / too simple, and re-package them for the kids.

Re: Tearable Cloth Simulation in JavaScript

#146

Without wishing to appear negative, I do find it odd the way that a technical crowd react to these online demos. Would you have found this impressive if it was a compiled executable? Because this is just the same thing, just running slower because it's on the web. It's not technically novel in any way. If you're curious about the algorithm, then take a look at the presentation 'Advanced Character Physics' by Jacobson…

But it is a scripting language! And it can draw in 2D in real time. And it is deployed to a very popular fat-client over the network. And it even looks like decent frame rate. On my quad-core machine. What is there not to be impressed with in 2013?

Time to re-implement all of these in JS, now that most people don't enable Java applets: http://www.red3d.com/cwr/steer/

Re: Tearable Cloth Simulation in JavaScript

#147

Without wishing to appear negative, I do find it odd the way that a technical crowd react to these online demos. Would you have found this impressive if it was a compiled executable? Because this is just the same thing, just running slower because it's on the web. It's not technically novel in any way. If you're curious about the algorithm, then take a look at the presentation 'Advanced Character Physics' by Jacobson…

Imagine if HN and comp.sys.ibm.pc.demos really would have the same audience. So everybody'd be like "oh, cloth simulation. we did that in the 90s", as well as, "... in javascript, even! ... just like scenerdude303 did 8 years ago, except he didn't have a canvas-element back then, web browsers were still make of wood and he had to get up at 5am to write the code in the snow when it was still fresh, type with his bare…

[deleted]

Re: Tearable Cloth Simulation in JavaScript

#149
post #16

Earlier quoted context omitted.

Especially since more cloth is only a refresh away, whereas bubble wrap.... well, you only get so much of it at a time.

flash, but here you go: http://www.virtual-bubblewrap.com/bubble-wrap.swf

There goes my evening :(
Post reply on HN