Dismantle 3D Model into fragments

3D model consist of triangle faces.

The final outcome of my idea

Background

I have been learning Three.js from a lot of examples in its repository. In this time, I pick up two examples and regenerate into new visualization. I am excited to publish my tiny demonstration. Basically, this effect comes from the following images.

Left example / right example

Workflow

* Load model
* Create geometry from model
* Create scene, camera
* Create Mesh for polygonal model with shader material
* Render scattering fragments

I place emphasis on the creation of a polygonal object and dismantled triangle parts. Therefore, I will explain these procedures in that point of views next.

Highlight Code

Create polygonal model

In the example of modifier / simplifier , they supply the diminishing code as SimplifyModifier class. It is not native support code in Three.js but well-maintenance code. So we can use it as follows.

var loader = new THREE.FontLoader();
new GLTFLoader().load("models/gltf/LeePerrySmith/LeePerrySmith.glb", function…