AR Stickers
As the place for emerging culture and self-expression, Instagram is the perfect place to empower people with Virtual Objects and AR as creative tools.
The goal is to empower people to create and share world AR content at scale, focusing on scaling World AR adoption for the sharing use-case on mobile, prioritizing AR Stickers on Instagram Stories and Reels as well as the first display use cases for Digital Collectibles (NFTs).
Features
Object Placement
Problem: We want the user to have complete freedom over where they place their item, but want it to be tethered to a physical space.
Result: The initial stage of this, in order to not overwhelm the user's screen, only showed plane tracking within a specified radius the Sticker itself. However, we realized that it was actually more accessible for the user to see all the different planes they could choose from!
Smooth Motion
Problem: Tapping for selection was found to be undiscoverable.
Result: Selection and manipulation can begin the instance that the user's finger intersects with the sticker!
Key Factor: Needed to keep track of selection before manipulation for communication between various objects in scene.
Occlusion
Problem: Man, wouldn't it be nice to play hide and seek with the little guys in my phone?!
Result: Effect applies a shader onto the stickers to hide portions of them which are occluded by a closer object in the real world.
Note: This did require distance tracking to be available in Spark AR!
Deletion
Problem: With so much content on the screen, we needed to make sure that the effect had an easily discoverable deletion method.
Result: The Sticker’s bounding box is taken from 3D space to 2D space -- when the bounding box intersects the “deletion zone” (bottom of the screen), an animation is triggered to shrink the sticker, and an event is sent to native to scale up the trash icon.
On release, if the object is in the deletion zone, it is destroyed. Otherwise, it remains in position of release.
NFT Loading
Problem: Instagram had a Wallet where you could store your NFTs! Can we give them a way to show their NFTs off?
Result: Users could load their NFTs onto their story as Stickers! The NFTs had an additional shader applied to make the flat images shine, so that you know they're special!
Triggered Animations
Problem: Once the users placed their Stickers into the scene... then what?
Result: Each 3D Sticker came with it's own unique animation which would play when triggered! This would be a fun surprise for people who tapped around their scene, as the animations would start and stop on tap!
