OBJECTIVES
On two separate occasions, Streem needed a playful gift to celebrate milestones: one for a favorite customer (a popular manufacturer of wood-pellet grills) and another for Streem’s own employees celebrating the winter holidays.
We had a standing secondary goal of demonstrating knowledge and credibility in the broader field of XR technology in which Streem operates, and these projects provided a perfect opportunity to explore a neighboring technology.
PROCESS
The customer-facing project came first, and the employee-facing one followed a very similar process. I’ll focus my account on the first project.
I participated in a short series of workshops with our Marketing UX Director and a fellow visual designer to brainstorm an appropriate gift, and we settled on a physical gift basket to be accompanied by an interactive camera experience powered by Instagram. Recipients of the physical package would access the digital experience by scanning a QR code from the included card. I was tasked with creating the effect, while other team members designed and assembled the tangible gifts. I came to a second workshop with a sketch and pitch, expressing the interactivity and motion I had in mind. After getting input from my teammates, I jumped right into production.
I’d previously experimented with Spark Studio and its competitor, Snap Studio, but I learned a lot of new skills on the fly by referencing documentation and consulting experts within my network. Some of the skills these two projects taught me:
Configuring particle systems to create the smoke and snowflake effects.
Mapping 3D objects to a user’s face in a live video image
Optimizing and placing 2D animations as textures on 3D objects
Creating HDR textures for an environment map that a bright and crisp reflection of Streem’s logo on the user’s virtual sunglasses
Detecting the presence of a particular image on a printed card when it’s held up to the camera, and triggering an alternate experience in response
Interactively applying color transformations to a live camera feed using multiple color lookup tables
Dynamically controlling sound effects in response to a user’s gestures.
Optimizing the experience to work on a wide range of devices and within the technical limitations imposed by the Spark AR platform
After producing a functioning prototype, I went a few rounds with my teammates and used their feedback to refine and enhance the experience before publishing it and generating the QR code for the gift card.
DELIVERABLES
Each of the below effects can be accessed using a provided link or QR code on a mobile device, and automatically opens in the Instagram app.
Designed to celebrate a milestone in Streem’s relationship with their most active customer, this effect includes responsive sound, particle effects, and an animation mapped to the inside of the user’s mouth (I used a sphere with inverted normals)
Winter Wonderland
As part of an overall winter greeting package for Streem employees, this filter added an element of discovery by hinting users to flip to their rear camera and aim it at the companion card. When the card was recognized, it triggered a secondary effect in which the user was virtually transported into the scene from the card’s illustration.
Included as part of a winter greeting package for Streem employees, this effect includes a particle system and a secret trigger that changes the background image when the user holds up the physical greeting card that led them to the effect.
OUTCOMES
Our customer’s leadership team was impressed and excited by the first effect, and internal feedback within Streem was equally enthusiastic — as evidenced by the demand for a second effect when the holidays came around.