Best Practice for Effect Creation

Best Practice for Creating Effects in Spark AR Studio

A woman working on Spark AR Studio using a desktop PC.

Use these tips when you're planning and creating effects in Spark AR Studio. They'll help you make effects that people will want to interact with, and share.

When planning your effect, keep in mind that effects submitted to both Facebook and Instagram are reviewed to make sure they follow our community standards and platform policies.

Whatever platform you're submitting your effect for, there are some extra tips to follow to make sure your effect is accepted.

Effect strategy

Focus on a solid use case

For example:

  • I want to express who I am, what I'm doing, or how I'm feeling right now.
  • I want to connect with others and have a conversation.
  • I want to be funny, silly or something 'other' than myself.
  • I want to share current news, topics or trends.

Make it social

Consider adding support for multiple faces to your effect, so people can use it with friends.

Keep it simple

Not all users will have used AR before. To stop people becoming frustrated, manage expectations on what kind of experience should be expected and how much effort they’ll need to contribute. For example by:

  • Adding clear instructions.
  • Making sure any interactions are intuitive.
  • Focusing on one or two main interactions, so people can learn the full effect experience easily.

Design for different device types

Test your effect on multiple types and generations of mobile devices to make sure that effect works well. The majority of people who use Facebook use Android mobile devices and younger people tend to use older ones.

Design for repeat use

The most engaging effects are ones that are flexible and can be used in different contexts.

Effects that are relevant year-round will give your work a longer shelf life.

Effect design

Add to the camera experience

Avoid taking over lots of the camera view, or making people completely unrecognizable.

Allowing people to keep recognizable elements of their environment or body helps make the effect feel personal.

It's a good idea to avoid completely obscuring faces - for example with static masks. If you do make a mask effect that covers the face, it should react to the user. For example, it should respond to their expressions, movements or interactions.

Avoid the edges of the screen

If you add objects on the edges of the composition, there's a chance they will be obscured by UI. It's best to avoid placing objects too close to the edge of the camera screen if you can.

Give people something to capture with the lowest amount of effort

Most people move on from an effect in a few seconds. Make sure the main features of your effect happen as soon as possible.

You should also avoid adding lots of additional UI or fixed text into your scene, unless it really adds to the effect. Having lots of text and UI increases the time it takes for people to look at and understand an effect, which makes it less likely for them to enjoy and share it.

Adding interaction

People interact with an effect using gestures - like tapping the screen, or moving their face. Follow these guidelines to make gestures as effective as possible in your effect.

Keep interactions obvious

Think of the most natural movement to trigger the most obvious change - for example, pinching the screen to make an object bigger or smaller.

Avoid using gestures that conflict with system-level commands

These are interactions that people are already familiar with on their mobile devices. Changing how these commands work can be confusing and frustrating. System-level commands include:

  • Switch camera view - double tap.
  • Camera zoom - pinch in/out (except when resizing stickers or 3D objects).
  • Video zoom - touch and hold camera capture button then drag up.
  • Return to Facebook News Feed - swipe left.

Keep interactions to a minimum

Focus on 1 or 2 main interactions, so that people can learn the full effect experience easily.

Using instructions

Instructions are text that's temporarily overlaid on the camera view to help people understand what they need to do to experience the whole effect.

Capitalize on Facebook's standard instructions

  • For standard interactions, use platform-accepted interaction instructions. It's likely that people are already familiar with these interaction models and so will have greater success when using your effect. Even if the instruction text is visible on the screen during capture, it won't appear in the captured photo or video.
  • Platform-accepted interaction instructions also work well because they leave room for discovery and delight, by only including the gesture command. For example, 'Tap anywhere', instead of combining the gesture command with the outcome, like 'Tap anywhere to see fireworks'.

Avoid creating custom interaction instructions

If you need to create custom interaction instructions, it's best to:

  • Only include the gesture command, not the outcome.
  • Use simple, straightforward instructions to help people understand.
  • Ask people to perform one gesture at a time only - this is the best way to explain how to use an effect.
  • Don't use a text object to add custom interaction instructions. Use the Instructions module and format in system text, 16pt, semi-bold, centered, white. Use sentence casing. Or, easily add instructions in the Patch Editor

Reveal instructions progressively

  • Make sure that the timing or triggering of client-side and server-side instruction text doesn't overlap and that ephemeral (disappearing) strings are visible for an optimal time of 3 seconds.
Was this article helpful?