song association

spark ar
figma

Inspiration

As a music lover, you've probably come up with a game where, given a time limit, you have to sing a song that includes a random word that is given to you. With many variations of this out there in the world, I thought I'd create an interactive filter based off the game!

What it does

Once the user starts recording, the filter will display a randomly generated word, promoting the user to sing a song that includes that word in under 10 seconds!

How I built it

I used Figma to design the assets (which were custom made), which are inspired by Spotify's mobile app. The main reason why I based my design off of Spotify is b/c their design is recognized globally, which can ease users into using the effect - even potentially increasing overall usage!

The effect was built in Spark AR using the patch editor and a script, written in JS.

Challenges I ran into

A challenge that I ran into was making the size and scale of the assets appear normal in a variety of phone screen sizes. I actually needed to update my asset designs to make this easier.

Accomplishments that I'm proud of

Before submitting on Spark AR, I sent test links to a bunch of my friends/followers. And based on the feedback, I was able to update my assets to be borderless and edit the countdown sounds to be less intrusive. As an aspiring product manager, this iterative implementation of feedback was something I was super proud of.

I also found out that people REALLY enjoyed using it! The effect is fun & challenging, prompts reactions & creative performances from users, and the resulting videos are perfect for posting on both Instagram Story and Reels!

What I learned

I learned that is important to make sure that my effects have the same user experience on a variety of phones. Most people don't have the newest iPhone or Android.