Gif Battle Royale

Inspiration

Two friends, one Slack chat, and way too many reaction GIFs. We wondered:
What if our memes could actually FIGHT instead of just react?
When the World’s Largest Hackathon announced the One-Shot Competition (build an app from a single prompt on Bolt), we had the perfect excuse to turn that shower thought into reality.

What It Does

• Pick or upload two GIF “warriors.”
  
• Click FIGHT! and watch their health bars drain frame-by-frame.
  
• A lightweight damage algorithm decides who gets the last pixel standing.
  
• Quick-share buttons let you brag about your champion on socials.

How We Built It (One Prompt, Many Pieces)

The prompt defined the repo, files, and base styles. All tweaks afterward were limited to bug fixes only to comply with the One-Shot rules.

Challenges We Faced

1. “One and Done” Prompting – Packing the entire spec (routing, state, styles) into a single Bolt prompt took more drafts than the app itself.
   
2. Asset Paths in Vite – Learned (the hard way) that /src/assets/ gets stripped out on build.

Accomplishments We’re Proud Of

• Functional, mobile-responsive MVP in < 48 hours.
  
• 100% uptime on Netlify from first deploy.
  
• Kids, coworkers, and even grandma now know what “GIF smackdown” means.

What We Learned

• The power (and pain) of prompt engineering for real-world apps.
  
• Tiny UX tweaks (sound effects, confetti) make memes 10× funnier.
  
• DevOps can be “push → coffee break” simple with the right stack.

What’s Next

• Multiplayer lobby: queue up global GIF duels.
  
• Custom rule sets: elemental damage, status effects—go full RPG.
  
• Twitch overlay / OBS widget so streamers can host live meme tournaments.
  
• Leaderboard NFT badges for undefeated champions (because why not?).

Built With ❤️ & ⚡ on Bolt

Built With

• bolt
• netlify
• react
• tailwind
• vite