The Inspiration
The project was inspired by the โDecision Rouletteโ trend.
I wanted to create a Lens that felt more personal and edgy than a standard random picker. The idea was to take the relatable feeling of being โannoyingโ to people we love (or our bank accounts) and turn it into a shareable, humorous moment.
Building the Experience
The core of the experience is a Weighted Probability Engine.
Instead of every result having an equal chance, I built a system where the best outcome (Nobody) is rare, making the spicier results feel more common and funny.
I also integrated a typewriter effect for the results to build suspense during the reveal.
The Technical Logic
To ensure the wheel lands exactly on the visually correct slice, I used a mapping system between the final rotation angle and the sector indices.
The target angle is calculated using:
$$ TargetAngle = (Spins \cdot 360) + (360 - SectorOffset) $$
The smoothing of the wheel uses a cubic ease-out function to simulate realistic friction:
$$ Ease = 1 - (1 - t)^3 $$
Challenges Faced
The biggest hurdle was Emoji Rendering.
Standard JavaScript string slicing often breaks complex emojis (such as couple or family emojis). I solved this by using Array.from() to treat the string as a collection of visual characters rather than raw bytes, ensuring the typewriter effect renders correctly.
Another challenge was Platform Compliance.
The original concept was too negative for Snapchatโs guidelines, so I pivoted the branding to โWhoโs done with me?โโa phrase culturally understood as a joke, making it safe for a wider audience.
What I Learned
- UX Suspense: Using audio ticks and easing functions to create anticipation.
- String Manipulation: Handling Unicode and surrogate pairs for emojis in Lens Studio.
- Branding Adaptation: Tweaking a conceptโs tone to meet community guidelines without losing the fun.
Built With
- api
- javascript
- lensstudio
- screentransform
Log in or sign up for Devpost to join the conversation.