Adding Assets to a Microapp

Every microapp has its own asset library which contains images and videos that can be used in your microapp. Typically, microapp designers create microapp pages in a design tool like Adobe XD, Figma or Sketch. When artboards from these tools are synced to Tiled the artboards are saved as png's within your microapp assets panel. For more information on syncing check out Syncing with Plugin Overview. You can find the asset library in the Assets Panel of the Microapp Builder in the bottom right corner:

You can sort the assets in this panel by clicking on Name or Date. Additionally, you can enter the name of the desired asset to locate it in the Assets Panel. 

Add Assets to the Assets Panel

Files can be added to the Assets Panel by any of the following methods:

• Syncing your designs with a Plugin. Read more.
• Drag and drop your images or videos from your computer to the Assets Panel.
• Click the + icon under the search bar to access the Open dialog. Navigate to the location of your files on your local machine and select the files you want to add to the Assets Panel.

Once assets have been added you can use the Image Tile, Video Tile, or Gallery Tile to bring in your creative assets. Additionally you can use these assets as the Background for your microapp.

Asset Size Considerations

Tiled has no maximum file size for assets or microapps. However, if you are making a large microapp, especially with images or videos larger than 10 MB a piece, the performance of your microapp may be impacted by the size of the asset. For best performance, Tiled recommends keeping the total size of your microapps under 300 MB and compressing your assets where possible.

For optimal video performance, Tiled recommends that the size of individual video assets does not exceed 10 MB and that the total size of all video assets is not greater than 50 MB. Additionally, Tiled recommends the following:

• Compress all of your videos before they are imported into Tiled.
• Ensure that videos used as backgrounds and motion graphics do not exceed 10 MB.
• If using longer/larger videos in your microapp, do not turn on the Autoplay setting to accommodate load times.

If your microapp exceeds these recommendations, Tiled recommends that the microapp is downloaded to a local device for viewing to mitigate some of the lagging and loading issues that your viewers may experience.

Delete an Asset from the Assets Panel

To delete an asset from the Assets Panel, right-click the asset and select Delete. 

Use Asset Libraries

Before you start using assets from the asset library in the builder, you must have at least one asset in your asset library. Follow these links to learn how to create a new Tiled asset library and upload assets and How to create an Adobe CC asset library and sync content.

1. In the Assets Panel click the other tab called Libraries.
2. You will see all of the assets from your asset libraries appear in the list. You can filter by asset library and search for assets by name.
3. When you identify an asset you wish to use in your microapp, drag and drop the asset from the Libraries panel to a page, page state, or overlay. You will now see the asset appear in the Assets tab in addition to the Libraries tab.