Wonda comes with a set of 3D Rooms to host your sessions that are accessible by simply choosing one from the editor. But you can also import your own 3D environment.
To import a custom 3D room you have two methods:
beginner method using Spoke: continue to the next section
Step 1/3: Import your 3D Environment in Spoke
With Spoke you will be able to:
Define the 3D Room's default size and default position relative to the viewer when entering the room
Add 3D objects with a fixed position
Adjust the 3D Room’s lighting
Adjust or add a custom skybox
Define the walkable area (floor plan)
1. Check that your 3D model follows the following recommendations:
Max Poly count: 50k (Decimate your model if needed. See how to do in Blender)
Max Texture Resolution: 4K (higher resolution will not work on mobile)
Material number: reduce as much as possible if you need to run on mobile
NB: If you are a 3d artist you can also read our dedicated article about optimization
2. Export your model as .glb and make sure it's working by testing it in a viewer.
3. Go to Spoke, create an empty project, remove the default content and drag & drop
your 3D file
NB: For more information on how to optimize your 3D room, you can read this really interesting blog post by the maker of the Hello WebXR experience
Step 2/3: Set the position, orientation and scale of your 3D room
After importing your 3D room in a new project in Spoke, follow these guidelines:
Import a 2D image to simulate where the Virtual Screen will be positioned after you import your 3D room into Wonda. Scale the image to reach 4 meters in width and change its position to: (X:0,00 Y:1,50 Z:-3,00).
→ Keep in mind that the Player Spawn Point is fixed at (X:0 Y:0 Z:0).
→ This means that the player faces the -Z direction on spawn.
Note: it will not be visible in your Wonda project, you can use any sample image
Move your 3D Room around this image to make sure the virtual screen is in the desired position (against a wall for example).
Note: don't move the image itself as it's only a helper here, move the room around instead.
Select the Floor Plan, and click on Regenerate the Floor Plan to match the room's new position by clicking on Floor Plan and Regenerate with default options.
Step 3/3: Import your 3D room From Spoke to Wonda
Once the Room is correctly prepared using Spoke:
Go to file > export as .glb
Create a thumbnail file (.jpg or .png) using your usual screenshot tool (it will be displayed in the room library)
Open Wonda, go to your project library (as shown below), simply drag & drop the two files in the media library and select it as the 3D Room of your Experience.
Alternative: use a 360 image as a 3D Room
Just select your desired .jpg equirectangular file and it will be used as the main background for your experiences.
If you need more information about Navigation Mesh, you may find them in this article: Navigation Mesh