Image Not Showing
Possible Reasons
- The image was uploaded to a note which you don't have access to
- The note which the image was originally uploaded to has been deleted
Learn More โ
Preparing your CloneX for Spatial
So you want to be your CloneX in Spatial? You've come to the right place. I will warn you now that this looks like (and is) a fair bit of work to get set up, but the skills you'll learn will help you go far in understanding avatar interoperability and optimization.
Setup
-
Download Clone.Tools.
-
Download the latest supported version of Blender. I'll be using version 3.4
as that's what is supported at the time of writing.
-
Open Blender, install and enable clone.tools Edit -> Preferences -> Add-ons -> Install
.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- Navigate to the clone.tools plugin on the sidebar
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- Select a folder that houses all of your Clone's components.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- Your CloneX is now imported into Blender!
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
Optimization
There are many ways to optimize your CloneX, and some are faster (and more expensive) than others. In this tutorial, I will be using basic and free techniques that can be done all inside Blender.
Here are the specs we need to optimize to. In this case, we will optimize to the Global specs so we can use this model globally across Spatial.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- In Blender, ensure that
Viewport Overlays
is enabled and Statistics
is selected
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- Select all of your meshes and enter
Edit Mode
with the tab key
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
-
You'll see in our stats that our meshes have more triangles and vertices than Spatial can handle, and therefore we need to optimize it. In this case, we also have meshes that overlap, and may cause issues later on with intersecting meshes.
-
Let's get rid of any meshes that are 'hidden' by overlapping meshes. In this case, I want to get rid of the body mesh that is under the tshirt and the pants.
-
In Object
mode, select your body mesh and then press tab to enter Edit
mode.
-
Press Alt + Z
to enable X-Ray mode that will allow you to select the backside vertices of the mesh.
-
Select the vertices that are hidden by the body and the pants.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
-
This removed some of the density of our model, but there's a long way to go to get it down to the specs we need.
-
To do this, we'll be using another Blender plugin called Simplygon. Download the latest version of the Simplygon SDK and install.
-
Open Blender and enable Simplygon Edit -> Preferences -> Add-ons
.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- Select one of your meshes and use Simplygon to optimize the geometry. To do this, open Simplygon and create a
Reduction Pipeline
with a Reduction with material baking
LOD component. Given that the sum of my meshes' geometry is ~100k triangles, I'm going to use a ratio of .25 to get it down to <~25k triangles.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
-
Process each mesh individually. As you can see, my final set of meshes is now 23K triangles and 17k vertices - perfect for the Spatial avatar requirements.
-
Select all your final meshes and press Ctrl + J
to join them into one mesh.
-
During the optimization process, we also created a set of new textures for each mesh. I'm going to save (well technically, unpack) each of these textures by going to File -> External Data -> Unpack Items
and write it to the current directory. Once unpacked, you'll see a folder called textures
in your Blender project folder. This contains all the textures you created.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
-
It's great that all of these textures have been optimized, but this will be way too many textures for Spatial to handle individually. We now have to create a texture atlas that combines multiple textures into one.
-
To do this, we can use a Blender add-on called CATS which is a fantastic avatar optimization tool. Download the latest version from Github here. CATS also utilizes an add-on called Material Combiner that you can download here. Enable both add-ons in Blender in the same fashion as demonstrated with clone.tools.
-
Once enabled, open the add-on and select Optimization -> Atlas
. Select all of your materials that you've used in your new merged Clone mesh and deselect all materials from the original Clone you imported. Then save the atlas.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- Your new Clone mesh should now have one material and one texture (see below for the resulting node setup). Note that this is a 4K texture that won't work with Spatial, but we'll solve for that in Unity.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- You could now apply the original armature to the new combined mesh, but I like going through Mixamo to standardize it into a common armature. To export it for use in Mixamo, go to
File -> Export -> FBX
and ensure Selected Objects
is enabled to make sure we don't export any other meshes.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
Rigging
- Head over to Mixamo and sign up for a free account and login. Upload your FBX file you just exported using
Upload Character
.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- Go through the standard autorigging process. This may take a while.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- Select the
T-Pose
pose and download with default settings
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
Unity
- Download Unity version
2021.3.8f1
- you must use this version in order for this to work
- Install and ensure you select WebGL support
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
-
Create a new Unity 3D project
-
Download the starter template.
-
Extract the spatial-unity-starter-template-main.zip
folder.
-
Go to your Unity Hub and Add project from disk
.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- Drag and drop your Mixamo rigged FBX file into the Unity viewport and set the
Rig
Animation type to Humanoid
and apply.
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- Click the Materials tab and use the
Standard (Legacy
Material Creation Mode and set the Location to Use External Materials (Legacy)
and apply. Fix the normals by pressing Fix Now
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- Now drag and drop your model into the viewport. You'll notice that the eyes are grey. This is because the eye shine is a transparent material, rather than opaque. Change the surface type to
Transparent
. That looks better!
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More โ
- Select your CloneX and create a Prefab Variant of it.

- Select your CloneX and in the inspector panel, add a
Spatial Avatar
component.

- We will now need to optimize our 4K texture to a 1K texture as previously mentioned. To do this, you'll need to navigate to your texture atlas. You can do this by searching for it or finding it in the .fbm folder that was created when importing the FBX.

- In the inspector, drop down the
Advanced
section and change the Max Size
to 1024 and Use Crunch Compression
at 50 and apply. This will healthily optimize the texture for use in Spatial.

- Click on the Spatial SDK tab and select
Configuration
. This will prompt you to log into your Spatial account.

- Create a new Avatar Package and drag and drop your CloneX prefab variant into the Prefab. Also add your PFP to the Thumbnail. It needs to be
256x256
pixels. You can use I<3IMG to resize it to these dimensions. You can also use remove.bg to get rid of your background from your PFP as Spatial requests a thumbnail with transparency.


- Once you've input all the information correctly, you can now test your avatar in Spatial. To do this, click
Test Active Package
in the top right of your screen.

- This will bring you to your Spatial sandbox.

- If everything looks good to go and is working correctly, you can now publish your avatar to your Spatial account. In Unity, go back to your Creator Toolkit window and click
Publish
on the active package.


- Once you've successfully uploaded your avatar, it will take about 15 minutes to process. Once that's completed, head to your Spatial profile and click your profile picture then select
Edit Avatar
.

Conclusion
You now have the ability to become your CloneX in Spatial. Congratulations! Can't wait to see more Clones in the open metaverse. If you made it this far, give yourself a massive pat on the back and tag @itsmetamike on Twitter with a screenshot of your CloneX in Spatial.
If you want to support my work, head to itsmetamike.xyz and consider minting one of my pieces.
MetaMike is a metaverse tinkerer, an explorer of interoperable virtual worlds and is part of M3.
Follow Meta Mike
Website | Twitter