In August 2022, the famous TIME magazine featured the exciting concept of Metaverse on its cover, showing its continued popularity. The popularity of the metaverse has soared since Facebook rebranded itself. This has resulted in a number of new projects popping up. These projects offer innovative and rewarding applications.
3D
How to Load an OBJ 3D Model with its Texture in Three JS?
Most of the 3D models that we want to use in games, such as characters, furniture, closed areas, rooms, cars, etc, are designed in the OBJ format and naturally, they have a texture too. The texture is usually exported in the MTL file format. Most of the prepared free…
Specular Map Three JS: A Fantastic Tutorial
The specular map is a texture image that affects the specular surface highlight on MeshLambertMaterial and MeshPhongMaterial materials. Using the specular map, you will be able to set the shininess of a surface by giving the a grayscale value from white to black or from 0 to 255. The…
How to Rotate Camera in Three JS
This tutorial focuses on a simple but useful animation you can create in your scene by rotating the camera. At first glance, you might think there is no need to rotate the camera as long as we can rotate the object. But in fact, the main reason we need…
Point Cloud Effect in Three JS
This tutorial will focus on an exciting topic called a point cloud. Technically, we use a point cloud for creating the polygons. Then using the normal of the polygons, we make the meshes. In Three JS, the point cloud is also used for aesthetics, which means we use the…
How to make a skybox in Three.js: A perfect guide
A skybox or a cubemap is an interesting topic if you want to create a scene of nature, open ambient, a room, and so on. The skybox looks the same as an HDR image in 3D space, where you can see the 360-degree view of the area you want…
Bump Map vs Normal Map in Three JS
In many 3D designing platforms, especially in WebGL and the Three.js, we have the concept of bump map, normal map and the displacement map. You have probably heard or read about these three kind of mappings, if you have ever searched about the textures and how to create them.
How to Use Multiple Cameras in Three JS
In this tutorial, we will cover one of the less available projects in Three.js on the internet. And that is creating multi-camera scenes. Up to now, nearly all the projects in Three.js that we have seen have the object and scene using only one camera and the viewer was…
Three.js Realistic Shadows: A Practical Guide
In this tutorial, we want to create more realistic scenes by making the shadow effect. There are many parameters in creating a shadow of an object. One of them is the material. For instance, if you use the Mesh-basic material, you will see no shadow effects. The next important…
How to Rotate Objects Using Transform control in Three JS
nside every 3D design software, we have the tools for translating the object, meaning we have a button for transferring the object from one point to the other. In addition to that, we have tools for rotating the object and also scaling it. These three are the essential tools…