Shadows and AO only visible in Sneak Peak, nowhere else…..

To achieve the highest quality out of verge I do the following:

1. Storyboard the project. Determine which items will receive shadows, which items will cast shadows, which items will need to be animated, which will need to cast reflections, which items you might need to click on. Once you have all this, you can begin what I call a block-out animatic.

2. For my block-out animatic, I use only basic shapes for each object, with no lighting and only an environment map. Shading should be simple if any at all. This allows you to go through the entire animation sequence and set things up…then import it into Verge to make sure you have your groups set up correct. I stress this because rebaking your maps a second time is no fun and a lot of wasted effort.

3. Once you have your blocked-out scene ready…bring it into Verge, create all the puzzles to make it work…your end result should be a rough working project. This ensures that your objects are grouped properly but also allows you to make sure any custom programming you need will be isolated to the proper objects and or allow you additional time to program vs waiting until the end of the project.

4. Once completed with the blocked-out project, I move into high -res modeling. I add all the geometry detail that I can and or have the budget for. I do each object as a separate file so I can go back and adjust one if needed without having to go into the scene file.

5. Hi-Res Texturing… in this process, I don’t care if the maps are 8K or 12K…I am looking for the best thing I can create. Special note: at this stage you need to start thinking of your texture map optimization and how or if you will be stuffing B&W data into color channels or not.

6. After the Hi-Res Models are finished, its time to create low res models. Low res are models created specifically for WebGL following all the topology recos and limiting the vertice count. After the low res geometery is done, I bake the hi-res normals to the low-res model creating a normal map.

7. I then sort all the low res models by groups. Each group gets their own (in my case Blender) project. I then join all the models together if applicable to create one object, and then create a one very large 8K or even 12K texture map. All of the original objects will share one UV map so it’s important to be large at this point. Render with the best render you have for baking textures.

Depending on the size of your scene you can bake your AO, specular, metallness, shadows, etc… in sperate textures or do them all at once.

8. With all the maps completed and all the low res grouping done, you can now import these items into your block-out animatic replacing the stand in objects.

9. Export the GLTF and open the application in the AppManager.
Sneak peak is okay but you will really want to see how it appears and what needs fixing.

10. if all goes well…your scene should look very similar to how you rendered your low-res models when doing the texture bake. Should look like you rendered it using VRay or Arnold.

I don’t recall how texture baking is done in Max but for me thats the longest part of the project. My project might take me a few weeks to model hi and low res models…then another few weeks to texture but the texture baking…can take weeks if not months to complete depending on the complexity, number of objects, your computer hardware, etc and more importantly the quality of the maps you really need for a project.

Its a really fine line we have to walk. We have to use low poly models, we are stuck with a 50Mb maximum cache limit on browsers so our textures have to be lightweight. Performance is severely hindered by redraws so you are forced to group objects as much as possible or rely on the “batch” puzzle. Which will work…but you wont get as good as control if you just do it yourself. So in the end it will look its best…but its not going to look like that high res model and texture combo rendered in Arnold.

Lastly is the choice between normals, JPGS and PNG files that will determine the quality of your textures…you might end up mixing the types to optimize your overal project size and performance.

There is an entire science on texture optimization that is critical to saving space… but to optimize it you had to make those decisions very early on in the project in Step 5.

Once you go through all this you will have the best quality that you can produce in Verge3D. And should be able to run it on a dekstop with out issue….but the next step is mobile run time optimization if needed. You might have to reduce all your texture sizes.

Please note that Verge3D does not do a great job at texture stretching when the material has a gradient or shadow so be prepared to create a completely different texture set for mobile phones/smaller screens. Your first round of testing will let you know if you need to do this or not.

The best resource is YouTube. You will find lots of different tutorials you can learn from.

You will also want to look into atlas maps.

With 3.8 max support dynamic AO. Shadows are supported. You as an artist/designer will have to decide if these settings are good enough or if baking is the right solution.

If your scene is complex lighting and AO will slow performance so it will be an on going battle depending on the devices you are wanting your app to play on.

Good to know.