Learn how to create transparent video files for your Overly AR Creator augmented reality projects using Adobe After Effects. Delve into our comprehensive video and photo tutorials and start creating!
Video tutorial: create transparent videos for your augmented reality projects
Photo guide: How to make a video with a transparent background for augmented reality projects using After Effects
First of all, below is an image that shows you an example of a transparent AR experience (the guy next to the photo… yeah, he’s really not there). On the right-hand side you get a snapshot of how the file for such an AR experience must look like. In this blog, we’ll go through the steps of creating this experience by showing you how to make a transparent background for a video in After Effects and how to then use it in Overly AR creator.
First, to set up your project, prepare your video file and open Adobe After Effects. Then click through to create a new composition. To create a transparent video for your AR project, the composition has to be twice the size of a regular 1080p video stacked on top of each other aka WIDTH: 1920 and HEIGHT: 2160px. Set the pixels accordingly and press “OK”.
You’ll then be left with a transparent rectangle as per below. Then click on the left-hand side to import the footage.
The resolution isn’t relevant here as long as you can import the video and it covers up precisely half of your composition. Why? Because you’re going to select the footage in the below window, please select it and click Ctrl + C and Ctrl + V on your keyboard to make a copy (command buttons for Apple).
You’ll have two videos now. So take the first video and pull it down to the bottom. Please zoom in to adjust the video to fit the composition and ensure it covers the full pixel space precisely.
Now what you’ll have is just two unkeyed green screen footages within one composition. To key the content, you have to right-click on the window below and create the background. Choose “New”, “Solid” and leave it black.
Then move the background behind the videos and go to the right-hand side menu. Select “Effects & Presets”, search for “Keylight” and proceed to key the footage by pulling the Keylight button onto the top footage.
Select the average green color for your selection and click on the top footage. Then you can play around with the settings on the left-hand side to get the desired transparency.
Once you are happy with the keyed footage, copy the Keylight settings to the other clip, creating two identical, keyed pieces of footage on top of each other.
To double-check if they’re keyed, turn off the background. As per our example, all looks correct thus far.
Then turn the background back on. The next step is to make the video content for one of the files completely white. To achieve this, head to “Effects & Presets” and search for “Curves”. We’ll use the curves adjustment on the bottom layer so pull it down there and overexpose it on the left-hand menu, which will give us the result we want.
Once you’ve completed all the previous steps and ensured that the content is keyed, press Ctrl+M to open your render queue. In this example, we use Adobe Media Encoder to render the footage. Before you render the file, lower the bitrate in the settings to make the video file smaller. Then press “OK” and select the “Play” button to render.
Once the file is ready, you can head to the Overly AR Creator, pick your marker image and upload the video. Once the file is uploaded, select it and tick the “Transparent” video on the left. You can then resize and position the video on top of the marker or next to it as we’ve done in our example. Hit published once you are happy. Make sure to download the Overly app and scan your marker image to ensure your AR experience is just as expected. Refer to the following blog if you need guidance on how to use Overly DIY augmented reality creator and our app. If you’re struggling to create a marker to go with your experience, please read our guide on how to develop effective AR markers with the result in mind.
Please refer to the video embedded at the beginning of the article for a more detailed walkthrough of how to make a video transparent. If you have any additional questions on how to create a transparent video, leave a comment below, send us a message on the chat tab if we’re online or e-mail us at hello@overlyapp.com with your query.