Hacker News new | past | comments | ask | show | jobs | submit login
Show HN: Mechanical clock simulation in WebGL (nikital.github.io)
109 points by nikital on Oct 17, 2015 | hide | past | favorite | 37 comments



Nikita, this is brilliant. I've been doing some experiments with creating 3D models for How a Car Works using threeJS (there's a very basic alpha proof-of-concept at http://www.howacarworks.com/3D/charging-a-car-battery ). I'd love to commission you to create some moving models of car components - drop me an email if you're interested me@alexmuir.com


That was a useful animation: it made me realise that I didn't really know how a clock worked; I only had a fuzzy -and wrong- understanding of how the the parts worked together.

Good use of visualisation and animation is an extremely powerful tool for triggering that aha! moment.


Me too, I went from thinking I sort of new something about how clocks work to actually understanding it properly for the first time ever, reading a small amount if text, again to get to the 'I get it' moment.

I also think that this is possibly because this is a model of a real clock that really worked, once upon a time. So the WebGL model works as per the real world clock, not some 'example' model made from theoretical pieces.


I think you mounted the main spring the wrong way? The way it is currently, the clock's operation would wind it tighter.


You're right, I missed it. Nice catch :)


In Chrome, the minute hand didn't move anywhere near 10 minutes worth over 10 minutes of watching the mechanism. Are the gear mechanisms designed to accurately reproduce a real hour/minute clock, or is it just intended to be an example of the kind of mechanism used?


I'd imagine it's deliberately slowed mainly for illustrative purposes; for comparison the balance wheel in my watch is currently spinning too fast for me to see.

It could also be an fps thing


Nice animation. I'd add the option to show the speed of each gear (a curved arrow around the axis, with a label "1 turn per 15 seconds", and perhaps the number of cogs in each gear).

I'd like to see one additional simple version with only one gear, so it's easy to understand how the balance / anchor / escape work.

Another nice version would be a linearized version, where all the gears are in a row, so they are easy to see. Bonus points for a smooth transformation from the linearized version to the actual version.


Thanks for the feedback. Regarding the simple version, did you see that you can rotate, pan and zoom the camera? You can focus on the escapement to get a better view. You can also slow it down using the speed slider.


Balance wheel(oscillating wheel in demo. Its the brain. it keeps the time accurate)--->Lever escapement fork(looks like pin pallet. Your watch's fork looks more like a dinner fork)--->Escapement wheel--->Fourth wheel--->Third wheel--->Center wheel(holds the dial hands)---<>Barrel wheel(stores the power. connects to Center wheel). The small wheel connected to only the center wheel is the setting wheel.

The animation makes the it so much easier than a verbal walk through. Couldn't stop chiming in; I am working on a pin pallet watch (Amida 542 movement) right now, and frustrated. The blue mainspring just broke, and its a weird size, measured in Dennison units. I need a social life.

If interested in Watch repair buy Practical Watch Repairing by Donald De Carle, preferably 3rd. edition. to start your library. If you really want to build a watch from a chunk of brass, maybe a little gold, and watch lathe, buy George Daniels book Watchmaking. George Daniels invented the Co-axial escapement(an unusual escapement that Omega adopted, and might not need lubrication.), and was a great Watch Maker/machinist. He supposedly did his best work after 50.


Nice. It seems that small spring is driving the "ticking" of the clock, so does the winding of the springs wind both the large and small spring? Also, it's surprising to me how the small spring could tick accurately, since I would think that it's rate of oscillation changes as the spring unwinds, so that you cannot rely on each tick being a constant amount of time. How is the problem avoided or mitigated?


The mainspring provides all the mechanical energy. The small spring is called the escapement, it spins one way, then back the other at a set frequency (typically 4, 6, or 8 times per second), letting the energy of the mainspring 'escape' gradually (instead of unwinding all at once, in a rush).


So the small spring is what makes it run accurately? I wonder how hard it is to make the small spring accurate without modern tools (1800s technology).


This provides a good description of how the balance wheel works:

https://en.wikipedia.org/wiki/Balance_wheel

It is manually tuned, via weights and spring tension, to oscillate at a precise interval.


Think of the main spring as the battery, and the balance wheel as a kind of resistor. The balance wheel is manually tuned to oscillate at a specific rate, releasing the stored energy one little beat at a time.

You are right that a mechanical system like that isn't perfect. You will get a kick out of a thing called a "Tourbillon" if you look that up - it was an attempt to improve the accuracy of mechanical movements by having the entire movement rotate as it unwound, in the hope of mitigating the effect of gravity on the accuracy of the watch over the course of the day.


The whole purpose of the website was to answer all these questions. If you had clicked for example on 'Balance' it would have told you what the little spring does and how it's always constant.


I had indeed done that, and it doesn't answer the question I asked to my satisfaction. Comments on a thread like this are a great place to ask technical questions, and I often learn new things by doing so. It's my favorite part of HN. You might find life a bit more pleasant if you didn't assume the rest of the world was just lazy and needed to be shown the error of their ways.


Zooming-in is a bit tricky as a page scroll is triggered. Might help to add

  event.preventDefault();
to the wheel event listener function.


Oh, cross-browser issues. There shouldn't be any scroll bars at all... What browser/OS?


Safari 9 on OS X 10.11 has this behavior.


I'm not entirely sure, but zooming closer to gear teeth interaction, it looks like cogs aren't aligning perfectly like they do in real life? I'm viewing this in firefox, so that might be a reason as well.


In real life the do align perfectly, otherwise they will get stuck.

Here there are off a bit because 1. I didn't get the sizes absolutely right as I modeled it in Blender and not in a real CAD (like Gearotic) and 2. The gear simulation is iterative so some floating point error accumulates over time.


Thanks for the explanation :)


An Electrical Engineering View of a Mechanical Watch:

http://video.mit.edu/watch/an-electrical-engineering-view-of...


This is really cool!

WebGl is so difficult, UI-wise, on a tablet. It's not your fault, but I wish Apple would translate some of the desktop metaphors (scroll/pan/zoom) for this context.


It looks like the main spring is flipped 180 degrees. I speeded up the clock movement and it looks like it would be tightened, not loosened.


Nice, but I don't think the escape wheel animation is correct. The explanation says it pushes something but I don't see it.


The escape wheel is actually pushed indirectly by the large spring, it pushes against the metal pins that stop it from freely rotating. The smaller spring with the pendulum attached (the balance) then flicks the anchor which allows the escape wheel to advance one tick.


Nice! Can you give more details on how you made the simulation?


Sure: I wrote it in Typescript, modeled everything in Blender and rendered with three.js. The simulation logic itself it in https://github.com/nikital/clock/blob/master/src/mechanics.t.... That code is a bit messy but it gets the job done :)


Very cool and informative at the same time. Well done!


It's an animation, not a simulation.

And not a very good one, gear teeth intersect all over the place:

http://i.imgur.com/xDWigpp.jpg


Where's yours?


Just because I'm not a writer, doesn't mean I can't point out the spelling errors in books.


i hope next version will come with tri-axial tourbillon :)


Beautiful.


cool




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: