Facebook AR Studio


Thinking about recent, top trending topics in technology, two things come to my mind : Elon Musk’s Mars mission and Snapchat’s Dog Filter. 😀 😀

Snapchat brought it’s AR filters into action a few months back which certainly got too trending to describe. But it has a limitation from developer’s point of view. Snapchat doesn’t provide an open platform for developers to contribute to AR filters.

Facebook too has an AR filter functionality in it’s app. Now, it has opened doors for developers to build their custom filters and to share them publicly via Facebook app. Facebook has a tool which they call AR studio using which we can build interesting, interactive and life-like filters. Building simple effects using face-tracking or hand-tracking is a piece of cake.

Facebook provides a great and an easy-to-catch-up series of video tutorials regarding AR studio. Here is the link : https://developers.facebook.com/docs/ar-studio/tutorials
I’ll demonstrate one of the samples from this link.


We’ll need following components to start our fun-filled journey:

Here is the initial screen of AR studio.


Creating a new project will output following screen. I have mentioned necessary nomenclature in the image itself.



We’ll build a demo wherein a beard, eyebrows and a moustache will be placed on the face and it’ll be tracked with the face movements.

Step 1: Insert a face-tracker from the insert button in toolbar. Now, there’ll be axis (x, y and z) on the face, tracking it as it moves.


Step 2: Insert a facemesh from the insert button in toolbar that will cover the entire face.


Step 3: Create a material and apply texture to it.

Select facemesh from Scene tab and add a material to it from inspector menu by clicking + sign.


Now, it’s time to apply texture to material. Texture is an image of beard, moustache and eyebrows as shown below. On an unrelated note, such textures and 3D objects can be built by 3D artist using tools like Maya and Blender. This studio supports models like .fbx, .obj and .dae.


Select the material from assets panel and add the texture to it from inspector panel as shown below


That’s it. You now have an AR effect ready to be previewed.

You can preview in a physical device using Mirror icon of toolbar in top-right of window.
The effect can be exported using Export icon next to Mirror icon.

To make your effects publicly available, you’ll need to submit them to facebook. They’ll review it and will process them further. There are steps and conditions that should be followed and fulfilled respectively in this process. Have a look here : https://developers.facebook.com/docs/ar-studio/docs/submitting/

A lot can be done with AR studio. Hand-tracking, plane-tracking, creating raining effect, detecting gestures are a few of the many capabilities of the studio.

Here is a snap showing few samples.


Facebook AR at Yudiz

We, here at Yudiz, are focusing on building a fantasy world which can be entered through a portal, using Facebook AR studio.

Conclusion :-

There are over 2.23 billion monthly active users on Facebook. Facebook AR studio is a great platform to reach out to billions of users and to display our creativity through Facebook and AR. Apart from statistical point of view, such augmented reality is here to stay for a long time as it increases user interaction with the app which ultimately increases user base.


Sumeet Rukeja Android Developer

An Android App Developer with good command over core Java and an increasing interest in Kotlin. Enthusiastic about new technologies in Android world, including Google ARCore and neural networks. A Machine Learning admirer & in love with flutter. A F.R.I.E.N.D.S fan.

Comments are closed.