Digital Goods + Remote Assets

Digital Goods for Lenses are no longer supported, as Tokens are being discontinued. Please see this help article for more details.

This guide demonstrates how to combine digital goods and remote assets to enable content-rich Lenses and improve Lens size and performance.

Why Use Remote Assets?

Standard Lenses have a size limit of 8 MB. This size limit also applies to Lenses that offer digital goods. This limit may present a challenge for Lenses that offer multiple digital goods and/or assets, or Lenses that you want to update with new content over time. Remote assets provide another 25 MB of storage per Lens, allowing you to include more content in your Lens.

Refer to the Remote Assets Overview for more information, including storage limits and supported asset types.

While not all asset types are directly supported by Remote Assets, more asset types and components can be uploaded as part of an Asset.ObjectPrefab, unless listed under Unsupported Asset Types / Components.

This guide focuses on two scenarios for using remote assets in a Lens with digital goods:

1. Downloading remote assets on awake: Useful for assets that a Snapchatter can experience right away. E.g., storefront UI elements
2. Downloading remote assets on demand: Useful for assets that are experienced later in the digital goods user flow. E.g., digital goods content that is previewable while the purchase tray is open or available for use on unlock.

Adding Remote Assets to Your Project

Remote assets are tied to your account and organization. To add remote assets to your project, first log in to Lens Studio. You can add remote assets to your Lens Studio project via the Resources panel. Refer to the Remote Assets Overview for instructions on:

• Uploading Remote Assets to your account
• Importing Asset References into your project

Helper Scripts

The following helper scripts, RemoteAssetInfo.js and RemoteAssetLoader.js, can be added to your project to handle remote assets logic. Download these from the Asset Library.

You can also find the Remote Assets Loader in the Asset Library.

RemoteAssetInfo.js

This script links the reference asset to its associated content in the scene. When this script is added to a scene object, the Inspector panel includes the following inputs:

Input	Description	Required?
ID	A unique string that identifies the remote asset. For remote assets that are digital goods content, the digital good’s SKU can be used as the ID.	Required
Reference Asset	Asset.RemoteReferenceAsset that provides a reference to the remote asset	Required
Fallback Asset	Local asset that is used in place of the remote asset if download fails	Optional
Action	Action to take when the remote asset is downloaded. Options: None (Default) Instance Prefab Set Audio Track Set image texture Set material texture Set mesh	Required
Script Component	Component.ScriptComponent containing a callback function that executes when the remote asset downloads successfully and / or Lens content is set	Optional
Function	The callback function in the Script Component that executes when the remote asset downloads successfully and / or Lens content is set. The callback function receives the downloaded asset or its associated Lens content as a parameter, depending on which Action was set.	Optional
Load On Awake	Boolean; check box to load the asset right away when the Lens starts. Defaults to false.	Required

RemoteAssetsLoader.js

This script handles logic for downloading remote assets and setting their associated content in the scene. It takes the Root (parent scene object) of the RemoteAssetInfo.js scene objects as input. On awake, it loads assets for which the RemoteAssetInfo.js input, Load On Awake, is set to true.

It also provides the following global function for loading remote assets on demand:

global.RemoteAssetLoader.load(String id, function onActionComplete) : void

Downloads the remote asset by ID (e.g., SKU for digital goods) and sets the asset in its associated Lens content. Calls an optional onActionComplete callback function when the asset is successfully downloaded and / or the scene content is set.

If the RemoteAssetInfo.js Action is set to None, onActionComplete receives the downloaded asset as a parameter. If another Action is set, onActionComplete receives the Lens content as a parameter (e.g., SceneObject, AudioComponent, Image, Material, or RenderMeshVisual).

If download fails and a Fallback Asset is populated in the RemoteAssetInfo.js input, the fallback asset is set in the scene content.

Helper Script Setup

RemoteAssetInfo.js and RemoteAssetsLoader.js work together. To use these scripts in your project, follow the steps below. These steps should be done after uploading remote assets and adding the Reference Assets to the Resources panel in your project.

1. Add a scene object to the top of the Objects panel hierarchy. Name it Remote Assets Root.

2. Add one child scene object to the Remote Assets Root per remote asset in the Lens.

3. Add Lens content to the Objects panel and / or Resources panel for each remote asset in the Lens.

4. If applicable, write scripts to define onActionComplete( ) callback function behavior and / or to call global.RemoteAssetLoader.load( ). In the example screenshot, the script onContentSet.js provides callbacks for different Actions, e.g., onPrefabSet( ).

5. Add these scripts to the Objects panel below the Remote Assets Root.

6. Attach RemoteAssetInfo.js to each child of the Remote Assets Root and configure the inputs.

7. Create another scene object below the Remote Assets Root in the Objects panel hierarchy. Attach RemoteAssetsLoader.js to it.

Make sure the Remote Asset Loader is below the Remote Asset Root and above any scripts containing onActionComplete( ) callback functions..

8. Add the Remote Assets Root to the corresponding input in the Inspector panel on the RemoteAssetLoader.js script component.