Bitmoji Component

The Bitmoji component allows you to attach your Bitmoji avatar to bodies in Lenses. To easily see your Bitmoji avatar, add this custom component to a Scene Object.

You can find this component in the Custom Components section of the Asset Library.

Bitmoji avatars cannot be used for commercial purposes, including Ads.

Before you start

This guide assumes familiarity with the following topics:

• Custom Components
• Scripting
• Body Tracking

Bitmoji Component options

The Bitmoji component provides you with a few options:

Option	Description
Auto Download	If checked, your Lens will start downloading your Bitmoji avatar on Lens initialization. Uncheck Auto Download to manually download your avatar at a later time. To download your avatar manually, use the API method downloadAvatar().
Character Size	Used to set the size of the character. The Bitmoji component supports updating this value during UpdateEvent.
Body Index	Defines the index of a human body found in the camera frame, similar to Face Index for faces.
Track Hand	Enables fingers tracking.

Besides downloadAvatar(), there are two other methods you can use to handle downloading your Bitmoji avatar:

Method	Description
onDownloaded()	Called when your Bitmoji avatar is successfully downloaded.
onDownloadFailed(message)	Called when your Bitmoji avatar fails to download.

Example usage of the Bitmoji component's API

//@typename BitmojiComponent
//@input BitmojiComponent bitmojiComponent

script.bitmojiComponent.downloadAvatar();

script.bitmojiComponent.onDownloaded = function () {
    print(“Avatar downloaded.”)
}

script.bitmojiComponent.onDownloadFailed = function (message) {
    print(“Unable to download avatar:” + message)
}

Working with your Bitmoji avatar

To get your Bitmoji avatar into a Lens, you need both the Bitmoji Module and the Remote Media Module. They allow you to download and instantiate your avatar. Both modules can be found in the Resource panel.

Bitmoji Module gives you access to the Bitmoji3DResource which can be obtained by calling bitmojiModule.requestBitmoji3DResource(callback).

bitmojiModule.requestBitmoji3DResource(callback) takes a callback function as an argument. Bitmoji Module invokes the callback function when the resource is acquired, passing the resource to the callback function as an argument. Remote Media Module then uses the resource to download your avatar.

Example of downloading an avatar

// @input Asset.BitmojiModule bitmojiModule
// @input Asset.RemoteMediaModule remoteMediaModule
// @input Asset.Material pbrMaterialHolder

script.bitmojiModule.requestBitmoji3DResource(function (bitmoji3DResource) {
  script.remoteMediaModule.loadResourceAsGltfAsset(
    bitmoji3DResource,
    onDownloaded,
    onFail
  );
});

function onDownloaded(gltfAsset) {
  var root = scene.createSceneObject('BitmojiAvatar');
  var avatar = gltfAsset.tryInstantiate(root, script.pbrMaterialHolder);
}

function onFail(e) {
  print(e);
}

For a complete example of a script that downloads your Bitmoji avatar, check out the Bitmoji template.

Bitmoji Module requests only your avatar. If you use two Bitmoji components for two people in the camera frame, they will both appear as your avatar.