Face In Video
The Face In Video template allows you to attach your own content to a video using tracking data from After Effects.This template is great for building a Lens which tracks the user's face to content in a video. This guide covers how to export After Effects tracking data and sequences using a provided script, and how to use it to build a Lens in Lens Studio.
This template requires use of Adobe After Effects to export tracking data from a video.
Download the After Effects to Lens Studio script
The Face In Video template is used with an After Effects script that lets you export the position, scale and rotation keyframes of a layer to a file which you can use in Lens Studio to attach your own content to a video.
Installing the After Effects to Lens Studio script
After downloading the After Effects to Lens Studio script, copy the
AEtoLensStudio.jsx into the After Effects
ScriptUI Panels folder
- (Windows) Program Files\Adobe\Adobe After Effects<version>\Support Files\Scripts\ScriptUI Panels
- (Mac OS) Applications/Adobe After Effects<version>/Scripts/ScriptUI Panels
If you place a script in the ScriptUI Panels folder while After Effects is running, you must restart After Effects for the scripts to appear in your After Effects.
Load the After Effects to Lens Studio script
After installing the script, you can run the script by selecting the
Window -> AEtoLensStudio.jsx in After Effects.
Now you should be able to see the
After Effects Sample Project File
Download this example After Effects project to follow along this guide.
Exporting To Lens Studio
To create a Face in Video Lens, you’ll need both a video and tracking data for that video.
Tracking data is a layer in After Effects which contains keyframes for:
You can use After Effects' built-in tracking tool or Boris Effects Mocha to get the tracking data for your video.
When preparing your composition, make sure to note the following:
- Your video resolution is the exact same as your comp resolution size
- If your comp timeline has a beginning and end mark, make sure to trim the comp so you have a comp with no beginning and end mark
For the best user experience, a Lens should optimally be less than 2 MB in total file size (with a maximum of 4 MB). With this in mind, your video should have a length of less than 4-5 seconds
Creating a loopable video will result in a more seamless Lens experience
Once you have your After Effects tracking data, you can export your tracking data to Lens Studio by using the script from earlier. First select the tracking data layer and make sure it is selected and then click on
Export Tracking Data button in the
If you are using the script for the first time, you’ll see a dialog box asking you to allow the script to write files onto your computer.
To allow scripts to write files, you need to give permission in the
Scripting & Expressions section of your After Effects preferences. Click
OK in the dialog box to open your
After Effects preferences window. In the After Effects preferences window, check the
Allow Scripts To Write And Access Network checkbox and then click
With permission granted, you should now be able to export your tracking data. Select your tracking data layer, then click
Export Tracking Data in the
Finally we need to export the movie as an animated sequence. First select the composition that you want to render, then click
Export PNG Sequence in the
When exporting is done, you’ll see a
Render Successfully Done message.
Importing Assets Into Lens Studio
Now that we have all the assets that we need, let’s import them into Lens Studio.
To import the tracking data, drag and drop the file from your computer into the Resources panel.
Next, we will import our video which was exported as a PNG sequence. In the Resources panel select
+ -> 2D Animation From Files. Then, select all the images that were exported from After Effects and press OK. Next, a new window will pop up that allows you to configure how your animation will be imported.
Please refer to 2D Animation Guide to learn more about animated textures.
OK will create a new animated texture in the
Customize the Face In Video
Let’s use our newly imported resources. First, select the
FaceInVideoController [EDIT_ME] object in the Objects panel. Then, in the
Inspector panel, click on the Tracking Data script input and select the Tracking Data that we imported.
To set the background video, drag and drop the animated texture from
Resources panel into the
Background Video input in the
At this point you’ll see your animation paused with a red color overlay on the screen.
In this template, this means that there is some misconfiguration in our project. To see the issue, open the logger panel by pressing
Window -> Panel -> Logger in the menu bar.
In this example it says that we need to set the duration of the animated texture to 0.967.
To set the animation duration, select your animated texture in the
Objects panel, and in the Inspector panel set the duration field to the number shown in the logger. Then,
refresh your Lens, and you should see your animation playing with an image attached to the video!
By default, Lens Studio import the animated texture with a duration of 1.
Toggle the background video
You can hide the background video by unchecking the
Show Video checkbox.
This option will allow you to have any image animated by the data that we exported earlier.
if you keep the Show Video option disabled, you can reduce the size of your Lens by clearing the Background Video’s texture input so that the video does not get exported as part of the Lens.
Changing the Image
A custom texture can be added to replace the face texture as well. You can change the texture by changing the
Image property to a custom texture.
You can add an opacity image to your tracked image by changing the
Opacity Image texture property. Take a look at the example
face_mask texture in the Resources panel for an example of an opacity mask.
Adjust the Image Size, Position and Rotation
The template also allows you to modify how your tracked content is displayed.
You can adjust the image size using the
You can adjust the image position using the
Offset X and
Offset Y slider.
You can adjust the image rotation using the
You can adjust the opacity of your image using the
Adjust the Image Sort
If you want your image to be drawn on top of the video, change the
Image Sort to
In Front of Video.
You can also sort how your image is drawn using the
Objects panel by setting the
Image Sort to
Previewing Your Lens
You’re now ready to preview your Lens. To preview your lens in Snapchat, follow the Pairing to Snapchat guide.
Please refer to the guides below for additional information:
Still Looking for help?Visit Support