Interactive presentation of SVOYA interior (WebGL/PlayCanvas). Part 4.


Author MastaMan
Updated on November 7, 2022

Index

Intro Part 4

This is Part 4 of a series of tutorials on creating an interactive SVOYA interior using WebGL/PlayCanvas.

For those who haven't read the previous parts, here's a demo video.






In this series of tutorials, we will make an interactive interior presentation that can be viewed in real time through a web browser.

Access to materials, such as: models in the "FBX" format, baked textures and more, you can get by subscribing to Patreon.

Patreon - 3DGROUND

Texture baking

Before baking, I evaluated each model and renamed them, adding a postfix in the form of numbers, which means what resolution the texture will need to be baked.

This is not a required step. You can bake everything, for example with "2048x2048" size. Since my computer is weak and time was running out, I tried to bake small objects with a smaller size.
rename objects and add resolution
Loading...
I also added a postfix for some "need_id" objects, if the model in Playcanvas has highlights and you need to additionally split the material into different "id" in "Multimaterial".

We go to the drop-down menu "Rendering → Bake To Texture", this window will open in front of us.
Note!
Before 3Ds Max 2022, the "Bake to Textures" window may look different.
bake to tex
Loading...
Then select all the objects that will be baked, in the "Bake to Texture" window on the left, select "More Bake Elements → Corona → Corona_Beauty".
bake to texture add objects
Loading...
In the "Bake to Texture" window, press the key combination Ctrl+A and change "File Type" to "JPG".

In 3Ds Max 2022, it has become much more convenient to work with a large number of baked textures, the settings can now be changed all at once.

If you bake all textures with "2048x2048" size, you don't need to change any settings here anymore. In my case, I will change the "Image Size" according to what I wrote in the postfix to the model names.

Before clicking "Bake", specify a convenient directory where the baked textures will be saved in "Output Path".

We press "Bake" and while the rendering process is in progress, we can start the project in Playcanvas.

Some examples of textures.
basin 512 corona beauty
Loading...
Basin

chair1 1024 corona beauty
Loading...
Chair

Conclusion

Thanks to the updated "Render to Texture" window in 3Ds Max 2022, setting up baked textures is done in a couple of clicks. And while rendering is in progress, in the next part we will prepare the project in Playcanvas.

Go To Lesson Interactive presentation of SVOYA interior (WebGL/PlayCanvas). Part 5.


Go To Lesson Interactive presentation of SVOYA interior (WebGL/PlayCanvas). Part 3.


{{commentsMsg}}
  

No one has posted a comment yet
{{comment.lastname}} {{comment.name}} {{comment.date}}
{{comment.text}}


SUBSCRIBE TO OUR NEWSLETTER

{{subscribeMsg}}