Mujtama

Mujtama is an accountability community platform where users stake real money to join goal-focused groups, attend weekly live video meetings, and prove they are working toward their goals or lose their stake.

Scope
  • UI/UX overhaul and design system built from scratch
  • Frontend architecture refactor for Supabase Realtime and WebRTC video
  • Gamification UI: badges, leaderboards, streak tracking, and progress dashboards
  • Community lifecycle management and dispute reporting system
ServicesProduct UX, UI Design System, Frontend Architecture Refactor, Component Rebuild, Performance Optimization
TechReact, TypeScript, Vite, Tailwind CSS, Supabase (Postgres, RLS, Realtime, Edge Functions), TanStack React Query, Framer Motion
IndustrySaaS / Community Platform
Year2025
Background

Mujtama is built around a high-stakes premise: users stake real money ($10–$500) to join goal-focused communities — fitness, coding, writing, music, and more — and must attend weekly live video meetings to reclaim it. The MVP had been scaffolded with AI tooling and quickly outgrown its foundations. We were brought in to rebuild: establishing a coherent design system from scratch, refactoring the frontend architecture, and making the codebase capable of handling what the product actually required — WebRTC peer-to-peer video meetings, Supabase Realtime community chat, badge automation, leaderboards, and a community lifecycle system that automatically qualifies or disqualifies members based on meeting attendance data.

Challenges

Every screen felt inconsistent because there was no design system — just ad-hoc styling decisions accumulated over time. More critically, the architecture was not structured to support real-time features reliably: WebRTC P2P video, Supabase Realtime WebSocket chat, typing indicators, online presence, and a dispute resolution system where community members vote to disqualify rule-breakers. Rebuilding the frontend properly meant making deep architectural changes without disrupting existing product logic — which required fully understanding the codebase, including the Supabase Edge Functions handling meeting management, notifications, and vote tallying, before touching anything.

Outcome

Mujtama now runs on a clean, production-ready frontend with a consistent design system and an architecture that supports live WebRTC video meetings, real-time chat with reactions and presence, a community vote-based dispute resolution system, automated badge awards, global leaderboards, streak tracking, and creator analytics — without technical debt getting in the way of what comes next.

Mujtama case study, overview
Mujtama case study, detail 1
Mujtama case study, detail 2
Mujtama case study, detail 3
Mujtama case study, detail 4
Mujtama case study, final