Snapchat Lens Studio - Face Paint Effect
This walkthrough is part of the Getting Started with Lens Studio series.
In this post, we’re going to look at the Face Paint template in Lens Studio. This is a perfect place to get started in your journey into AR.
To follow along, please download the Face Paint Assets here.
The first thing we’re going to do is open Lens Studio
• So first thing we’re going to do is click on the Face Paint Template on the landing page.
• Once we’ve opened the template, we can see multiple different pre-populated Face Paint artworks in the Objects panel, why not turn them all on and off in the little check box to see what they do?
• Ok, once you’ve had a look through, we’ll turn them all off and get started on our effect.
• The first thing you want to do is to go to the Resources panel on the bottom left of the window and hit Import File, we’re going to go ahead and import our face mask images here. The link to download the two example masks can be found at the end of this post.
• Once these are imported they’ll show up in the Resources panel
• Once you have imported these, we can go up to the scene tree, hit the plus button and add a Face Mask component.
• Then in the Inspector Panel on the right hand side, with the Face Mask selected, we’re going to click on the Texture field. Once you’ve clicked on that a dialogue box will open and we’ll select one of our mask images that we’ve imported. Here we’ll select the Flower_Face image.
• as you can see, the Flower Face image is added to the Face Mask component and is now visible on the User’s face in the simulator window. The next thing you can do is play around with the blend mode options in the Face Mask to get to something you really like.
• Why don’t we try that again and select the other image mask. Using this mask, if you select Multiply under the blend modes, the white base will disappear and the mask will be multiplied onto the user’s face.
• In this example, we’ve selected the Hard Light blend mode and we’ve then reduced the Alpha value in the Inspector, this has the effect of reducing the opacity of the Face Mask on the User.
• We’re pretty much done in this tutorial now, but if you want to go away and create your own Face Mask, under Textures>Face Substitution Points in the Resources Panel is an image we can use as a guide. To export this image, right click on it and select ‘Show in Finder’, then copy that image and paste it to your documents. You can then open this in Photoshop or an image editor of your choice and draw your new Face Paint mask directly on top, using it as a guide.
• This image shows the reference points alongside a Face Paint image to show you what that looks like.