Home › Forums › Programming › Configurator
- This topic has 18 replies, 3 voices, and was last updated 5 years, 11 months ago by Mikhail Luzyanin.
-
AuthorPosts
-
2018-12-03 at 12:47 pm #9430scalareCustomer
Hello,
I’m evaluating Verge 3D to create a custom product configurator. We’ll have products that are made up of many pieces, each of which can be customized in terms of both geometry and materials (and in types of materials, too, like fabric, leather, wood, etc., so it is not just a matter of changing color values, but replacing textures and normal maps too)
Since there will be lots of materials that you will be able to apply to product pieces, I’d like to see if you can please answer me a few things:
1) Is there a way to replace an object material copying it from another object via puzzles in a single puzzle, or I would have to copy texture by texture and value by value?
2) Can I load objects (as in separate gltf files) into my scene, to use them as dummies to hold the materials specifications, based on user interactions? Would I be able to do that via puzzles, or I have to custom code that in javascript?
3) If I include all my materials in a single gltf file, and apply them to dummy objects that are not visible, will all the materials textures load during the initialization, or only when I make those objects visible / copy the materials to another visible object? I want to figure out if I can define all the materials I will need (even if they are not used right from the start) during initialization without making the scene too big to load.
and 4) Is there a performance reduction if I use puzzles to make some operation on objects or materials, calling functions defined with puzzles from javascript, compared to doing the same operations directly from javascript?
Thanks a lot!
2018-12-03 at 2:03 pm #9435Yuri KovelenovStaffHello!
1) Is there a way to replace an object material copying it from another object via puzzles in a single puzzle, or I would have to copy texture by texture and value by value?
Yes, you can use the assign material puzzle for that.
2) Can I load objects (as in separate gltf files) into my scene, to use them as dummies to hold the materials specifications, based on user interactions? Would I be able to do that via puzzles, or I have to custom code that in javascript?
Adding objects from extra gltf files is currently only possible with JavaScript.
var loader = new v3d.GLTFLoader(); loader.load(URI, function(gltf) { v3d.app.scene.add(gltf.scene); }
3) If I include all my materials in a single gltf file, and apply them to dummy objects that are not visible, will all the materials textures load during the initialization, or only when I make those objects visible / copy the materials to another visible object? I want to figure out if I can define all the materials I will need (even if they are not used right from the start) during initialization without making the scene too big to load.
You can possibly use the replace texture puzzle to load images on demand. We did so in our Scooter demo.
4) Is there a performance reduction if I use puzzles to make some operation on objects or materials, calling functions defined with puzzles from javascript, compared to doing the same operations directly from javascript?
We strive to optimize all the JS code generated by Puzzles. I think there will not a big difference in performance.
2018-12-03 at 2:34 pm #9437scalareCustomer2) Can I load objects (as in separate gltf files) into my scene, to use them as dummies to hold the materials specifications, based on user interactions? Would I be able to do that via puzzles, or I have to custom code that in javascript?
Adding objects from extra gltf files is currently only possible with JavaScript.
Thank you for clarifying that. One more question about this: If I load an extra gltf file via javascript, will I be able to refer to it using puzzles? So, for example, I load an external dummy via Javascript, and then I call a puzzle from that same javascript so that the material in that dummy I just loaded gets copied over to another object.
Also, is there a way to “unload” gtlf files?
And last, I remember that in blend4web, when you loaded an external json, you had to do it into a “level”, and keep track of that level to be able to refer to it. None of that is needed in Verge3D, right?
2018-12-03 at 2:37 pm #9438Mikhail LuzyaninStaffIf I include all my materials in a single gltf file, and apply them to dummy objects that are not visible, will all the materials textures load during the initialization,
You can assign your material on a sphere, cube or any other simple object and unset render icon on it so it vill be invisible to loaded into the scene and acessable for assigning to any other object. If you use BPR pipilen with the same structer of the material you can load different texture into one PBR Shader, this will be very optimized for amount of drawcalls, loaded textures at the beggining of the scene. You alos need to know if you assign a material from one object to another all this object (mesh) must have the same structure: if one of them has armature, shape keys or two or more UV-map it’s will be need to add the same thing to the second, so it will not broke out your armature, shapekeys or structure of the material. Be patient to this thing it can cost you a lot of time to redo all your scene.
Co-founder and lead graphics specialist at Soft8Soft.
2018-12-03 at 2:51 pm #9442Yuri KovelenovStaffIf I load an extra gltf file via javascript, will I be able to refer to it using puzzles? So, for example, I load an external dummy via Javascript, and then I call a puzzle from that same javascript so that the material in that dummy I just loaded gets copied over to another object.
Yes I think that will work.
Also, is there a way to “unload” gtlf files?
You can delete any objects you no longer need programmatically.
you had to do it into a “level”, and keep track of that level to be able to refer to it. None of that is needed in Verge3D, right?
Yep, just use a variable to reference it.
2018-12-04 at 1:31 pm #9504scalareCustomerOn second thougth: the creation of hundreds of dummy objects seems overkill at some point.
New approach. Can you please tell me if this makes sense, and if it would be possible with V3D? I’m thinking of somehow exporting the materials information as json/gltf that I can read via javascript when I initialize the app, and save all that info into an array of objects, associated with each material name. The array would have an object for each possible material, and for each one have information about base color / base texture, metallic/roughness, normal texture and so on. Then, based on user interaction, I would check what options are available for the selected material, and via puzzles, replace textures and/or values to reflect the material replacement. Seems like a lot less work since we don’t need to create any dummies, but I’m not sure of how to read that gltf and extract just the material information as a “flattened” definition. I’ve checked the gltf exports, and the json structure seems very complex because of the representation of the node graphs. Is there a way to export that information just as a “flattened” set of attributes, as if they were “resolved” values to apply to a Principled BSDF node?
I guess I’m asking for too much… :)
Thank you!
2018-12-04 at 2:15 pm #9512Yuri KovelenovStaffWell, you can probably create a library Blender/Max file with all material options assigned to very basic dummy objects (just planes). After exporting it will produce a rather big .gltf and a tiny .bin file. These files however will be very compact if compressed.
If you got too many material options you can split them into several libraries etc.But of course, you can go the fully programmer’s way and retrieve and modify all the parameters in a node material.
See the API and some examples here:
https://www.soft8soft.com/docs/api/en/materials/MeshNodeMaterial.html2018-12-05 at 11:46 am #9555scalareCustomerOK. The question is if all the textures inside that library file will download at the time I load the library file, or just when I apply those textures to an actual mesh. Since we will have hundreds of dummies, loading the library could take a very long time. Can you please clarify when the textures loading takes place?
2018-12-05 at 1:32 pm #9561Yuri KovelenovStaffTextures are loaded simultaneously with the corresponding gltf file – which of course is not an option if you got dozens of textures from which you only need one or two at some time.
For this case I’d suggest organizing your assets in 2 levels. You might create several “base” materials sharing the same shader structure. You can load them with the main scene and use puzzles to modify their Value and RGB inputs and swap textures.
We did so in our Scooter demo – the seat, for example, is covered with a single material in which we replace the base color, occlusion-roughness-metallic and normal textures. The puzzles therefore can become a perfect place for configurating all the options in one place.
Attachments:
You must be logged in to view attached files.2019-01-03 at 2:19 pm #10302scalareCustomerHappy New Year to all!
OK, I’m getting back into my tests. I was able to load the external dummy object via the GLTFLoader call, and I can see the object in the scene (I didn’t make it invisible yet). And I tried to assign the dummy object material with an “assign material” puzzle when I click on an object (and I click it after I see the dummy is loaded), but the target object does not change its material. I’ve made sure that both materials are defined in the same way (with nodes, Single UV Map + Image Texture + Principled BSDF + Material Output). I’m setting a variable to the name of the dummy object material name, and then using that variable to assign the material, but nothing is happening.
Not sure what the problem may be. Could it be that you cannot assign a material using a variable name? Or is it that I can only use materials that are recognized by the puzzles at the loading time? Since I’m working on a configurator, and the code I will create should work for any product that will be loaded dynamically, I need everything to be able to work based on variables that I will pass through runCode function (which is the reason I thought that testing the material assignment with a variable would make a good test)
Any ideas? Thanks a lot!
2019-01-04 at 7:52 am #10322Yuri KovelenovStaff2019-01-04 at 12:45 pm #10327scalareCustomerHello Yuri, below is a link to a zip file with the tests I am working on. There are several tests happening in this file, not just the assignment of a material from an external gltf file. That particular test can be seen when you click on the sofa right legs (right from the user point of view, not the sofa’s). You will see that the external dummy is loaded (it is a small plane with a red fabric texture that appears between the sofa and the camera just when the app starts, you may have to rotate the camera a bit to see it), but when you click on the right wooden leg, the mesh is outlined, but the material does not change. But it does change when you click on the back cushion mesh, for example.
Also, I’m assigning the material change by collection, not individual mesh, because that is what I would need to do in the real app. Maybe the problem is that the “assign material” of an external gltf file works with individual meshes, and not collections?
Thanks a lot for your help!
2019-01-05 at 1:48 pm #10344Yuri KovelenovStaff2019-01-05 at 2:04 pm #10349scalareCustomerWow! That would be great, and make things a lot easier However, this issue will delay our development, because the whole thing we’re creating is based on the load of external dummy objects we will copy materials from (and this is the last thing we needed to test to start integrating everything)
Is it a limitation of the “assign material” puzzle that cannot work with gltf scenes loaded via code? If not, it would help to use the code-based load temporarily until the puzzle is ready for release.
Let me know. Thanks a lot!
2019-01-07 at 9:58 am #10397Yuri KovelenovStaff -
AuthorPosts
- You must be logged in to reply to this topic.