3 min read
WeOuddy

A full-stack platform enabling communities to create, share, and engage in events with real-time interactions. Currently in beta with plans for AI-driven enhancements.

Next.js 15 TypeScript Supabase Realtime DB Framer Motion UX Research Beta Launch
WeOuddy platform showcasing real-time event interactions
Where events become shared experiences

The Problem: Static Events, Passive Participation

While building FarmersPortal, I observed a critical gap:

  • Events ≠ Experiences: Platforms treated events as calendar items, not living moments.
  • No Ownership: Small communities relied on WhatsApp/Facebook, losing control over their narratives.
  • Privacy Tradeoffs: Public events went viral, private ones felt isolated.

Most users comment: “I want to relive the concert vibe, not just see photos later”

What We Built: Real-Time Event Engagement

Core Features (Implemented)

  1. Dynamic Event Creation

    • Public/private events with granular permissions (SSE encryption for private groups)
    • Media-rich posts: Photos, videos, text (IPFS storage for scalability)
  2. Live Interaction Engine

    • Supabase Realtime for instant updates (messages, likes, shares)
    • Presence indicators showing active participants
  3. Community-Centric Design

    • Role-based access controls (admins/moderators/participants)
    • Reporting system to maintain community guidelines

Tech Stack:

  • Next.js App Router for SSR performance (90+ Lighthouse score)
  • Prisma ORM over Drizzle ORM (for now)
  • Supabase Realtime over Firebase: Needed PostgreSQL’s row-level security
  • Framer Motion for fluid transitions (key for live updates)

Real-time event engagement UI

The Build: Lessons from the Trenches

Iterative Process

  • Conducted 10+ user interviews
  • Started with Figma prototypes testing permission workflows
  • Pivoted from Firebase to Supabase after scalability stress tests

Technical Deep Dive

// Simplified real-time event listener
supabase.channel('messages')
  .on('postgres_changes', { event: 'INSERT', schema: 'public' }, (payload) => {
    // Update UI in real-time
  })
  .subscribe();