Home Screen
Profile Section
Leaderboard
Matchmaking
In game
In game
In game
Victory Screen
Trophy Update Screen

Scroll Clash — Devpost Submission

Inspiration

We wanted to turn doomscrolling into a game—and make it competitive. Social feeds are designed to keep us hooked, but we rarely think about how we're consuming content. What if scrolling through reels could be a skill-based battle? We drew inspiration from battle royale games and the "brain rot" meme culture: your Brain character reflects your engagement level, and you can duel friends in real time to see who scrolls smarter, not just longer.

What it does

Scroll Clash is a 1v1 competitive doomscrolling game for iOS. Two players join the same match, scroll through the same reel feed, and compete on engagement-driven scores in near real time.

Duel Arena — Match with a friend or get paired, then scroll through a shared short-video feed. Your scroll behavior (view time, likes, scroll velocity) drives your score. Live score snapshots update as you play; the highest score when time runs out wins.
Brain Lab — Customize your brain character with hats, glasses, expressions, skins, and effects. Your "ROT" percentage tracks your engagement level and gives the game its playful, self-aware tone.
Boost Deck — Equip power-ups before a duel to gain an edge. Manage your cards and strategize.
Daily Challenges — Complete objectives like "No Rage Flicks x60s" for bonus rewards.
Graveyard — A visual history of your brain health over time. Toggle between "Healthy" and "Graveyard" days to see how your scrolling habits played out.
Leaderboard & Profile — Climb the ranks, track trophies, and show off your Brain.

How we built it

Client: Native iOS app built with SwiftUI, Combine, and AVKit. We went fully native for smooth scrolling and low-latency video playback.
Backend: Supabase — Postgres for schema and RPC functions, Auth for anonymous sign-in, and Storage for reel videos. Server-authoritative scoring ensures fairness: clients send raw telemetry only; SQL functions compute and persist scores.
Real-time pipeline: Telemetry events (view_start, view_end, scroll, like) are batched every 200–500ms from the client. The backend runs score snapshots on a cadence and broadcasts them for live UI updates. A cache layer with TTL and stale-while-revalidate keeps the feed snappy.
Design: The UI was first prototyped in Figma, then implemented with a neon arcade design system (NeonTheme, striped backgrounds, bold outlines) for a distinct, playful look.

Challenges we ran into

Real-time sync — Keeping two players in lockstep on the same feed while updating scores live was tricky. We had to balance polling cadence, batch sizes, and cache TTLs to avoid lag or inconsistency.
Score integrity — Making scoring cheat-resistant required server authority, idempotent telemetry writes (client_event_id deduplication), and RLS so users can only write into their own match data.
Low-latency UX — Video URLs, feed data, and score snapshots all needed caching. We added in-flight request deduplication, warm-start caching, and adaptive polling to keep the app feeling instant.
Native vs hybrid — We had an existing React/Vite + Capacitor prototype for design reference. Porting the duel flow and real-time logic to native SwiftUI meant rebuilding the gameplay pipeline while preserving the visual design.

Accomplishments we're proud of

End-to-end duel flow — Matchmaking, pre-duel countdown, live arena with shared feed, real-time score display, and result screen with winner announcement.
Server-authoritative scoring — Modular SQL scoring formula (likes, view_end, scroll velocity) that’s easy to tune without client updates.
Brain Lab — A full customization system with multiple categories (hats, glasses, skins, effects) and a cohesive neon aesthetic.
Graveyard metaphor — Turning "brain rot" into a tangible, visual history (healthy forest vs graveyard) that fits the theme and gives users a reason to care about their habits.
Production-ready architecture — Supabase contracts (schema, RLS, RPC), cache policies, and reliability patterns (retry, backoff, token refresh) that scale beyond a hackathon demo.

What we learned

Telemetry design — Structuring events (view_start/view_end, scroll velocity, likes) so the backend can derive meaningful scores without trusting the client.
SwiftUI + Supabase — Integrating Postgres RPC, Auth, and Storage into a reactive SwiftUI app with Combine. Caching and resilience (stale-while-revalidate, request deduplication) matter for a smooth experience.
Server authority — Why client-submitted telemetry should be append-only and score computation should live in SQL: it prevents manipulation and keeps logic in one place.

What's next for Scroll Clash

More boosts & power-ups — Expand the Boost Deck with new cards and effects that change how scoring works during a duel.
Social features — Invite friends by link, in-app chat during matches, and shared replays.
Content expansion — Support for multiple feed types, user-uploaded reels, and themed playlists.
Graveyard analytics — Deeper insights into scrolling patterns, weekly trends, and personalized "brain health" tips.
Cross-platform — Bring the duel experience to Android and web so more players can compete.