Back to Resource Library

How to Create the Perfect Frames for Your WebAR Campaigns

a smiling girl with a background fuchsia frames on Aryel augmented reality

We have an amazing feature available on Aryel: frames. You can now use them in Aryel to fully customize campaigns and make them even more cool and memorable ⚡️

Follow the instructions contained in this quick guide to correctly prepare your frame images!

👉  Tools: Before starting, make sure you have an image editor tool that allows you to export images with transparent background (e.g. Adobe Illustrator/Photoshop).

👉  Workspace dimensions: Set your artboard dimensions to 484*968 px with a resolution of 72 dpi.
This will be the total space of the full frame.

👉  Design frame: Split your artboard in four parts and use each of them to design your frame corners.
Each corner will have a 1:2 ratio for width/height (width will be half the size of the height).

👉  Cut and export: Cut your design into four images – each one will be 242*484 px – and export them as .png with transparent background. Best practice name convention: name_position.png

Upload to Aryel: Now that you have your four images, the only thing left to do is to upload them to your campaign. For each corner click on the ‘+’ icon and upload the images in the right place.

Example – upload frame imagesAdd image to frame

Example – delete/replace frame images

Replace frame image

Additional items

Use the four remaining spaces to add your logo or any other decorative item you like.

Decorative items

 

Are you looking to save these instructions for future reference? You can download the pdf version.