# Create Frame Assets

## What is a Frame Asset?

A frame asset is a special asset type that serves as a screen to display NFTs, images, and video in the game environment.

{% hint style="danger" %}
A frame asset can **NOT** be animated, but it can be a compound asset.
{% endhint %}

{% hint style="warning" %}
Uploading custom content for use with Video and Audio Streaming behaviours is limited to The Sandbox and select partners.
{% endhint %}

## How to Create a Frame Asset

{% tabs %}
{% tab title="About" %}

### About

To create a **frame asset**, you will select a flat rectangular area to serve as the "screen" on the asset using the <img src="https://331512196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F83PS3g9zpWmq73xzlwFn%2Fuploads%2FpgSm3iUonQcMJDazu84p%2Fimage.png?alt=media&#x26;token=70eb7485-b036-4ba5-937b-0886cb66a4c8" alt="" data-size="line">Frame tool in the VoxEdit Modeler's [#toolbar-1](https://docs.sandbox.game/en/creator/voxedit/docs/modeler/..#toolbar-1 "mention").

[Uploading](https://docs.sandbox.game/en/creator/voxedit/upload-assets-to-workspaces) the asset to your Workspace maintains this special property and makes the asset available in your Game Maker library.

<figure><img src="https://331512196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F83PS3g9zpWmq73xzlwFn%2Fuploads%2F5q5OJir7sv1IyTovmDUr%2Fezgif.com-webp-maker.webp?alt=media&#x26;token=87cfc6fe-8d5e-4efa-bcf8-b2817a6e67ec" alt=""><figcaption></figcaption></figure>

The following logic options can be applied to a **frame asset** in Game Maker:

* <img src="https://331512196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F83PS3g9zpWmq73xzlwFn%2Fuploads%2FUN5GQEfuilgNecHsFmst%2Fimage.png?alt=media&#x26;token=3c534a06-ddf8-47ec-9668-8acd18b6de91" alt="" data-size="original"> [image-display](https://docs.sandbox.game/en/creator/game-maker/docs/components/nft/image-display "mention")
* <img src="https://331512196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F83PS3g9zpWmq73xzlwFn%2Fuploads%2F3HzXCqgZqJYBXiYPSa3z%2Fimage.png?alt=media&#x26;token=ad8596dc-7caa-4ae2-baa5-711d05f13eeb" alt="" data-size="line"> [nft-image-display](https://docs.sandbox.game/en/creator/game-maker/docs/components/nft/nft-image-display "mention")

{% hint style="info" %}
You must place a frame asset in Game Maker for these options to appear.
{% endhint %}

{% hint style="info" %}
To display a 2D NFT image in the rectangular display area of your frame asset, you must own an NFT in the same wallet that is connected to your account at The Sandbox, and it must exist on the Ethereum blockchain.
{% endhint %}

### NFT Information

The NFT Details Display component is often used on frame assets to provide marketplace information about the displayed media:

* ![](https://331512196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F83PS3g9zpWmq73xzlwFn%2Fuploads%2F17CNSWIaxtnBtysKM7bs%2Fimage.png?alt=media\&token=47560e85-c1de-49ab-ba74-11fa876b4e21) [nft-details-display](https://docs.sandbox.game/en/creator/game-maker/docs/components/nft/nft-details-display "mention")
  {% endtab %}

{% tab title="Specific Requirements" %}

### **Specific Requirements**

{% hint style="danger" %}
If these guidelines are not followed, the image may not display correctly, or the Game Maker may not recognize it as a proper frame asset and will not allow the display logic to be applied in Game Maker.
{% endhint %}

#### **Size & Ratio**

There is no limit on size or specific restrictions about ratio, but we recommend `16:9` or `1:1`. The logic to use the frame object will allow for resizing, stretching to fit, and repeating (tiling).

{% hint style="info" %}
If your image appears to be poor quality, it may be from stretching too large or in a ratio that doesn't suit the image. Create a new frame object or choose a different image.
{% endhint %}

#### **Dimensions: Even Values**

The model with the frame area must have a volume with **even dimensions.** <img src="https://331512196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F83PS3g9zpWmq73xzlwFn%2Fuploads%2F9e8qN3mYW2ibjJzNa07d%2Fimage.png?alt=media&#x26;token=49c68cbf-2c5a-4bec-9568-8a1da1808037" alt="" data-size="line">

**Examples**

* 64x64x2
* 120x40x6

#### Unanimated

**Do NOT animate the asset.** If motion is applied, the asset will not be saved as a frame asset.

#### Projection Note

**Do NOT move or rotate the node linked to the model** with the frame area. The projection is locked at the position on the model in relation to the \[0, 0, 0] coordinate.

If you move or rotate the model, the projection area won't match in the game world.

<div><figure><img src="https://content.gitbook.com/content/83PS3g9zpWmq73xzlwFn/blobs/CAltE5z9zcuyTCUd0X7I/Untitled.png" alt=""><figcaption><p>Animator view</p></figcaption></figure> <figure><img src="https://content.gitbook.com/content/83PS3g9zpWmq73xzlwFn/blobs/uWfFhsxSAOROE9xN1DyK/Game_Maker_qSKuzct8xV.gif" alt=""><figcaption><p>Game Maker / Game Client view (projection misplaced)</p></figcaption></figure></div>
{% endtab %}

{% tab title="How to Video" %}
{% embed url="<https://youtu.be/gAm3jKWu2jw>" %}
Video Guide
{% endembed %}
{% endtab %}
{% endtabs %}

## Techniques&#x20;

### Floating Image&#x20;

There is no need for a Voxel surface underneath the frame area. It’s possible to draw the area and then delete the voxels, and the area will remain active. This will let you design displays in which the images seem to be floating in space.

<figure><img src="https://331512196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F83PS3g9zpWmq73xzlwFn%2Fuploads%2F4xOsKfYoEDa4iqR9OqSN%2FVE%20float%20NFT%20image%20frame.webp?alt=media&#x26;token=2bf11372-2dac-4fad-a731-93753fb353c8" alt=""><figcaption></figcaption></figure>

{% hint style="danger" %}
Only one side of the image will be visible.&#x20;
{% endhint %}