Steam engine modelled after a real-world kit

Ladies, Gentlemen,

I’d like to show off my latest interactive 3D animation of a model steam engine. It’s been modelled after a commercially available kit for the steam engine “Danni” from “Bengs Modellbau”, a Germany-based small supplier. My animation of this little engine is geometrically and functionally exact (mathematically), while I took a little artistic freedom in its presentation in that I show the main cylinder as semi-transparent, so as to reveal the current position of the double-action piston inside. Depending on the current angle of the crankshaft, Pressure is applied to either side of the piston, alternatively. The flow of the pressurized air (or steam, for that matter) is directed via an excenter-controlled valve, which I’m showing as a horizontally cut piece for better understanding.

In terms of three.js, my animation features reflective materials, extensive use of the “metalness” property of MeshStandardMaterial, InstancedMeshes for the configurable display of the little screw heads, custom tweaked u-v coordinates for the LatheGeometry, which constitutes the excenter disc*, variable speed, a stall/restart option and some more.

'* I needed those for the proper placement of a checkerboard 2x2 pixel data texture for display of the Exzenter Helper (UI option).



wowww what a lovely little sim! Really enjoy these kinds of visualizations. nice work!


@manthrax Thank you for the praise :sunglasses:

If you like the idea of the machine as such (let alone its three.js based animation) you may as well enjoy a youtube video of a real-life copy of this model engine in motion:

Its base plate is btw. 4 by 6 inches, or 100 by 160 mm wide. Basically the size of a man’s palm.


Love the neatness and aesthetics of the scene :heart_eyes:
Gut gemacht! :handshake:

1 Like

A wonderful visualization.

This brings back memories of my childhood, when I used to travel on trains hauled by steam locomotives. I also ran a real little toy steam engine with a friend. It came from our fathers’ childhood.


Cute. Engine dioramas are cute.

1 Like

@prisoner849 Thanks Paul.

Speaking of “neatness” does in fact ring a bell with me. I invested a rather significant amount of money and time to acquire a small lathing machine, the associated tools and the recessary skills which were required to actually manufacture my own copy of this little machine. The visual and manual precision requirements are demanding, especially if you’re starting “from scratch”. And obviously the result deviates in terms of “neatness” from the pure aesthetics of a “perfect” visualisation … :roll_eyes:

Anyway, my copy of this little machine already runs from the power of my breath, or diaphragm that is, Have a look at this, if you will:


@hofk Thanks, Klaus.

I too, have fond childhood memories of building a little steam engine. Which was the climax of the KOSMOS physics experimental education toolkit “Technikus”. Obviously a very crude engine, but rattling from genuine steam from an included kettle and a spirit burner. Huge fun for a ten year old.

One boy posted a video on youtube of his copy, running at seven (7!) revs/second:


This is rad!
Meinen Respekt! :heart:

1 Like

I would like to have seen the steam generator, too. A steam engine might be an excellent emergency power source.

1 Like

very good, very hard work without physics library

1 Like


*Be the change, you want to see in the world* - Mahatma Ghandi

Seriously: since there are no moving parts involved in steam generation, this didn’t seem like an attractive endeavor to me. Showing the steam flowing through the valve and into / out of the cylinder chambers would have been an entirely different matter, but would probably involve particle systems and physics, which is beyond my current capabilities.

So: sorry to leave you not fully satisfied.


Actually most of the work went into modeling of the different machine parts in Cinema4D. The subsequent export as vrml-files and import into my viewer program using Thre.js’ VRMLLoader() was a workflow I had already established in my previous “featured project” (see my profile for this).

Besides: although the display of this scene is 3D, the involved kinematics is purely two-dimensional and straightforward. The trickiest part of which was getting the positions of the few moving screw heads (UI option) right. Which - being InstancedMeshes - need to get recomputed for each frame.

Nicely done! (I love these little animations.)
A couple of suggestions:

  1. I would use brushed chrome, especially on the rotating chrome parts. They are rotating, but it is hard to see that they are…
    2, (This may be fixed by the above) but red lines seem to appear in the reflections. I am not sure where they are coming from.
1 Like

pretty good!
I love this honed vision and animation. Particularly, when change the speed of animation, I feel something excellent. I thought you can create a scene when the train is start leaving off. :slight_smile:

1 Like

@phil_crowther Thanks for your suggestions and your appreciation!

re 1: You’ve got a very valid point here and I just didn’t know how to get rid of it without losing the reflective property which I want to keep. Could you by any chance give me a THREE. *Material parameter set to start from? This issue was btw. my motivation to include the “ExcenterHelper” UI option.

re 2: you have a keen eye :+1:. The red lines come from a self-made spherical panorama bitmap which I’m using as a reflection map. I added straight vertical red lines every 90° longitude as a visual debugging aid in a different context and was as of now too lazy to switch to a different, clean reflection map :roll_eyes:

Please allow me to clarify my comment. The 1’ 53" video you embedded in your initial posting shows a plastic tube going off camera to the right. I watched the entire video hoping that the camera would pan to the right to show how the steam was generated and regulated. Was it an electric kettle? A pressure cooker on a gas stove? Was the speed regulated by a thumbs-on valve? The omission of the steam generator in the video and its regulator is what I was thinking about when I made my comment and I jumped to the conclusion you had made the video. Please understand I would never be so presumptuous to suggest you alter the impressive JavaScript model you created. I cannot imagine how many hours it must have taken you to design and program it. I shared your posting with a colleague I was so impressed.

I’m guessing the video of the Danni you included was from the kit manufacturer (see some really impressive kits at Modellbausätze & Materialbausätze kaufen – there is an English version of the web site) and it is they who might have included a view of the steam generator which I am guessing is an accessory the sell, too.

I apologize for any hurt feelings you may have harbored as a result of my not-so specific comment. Now that I have visited the manufacturer’s web site, I’m really impressed with the array of kits they offer. Some serious money could be spent here. I was unable to find, however, any steam generator, though there were accessories for a steam generator. Perhaps steam generation is a high liability component?

1 Like

@JohnPoole John, relax. :blush:
Nobody was offended, certainly I wasn’t. The video in my opening post is in fact from the supplier of the kit. His steam engine in this video is powered via pressurized air @0.5 bar ( 7.5 psi) pressure, briefly elevated to 1.5 bar (22 psi).

See my earlier post in this thread, where I show my own copy run from compressed air from my very lungs :muscle:

If you’re impressed by the “serious money” that can be spent on this activity, be warned that the tools and machines required to build such little machines from a kit are more than an order of magnitude more expensive. It comforts yourself to think of the interior of your little workshop as an “investment”, rather than a “consumption”, though …

1 Like

re 1: What material are you using? With MeshStandardMaterial, you should be able to simply adjust the roughness factor.
re 2: Ok, I though I was seeing things. :face_with_spiral_eyes:

1 Like

@phil_crowther This is what I’m currently using as reflective Material:

	chromeMaterial = new THREE.MeshBasicMaterial( {
			 envMap: cubeRenderTarget2.texture,
			 combine: THREE.MultiplyOperation,
			 reflectivity: 1.0
	 } );