Although most videos we record on our devices are rectangle—marker images and AR experiences don’t have to be. Our clients often create badges, stickers, drink coasters, packaging and other products that make irregularly shaped markers. If you’ve got a project like that, you can use an Alpha Mask to give the same shape to your AR video. This guide will show you how to quickly create Alpha Masks for your AR videos using the free cross-platform image editor, GIMP.
- What is an Alpha Mask for AR videos?
- How to use Alpha Mask in Overly AR Creator?
- How to create an alpha mask for AR videos using GIMP?
- Step 1: Prepare your video and marker image
- Step 2: Set up your Alpha Mask project in Gimp
- Step 3: Add transparency to your project
- Step 4: Remove the area that should be masked
- Step 5: Remove the marker image from the view
- Step 6: Create a white overlay for the marker
- Step 7: Export the Alpha Mask file as PNG
- Step 8: Ensure you have all the necessary assets
- Step 9: Create a standard video project on Overly AR Creator
- Step 10: Add “Alpha Mask” feature and publish the project
- Step 11: Test the marker and AR experience before print
LearnWhat is an Alpha Mask for AR videos?
Alpha Mask is a feature that enables creators to mask specific parts of a video and select the transparency for the area that they want to appear in augmented reality.
How to use Alpha Mask in Overly AR Creator?
You can select an “Alpha Mask” feature in Overly AR Creator once you upload a video. However, you must upload a mask too for the function to work. Follow this guide to create a mask and set up a project with irregularly-shaped AR videos.
How to create an alpha mask for AR videos using GIMP?
To showcase the creation of an alpha mask, I’ve selected an animation project developed by one of our customers. The animation had to appear on a marker that was a large-format triangle.
A standard rectangle video was not an option, so the client had to use an Alpha Mask to hide part of the video that was just black. An image on the left shows the original shape of the marker image and animation. You can see a person scanning the final piece at an exhibition on the right.
Step 1: Prepare your video and marker image
To ensure your mask overlays your AR marker and video correctly, check that all files have the same proportions as the marker image. Pixels can be different, but if the marker’s ratios are 6:19, then the video and Alpha Mask should have the same proportions.
Overly AR Creator doesn’t support PNG files as marker images. Therefore, double-check if your marker image is a JPG file. If not, open the file in GIMP and select “Export As” JPG. Similarly, ensure that the video you upload is formatted as .MP4.
Step 2: Set up your Alpha Mask project in Gimp
First, you should open the marker image in GIMP and duplicate the source file, so you don’t accidentally override your original marker image. Click “Save As”, but name the file Alpha Mask or however you prefer to differentiate the files.
Step 3: Add transparency to your project
Now you’ve got the Alpha Mask file in front of you. The first thing you need to do is add a transparent background layer to your project. This is necessary because you will be selecting areas that need to be masked and ones that should remain transparent. Go to Layer – > Transparency – > Add Alpha Channel.
Step 4: Remove the area that should be masked
Use the Free Select tool (or similar) to choose the area you want to hide when bringing the AR experience to life. I am selecting the triangle section on the left-hand side in this example. Once selected, I press Enter to confirm my selection. Then I press Delete. The transparent area is now represented with gray square tex
Step 5: Remove the marker image from the view
Now we use the selection tools to choose the area where you want the AR video to appear. In this example, it is the triangle that holds on to a drawing. Once selected, I press Enter and delete the content from this area.
Step 6: Create a white overlay for the marker
Almost there! Keeping the deleted area selected, move on to the “Bucket Fill” function. Choose the white color and fill the marker area. In the final photo, we see that the image has a see-through area and an area with white background. The transparent side will be masked, whereas the area in white will hold on to AR content.
Step 7: Export the Alpha Mask file as PNG
Lastly, export the Alpha Mask file as a PNG file through the “Export as” function.
Step 8: Ensure you have all the necessary assets
Now head to Overly AR Creator to put all your assets together. Below you see the three files you need.
Step 9: Create a standard video project on Overly AR Creator
Upload your marker image and video to Overly AR Creator. Position the video over the marker image as needed.
Step 10: Add “Alpha Mask” feature and publish the project
Now select “Alpha Mask” within the menu on the left hand side and hit Publish.
Step 11: Test the marker and AR experience before print
As you ensured that all assets (video, marker and alpha mask) are all of the same proportions, you do not need to do anything else with the Alpha Mask. The mask will attach itself to your selected video in full size. Scan the below marker to view how the experience I created turned out. And be sure to view your project before printing the marker.
Hopefully, this guide was helpful, but do contact us via comments or chat if you have questions about using Alpha Mask or any other of Overly AR Creator’s features.