CLEAR

Tips and Tricks

This guide gives you some suggestions to help you make your effects as successful as possible.

Effect Guidelines

Effects should be designed with care and thought for everyone on Facebook:

  • All Spark AR Studio effects must comply with the Camera Effects Platform Policies and Terms. When using and sharing these effects, please be respectful and avoid distasteful, stereotypical or offensive images.
  • We want people to feel safe when using Facebook. For that reason, we've developed the Facebook Community Standards. These policies will help you understand what type of sharing is allowed on Facebook, and what type of content may be reported to us and removed.

Making a good effect

Effects help make photos and videos more shareable. We've learned what makes an effect more likely to be shared and why.

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 share about current news, topics or trends. - I want to connect with others and have a conversation. + I want to be funny, silly or something 'other' than myself.

Add to the camera experience

  • Avoid taking over the majority of the camera view or making people completely unrecognizable to themselves. Allowing people to keep recognizable elements of their environment and/or their body helps to make the effect personally relevant.

Make it social

  • Consider adding support for multiple faces to your effect.

Keep interactions and animations obvious.

  • Think of the most natural movement to trigger the most obvious change.

Visual Design

Make sure your effect isn't covered or hidden by the camera UI

  • UI in both pre- and/or post-capture camera view states, as well as in the Facebook Stories view state, will cover up a small part of the top and bottom of effects. Make sure it doesn't cover up the best or most critical part of your creation.

Design for both iOS and Android mobile devices

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

Give people something to capture and share immediately, with the lowest amount of effort

  • Avoid adding additional UI or fixed text into your scene because it increases learning time and hinders quick sharing. Additional UI or fixed text can also appear in photo and video captures and take away from the viewing experience.

Gestures

People interact with an effect by using gestures. These gestures can be performed on screen (by touch) or through detection (by moving a facial feature in front of the camera).

Avoid using screen gestures that conflict with system-level commands

These are interactions that people are familiar with on their mobile devices and within Facebook. Changing how these commands work adds confusion and frustration. These screen gestures 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 contained

  • Where possible, avoid full-screen gestures. You can attach gestures to smaller areas by attaching them to specific objects in your scene.

Keep interactions to a minimum

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

Interaction Instructions

Interaction instruction text is 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-approved 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.
  • The platform-approved interaction instruction leave room for discovery and delight by only including the gesture command, like '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.

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.

Effect Icons

Effect icons represent your effect in the camera and are often the first thing people see of your effect. Learn more about how to create them.