3D Avatar AR Pipeline

4 min readApr 14, 2022

TikTok’s Effect House was released recently so I decide to help everyone with avatar pipeline i built.

You will learn how to make and prepare your 3D avatar for TikTok AR filter (or any other AR filter builder).

First, go to this awesome tool https://rpm-tshirt-editor.vercel.app/ built by Sercan (Sarge) Altundaş, who is a developer of famous avatar creation tool Ready Player Me.

You can create an avatar based on your picture. Below is a photo I took yesterday after SUP training (that’s why I’m so shiny 😃).

https://www.strava.com/activities/6975691427

You can choose your avatar style, skin tone, face shape, hair shape and color, eye color, makeup, hats, etc.

Also the tool also allows you to add an image to your t-shirt, and choose its color. I added my Voxel Kicks at the front and QR code on the back.

QR code is real and it opens my Voxel Kicks AR filter on Instagram and Snapchat, soon on TikTok.

When I’m creating QR codes with AR behind it, I like to provide all available platforms where you can build AR filter. This way I don’t restrict users and AR filter usage. Some users have Snapchat, some Instagram and Meta, and some have TikTok, so, you are givin gthem the opportunity to choose their favorite platforms.

This is just landing page example on my blog where all available URL’s for all platforms are https://vrarcro.com/nft-voxel-sneaker-av2/.

Ok, let’s continue with the procedure.

When you have finished designing your avatar, download it in .glb format. The Avatar is really small in size, like below 1.5 MB (it is even smaller than when downloaded from the official site Ready Player Me) so already optimized for web and AR. Of course, if you want, you can optimize it even more.

Now we need to fix few things. Your avatar is rigged, meaning it is ready for animation. But for Effect House, there is a limitation and your bone count needs to be below 50.

So we need to reduce bones number. To do that, just open avatar.glb in Blender and delete all Armature/bones you find. Delete everything selected red (see image below 👇).

After 3D model cleaning, export avatar to .fbx format and keep setting like this: Path Mode: Copy, Embed Textures.

Your avatar should look like this now.

Now we’re going to Mixamo which is one of my most favorite Adobe tools.

First, you need to import avatar.fbx you just exported from Blender to Mixamo.

Then, in Auto-rigger define all necessary points, chin, wrist, elbow, knee and groin. Leave Symetry checked and for Skeleton LOD choose No fingers (25).