How to create your first Instagram filter in 4 simple steps. The different steps to create your own Instagram or Facebook filter. Create and publish an Instagram filter for a brand.
To create your Instagram filter you will first need to download and install the official software made by Facebook which will allow you to create filters for Instagram and Facebook.
Official page link: https://sparkar.facebook.com/ar-studio/
It will be essential to prepare your various media such as images, photos, video or 3D models correctly so that they are optimized for your future filter because the maximum size of an Instagram filter cannot exceed 4mb.
To optimize your images we recommend: https://tinypng.com/
To optimize your 3D models we recommend: SparkAR Toolkit for Blender
For a quality filter, it is recommended to add interactions with the user, such as an animation when the user opens his mouth, blinks, smiles,…
Link to official tutorials: https://sparkar.facebook.com/ar-studio/learn/tutorials/
For the publication of your filter, the official guide in English is here: Official guide for the publication
You will need to provide an icon and a demo video that will accompany your filter.
Go to Spark AR and click on the upload icon at the bottom left and choose to upload the filter as a new effect. (See also: Add an AR Manager )
Once you have the different media in hand, you have two options to apply the different interactions to these images, illustrations or 3D models. The first is module-based programming which is intended for advanced designers who are used to working with this type of module-based programming such as in Unreal Engine, Blender, Cinema4D, … The patches will therefore allow you to be able to link
blocks between them to, for example, animate the position of an element.
This type of programming is specific to facebook and will be used to create different applications and experiences for future augmented reality glasses by facebok in a few years (months?). Facebook introduced this language to be able to link interactions or functions to different events occurring in real time. For example, when the user opens the gesture, closes the eyes, frowns, is happy, moves his head, taps the screen, holds the screen, performs a swipe gesture on the screen, etc. The list is long and this type of language can be very useful when creating complex filters. In comparison, Three.js, a web-oriented 3D engine, does not use Reactive Programming but is geared towards frame-by-frame or frame-by-frame programming,
To connect your Instagram account to a Facebook page:
– Log in to your Facebook page on your computer.
– Access the settings at the top right of your page.
– Click Page Roles in the left column and make sure you are listed as an admin or editor.
– Click on Instagram in the left column.
– Click Connect Account.
– Enter your Instagram account username and password. Note that if you have a personal Instagram account, this step will convert it to a business account.
Adding an AR Manager to your Facebook page allows the creator of the filter (AR Manager) to be able to publish and link the filter to your Facebook page and Instagram account. For a publication on Instagram, the Instagram account must be previously linked to the Facebook page.
Go to: Spark AR Hub Dashboard and follow the steps below (see image).
1) Go to the Meta Spark Hub Dashboard 2) Click on your profile on the top left, keep your FB profile selected. 3) Check that your Instagram account appears in the list. – If yes, everything is fine, do not select the Instagram account, keep the Facebook profile selected.
– If you don’t see the Instagram account, follow the instructions below “How to link my Facebook profile”
4) Click on “Settings” at the bottom left.
5) Click on the “Permissions” tab and select the Facebook page linked to the target Instagram account.
6) Click on “Create group”.
7) Add a group, name it for example “AR Manager Group”
8) Add the Facebook profile of the creator of the filter: “Bastien Sarolea”
We take care of everything for you!
The Filtre Experience team has the necessary skills in:
– 2D on Photoshop
programming – Logic by Patch modules We are therefore ready to be able to realize all your ideas, however technical and complex they may be! The only limit is your imagination!
We agree an innovative idea with you
We create the necessary assets for you
We develop all interactions for you
We publish it together on your profile, at home