Verge3D content can be deployed on your own web servers or uploaded to the distributed hosting platform called Verge3D Network. In total, this simple app offers as much as 12 ring variations! Getting online On the left side, you can see the show/hide puzzles while the right side is responsible for changing ring materials. This is how the logic looks like in the Puzzles editor: In this jewelry app, we have 4 different ring models which come with silver, rose, and yellow gold variants. Just use the “when clicked” puzzle to make your app respond to user actions, “show”/”hide” to change the ring shape and “assign material” to change materials. With Puzzles, you don’t need to be a programmer to create a fancy 3D configurator. The exception is normal map textures which need to be generated from the high-poly models and baked on top of middle-poly ones. The most of them are basic noise/bumpy/environment procedural maps which you can create by yourself or find some ready-to-use images on the web.
Actually, there is nothing complicated here.
#Build your own interactive product builder how to
You might have a question on how to produce textures for such materials. The same is for 3ds Max diamond material, the image below includes both gem’s layers: This is just a cover mesh representing the diamond’s sides: The next image displays the gem’s external layer. The gem’s internal layer has an irregular mesh structure and the following material: To make the diamond shine and blink we modeled it using two layers. This is somewhat easier since it has an additional Diffuse Color texture representing the color of the rendered surface. This is how the same silver material looks in 3ds Max.
Since we have 3 different materials: Silver, Rose and Yellow Gold we just make minor adjustments to the same node system configuring the required colors on ColorRamp procedural maps. The first one represents “metallic” surface and the other two make the rendered material more realistic. What we are basically have here is a spherical texture (called “ring_matcap”) mixed with noise and normal map textures. This is how the silver material looks in Blender. Remember, you can always familiarize yourself with materials by checking the source files of this jewelry app. The next stage is creating materials and textures. Please note that for the best results your 3D objects should be middle-poly, basically do not use more than 100k polygons per model. Type a project name in the app creation dialog and leave the other settings as is. But if you have some 3ds Max or Blender experience, or a friend or employee who has such experience, you will be fine.įirst of all, init your jewelry personalization application using the Verge3D App Manager. Let’s review the production process step-by-step. Make your 3D app interactive by using the Puzzles editor.Create 3D content (models + materials).Summaryĭon’t listen to people who say that creating 3D product configurators is hard and expensive – it is actually quite easy! Just stick to the plan: If not, check out Verge3D for 3ds Max or Verge3D for Blender installation guides. Also, in this article, we assume that you already have Verge3D installed. Since Verge3D works for both 3ds Max and Blender, we’re going to make this tutorial 3D package-agnostic. In this article we’re going to review the process of making a simple 3D jewelry configurator which looks like this (click on the image below to run it online): Jewelry configurator built with Verge3D.īy the way, you can find the source files (3ds Max, Blender, and Puzzles) for this configurator in the Verge3D distribution. In this tutorial, we describe the most straightforward and easy-to-use pipeline to create such applications. Thankfully, with Verge3D you can build interactive 3D customizers pretty easily. The only problem that prevents this trend to grow even faster is the lack of efficient tools. They were made possible thanks to the rapid development of WebGL, a technology for displaying 3D graphics right in the customers’ web browsers. 3D product configurators is a major new trend in online marketing and e-commerce.
0 kommentar(er)
