“Be careful what you ask for.”
We created this demo to give those thinking about a WebGL experience a little insight on models.
Assets rarely come in the format we need. We often receive CAD models and digital plan drawings that are believed to be 3D. Often times they are 2D drawings saved in the 3D format or they have been created in a 3D application that we don’t have access to or that has been discontinued. So, when asking for 3D models to use in your next project, be sure to specify the applications and versions you use with preferred file format.
Even with the best laid plans, sometimes you get a model asset that was used in a video/animation where triangle count and texture sizes were not a limiting factor and you have to reduce it. This particular Demo started off with such an asset with 17 million triangles.
Jet engines are filled with hundreds of thousands of polygons. Removing the interior of the jet engines reduced the triangle count greatly but it wasn’t enough to get us to the 300,000 target. To get the triangle counter even lower we had to remove detail on the fan blades. So much so that the fan blades didn’t look quite right. However, by animating them, the focus becomes on the movement of the blades rather than their specific shape. A common practice in WebGL modeling. If it moves, it doesn’t need all its static detail.
For those who are very familiar with a planes, you might be thinking … the wireframe is a Boeing 777 x because of the landing gear, but the final product looks more like a Boeing 737. And, you are right. We started with a 777 x and reproportioned it to be a 737 (in size), but we will leave that for another discussion.
Triangle reduction or polygon reduction is a term you will often hear from us or anyone that’s involved in WebGL or the creation of video games. Our model arrived with full engine detail, interior of the plane, cockpit, landing gear, nuts and bolts and even wiring.
The key to reduction is knowing in advance what the user will see. In our demo’s case, we wanted to show how models are hollowed out and what items are removed. A flying position with wheels up, windows opaque, no ability to see within an engine allowed us to remove 1.2+ million triangles getting us to 240,037, below our target of 300,000. Keep this in mind as you prepare your model for export for use in WebGL. It may be easier to hide or remove them in your 3D application than having to have the WebGL developer remove them.
