Kaino Wagon three.js website

Check out the website here: Kaino Wagon

***

This is my first three.js website. The wagon model was made with Kaino's course on YouTube, but significantly modified for optimization and improved appearance. All textures were made using the baking method on the UV unwrap. The website was created to solidify the knowledge gained from Three.js Journey course.

The size of the house model is only 550kb, as it contains only geometry and UV mapping. Additionally, it is exported with Draco compression. The model itself has 126,000 triangles.

Two 4k textures were created for the model, with a total weight of 7.7mb. They were exported as jpeg with a compression setting of 90%, as there is only one model. However, 90% compression is too high. Choosing 75% will significantly reduce the weight, with moderate artifacting.

There is also a small alpha texture for the shadow from the letters, which is a black and white mask that weighs only 290kb and has a resolution of 2k.

Thus, everything that the website loads fits within 8.5mb.

Posted on Apr 16, 2023

More by Alex Buninman

View profile