![](https://hackmd.io/_uploads/By-kkVUEn.png) # 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](https://clone.tools/). - Download the latest supported version of [Blender](https://www.blender.org/download/). 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`. ![](https://i.imgur.com/9jVPmBn.png) ![](https://i.imgur.com/ldlYBcE.png) - Navigate to the clone.tools plugin on the sidebar ![](https://i.imgur.com/ifDketm.png) - Select a folder that houses all of your Clone's components. ![](https://i.imgur.com/bXzABEE.png) - Your CloneX is now imported into Blender! ![](https://i.imgur.com/mfKIRnl.png) ## 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. ![](https://i.imgur.com/dCDC9MU.png) - In Blender, ensure that `Viewport Overlays` is enabled and `Statistics` is selected ![](https://i.imgur.com/o3LPPyb.png) - Select all of your meshes and enter `Edit Mode` with the tab key ![](https://i.imgur.com/CbbFk7p.png) - 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. ![](https://i.imgur.com/HfbWISG.png) - 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](https://www.simplygon.com/downloads) and install. - Open Blender and enable Simplygon `Edit -> Preferences -> Add-ons`. ![](https://i.imgur.com/kls1JW1.png) - 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. ![](https://i.imgur.com/8Kji0qr.png) - 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. ![](https://i.imgur.com/uUjKl7O.png) ![](https://i.imgur.com/TeMd8mr.png) - 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](https://github.com/absolute-quantum/cats-blender-plugin/releases/tag/0.19.0). CATS also utilizes an add-on called Material Combiner that you can download [here](https://github.com/Grim-es/material-combiner-addon/releases/tag/2.1.2.4). 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. ![](https://i.imgur.com/Zxeo0SO.png) - 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. ![](https://i.imgur.com/UwPAJhN.png) - 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. ![](https://i.imgur.com/BDApoEN.png) ## Rigging - Head over to [Mixamo](https://mixamo.com/) and sign up for a free account and login. Upload your FBX file you just exported using `Upload Character`. ![](https://i.imgur.com/mz1tfBb.png) - Go through the standard autorigging process. This may take a while. ![](https://i.imgur.com/dSNgHVN.png) - Select the `T-Pose` pose and download with default settings ![](https://i.imgur.com/ps2Pgup.png) ## 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 ![](https://i.imgur.com/oSjdf5m.png) - Create a new Unity 3D project - Download the [starter template](https://github.com/spatialsys/spatial-unity-starter-template/archive/refs/heads/main.zip). - Extract the `spatial-unity-starter-template-main.zip` folder. - Go to your Unity Hub and `Add project from disk`. ![](https://i.imgur.com/ordSbaJ.png). - Select the extracted `spatial-unity-starter-template-main` folder. - Open the project from Unity Hub. ![](https://i.imgur.com/5Omx4of.png) ![](https://i.imgur.com/SYfCtiA.png) - Drag and drop your Mixamo rigged FBX file into the Unity viewport and set the `Rig` Animation type to `Humanoid` and apply. ![](https://i.imgur.com/eMNhz77.png) - 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` ![](https://i.imgur.com/51nE4oC.png) - 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! ![](https://i.imgur.com/WJlkuHb.png) ![](https://i.imgur.com/iBMof2M.png) ![](https://i.imgur.com/FwisAdk.png) - Select your CloneX and create a Prefab Variant of it. ![](https://i.imgur.com/RBMxyJi.png) - Select your CloneX and in the inspector panel, add a `Spatial Avatar` component. ![](https://i.imgur.com/pQryzz2.png) - 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. ![](https://i.imgur.com/YjZJqjZ.png) - 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. ![](https://i.imgur.com/Xk7Bnof.png) - Click on the Spatial SDK tab and select `Configuration`. This will prompt you to log into your Spatial account. ![](https://i.imgur.com/PjZjORq.png) - 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](https://www.iloveimg.com/) to resize it to these dimensions. You can also use [remove.bg](https://remove.bg/) to get rid of your background from your PFP as Spatial requests a thumbnail with transparency. ![](https://i.imgur.com/asfPlCN.png) ![](https://i.imgur.com/U8tcHRF.png) - 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. ![](https://i.imgur.com/eZXSfzJ.png) - This will bring you to your Spatial sandbox. ![](https://i.imgur.com/yDNQtzQ.png) - 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. ![](https://i.imgur.com/urF1fs9.png) ![](https://i.imgur.com/NmJMNOj.png) - 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`. ![](https://i.imgur.com/DCKgbzZ.jpg) ## 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](https://twitter.com/itsmetamike) on Twitter with a screenshot of your CloneX in Spatial. If you want to support my work, head to [itsmetamike.xyz](https://itsmetamike.xyz) and consider minting one of my pieces. :::info *MetaMike is a metaverse tinkerer, an explorer of interoperable virtual worlds and is part of [M3](https://3d.m3org.com/).* Follow Meta Mike [Website](https://itsmetamike.xyz/) | [Twitter](https://twitter.com/itsmetamike) :::