Use the face mask template to create custom mask and makeup textures to export to Spark AR Studio.
The face mask template is a PSD file that you can open in Adobe® Photoshop® image-editing software.
To download it, click the pink button labeled Face Mask Template under Downloads, in the right-hand menu of the desktop version of this article.
In this article we’ll look at the structure of the PSD file and explain how each layer acts as a guide for creating specific parts of a texture. We’ll also explain how to optimize the textures you create.
When you open the file you’ll see the face mask template is a 2D representation of a 3D model of a face made up of a number of different layers.
We’ve included a sample face mask texture on the first layer of the template. It's listed as Blue Tiger Texture in the Layers panel.
The face mask template is made up of different layer groups. Just click the little eye icon to the left of any layer group or layer name that you don’t want to work with to turn it off so it’s no longer visible.
We’ll walk through each layer group in more detail below.
The Wireframe layer group contains two layers that together represent a 2D version of the Spark AR 3D face mesh.
The grid lines on these layers help you stay within the boundaries of the face mesh and give you an idea of where the features of the person using your effect will be.
Use the lines to guide you as you paint your texture.
The Tracking layer group contains a layer pinpointing the parts of the face that Spark AR tracks when you make a face effect.
It is helpful to be aware of these points when creating your texture
This layer group will help you paint beauty and makeup textures. Follow the shape of the eyeliner, eyeshadow and lips to position the makeup correctly.
The Facial features layer group has four layers. The face shape mask layer will blend the final mask texture naturally to the user’s face, so it's a good idea to keep it in your project.
Use the eye, nose and mouth layers to isolate these specific parts of the face before using them as a guide to paint your textures.
These layers can be imported to Spark AR Studio without any edits and used with the FaceTracker texture to make copies of the user’s facial features and place them wherever you wish. For example, placing a copy of the user’s mouth on their forehead.
This group contains a feminine face and a masculine face layer. They'll help you see facial features in more detail, like the start and end of the eyebrows or the volume of the lips.
The white and black Background layers are simply there to help you visualise the other layers more clearly as you work.
Once you’ve created your texture it’s time to export it to Spark AR Studio. There are a few things you can do in Photoshop® to properly optimize your texture for use in Spark AR Studio effects.
We'll go through these below, using the Blue Tiger Texture as an example.
Export visible layers
Firstly, remember to turn off any layers that don’t form part of the texture you want in your final effect. For example, to export the Blue Tiger Texture you would turn off all the other layers and export this visible layer as one single new image file.
The layers remain separate in your Photoshop® file, so you can go back and continue to tweak and update them.
Choose the right dimensions
The recommended image size is 1024x1024 pixels which is the maximum file size supported in Spark AR Studio. Despite the large file size, it’s a good idea to export textures with the maximum level of detail, especially when creating a makeup mask.
Choose the right format
Export your file as:
Use the Save for Web feature to optimize file size
You can use the Save for Web feature in Photoshop® to reduce the file size without significantly reducing the quality of your texture. To open this tool:
To optimize for file size:
It’s also a good idea to set the Size/Download speed to the estimated 2 Mbps maximum. Understanding the time it could take users to download your texture is another reminder to keep your files as lightweight as possible.
To set the Size/Download Time:
You can find more information on optimizing textures and effects in the Technical Guidelines and Optimization in Spark AR Studio.
Adobe and Photoshop are either registered trademarks or trademarks of Adobe in the United States and/or other countries.
Adobe product screenshot(s) reprinted with permission from Adobe.