12FPS — Project Overview

Inspiration

Inspired by anime (independent animators), classic 2D fighting game frame-by-frame timing, and the collaborative spirit of basepaint.xyz.

The idea: a lightweight, persistent place to co-create hand-drawn animation at maximum of 12FPS

What it does

12FPS lets users:

  • Draw frames collaboratively.
  • Manage palettes.
  • Pick brushes.
  • Build short loopable animations directly inside Reddit via Devvit.

How we built it

Stack:

  • Devvit Web
  • Redis (for frame + palette persistence)
  • React
  • TypeScript
  • Minimal Tailwind utility layout

Process:

  • Started as a dual setup (Vercel + Devvit).
  • Later refactored to a single Devvit-focused codebase, removing redundancy.
  • Redis simplified storage (no custom image hosting pipeline required).

Challenges we ran into

  • Sudden loss of access to stored images (root cause still unknown). Creating a fresh app instance fixed it.
  • Maintaining two parallel folders (Vercel vs Devvit) caused confusion—biggest productivity drain.
  • Migration friction: restructuring to a single directory, SSR build tweaks, and removing assumptions from the earlier deployment path.

Accomplishments we’re proud of

  • Unified repo (clean, single entry).
  • Stable Redis-backed frame persistence.
  • Palette + brush system refactored for concise UI footprint.
  • Fast iteration cycle fully inside Reddit’s ecosystem.

What we learned

  • Start with the target runtime (avoids architectural churn).
  • Devvit + Redis drastically lowers friction vs rolling custom infra on Vercel / Farcaster.
  • Keep layout primitives consistent early (sidebar width, panel ordering) to avoid cascading UI rewrites.

What’s next for 12FPS

  • Long-term communal animation archives (preserve every clip).
  • More brush personalities and onion-skin refinements.
  • Lightweight moderation + versioned frame history.
  • Export pipelines (GIF / MP4).
  • Gradual customization layer without fragmenting the core experience.

Continued goal: enable years of collaborative animation while keeping all created videos intact.

Built With

Share this project:

Updates