Vue / Laravel
P&G Olympic Games
P&G wanted to establish more brand presence in a fun way and educate consumers about their product lines and how they can be used together as part of a regimen. We gave them a series of their own branded games.
The Idea
P&G wanted brand engagement that didn't feel like a commercial. Their ask was straightforward: help consumers discover how P&G products work together as part of a daily regimen, but make it fun. My answer? Give them their own Olympic Games.
Game On
I built a series of branded mini-games that were playful, competitive, and sneakily educational. Each game tied back to a P&G product category, teaching users about product benefits while they were busy trying to beat their high score. Think product knowledge wrapped in a dopamine loop.
If you can make someone smile while they learn about your product, you've already won.
How I Built It
- Vue.js for reactive, game-like UI interactions with smooth state management
- Laravel backend handling score tracking, leaderboards, and user sessions
- Canvas and CSS animations bringing the game mechanics to life
- Gamification mechanics including points, streaks, and shareable results
The Impact
The games drove significantly higher engagement times compared to traditional product pages. Users weren't just clicking through. They were playing, replaying, and sharing. P&G got the brand education they wanted, and consumers actually had fun getting it.