Building Orbuc: The Technology Behind Global Consensus

Why Technical Decisions Matter for Civic Tech

Most civic technology platforms fail not because of bad ideas, but because of bad architecture. They can't scale when a crisis drives traffic. They can't deliver the real-time experience users expect. They can't maintain the security and privacy that democratic participation requires.

When we set out to build Orbuc — the global sentiment platform we announced at launch — we made deliberate technical choices to avoid these failure modes. This post details those choices and the reasoning behind them.

The Stack

Next.js 15 + React 19

Orbuc runs on Next.js 15 with the App Router, leveraging React 19's Server Components for optimal performance. This architecture enables:

• Server-side rendering for SEO-critical pages (topics, blogs, explore feed)
• Server Components that fetch data without shipping JavaScript to the client
• Server Actions that handle mutations (votes, opinions, predictions) with zero API boilerplate
• Streaming that shows content progressively as data loads

The App Router's file-based routing with route groups organizes our codebase cleanly: (protected) for authenticated routes, (legal) for public legal pages, and top-level routes for the public-facing experience.

Supabase (PostgreSQL + Auth + Realtime)

Supabase provides our entire backend infrastructure:

Database — PostgreSQL with Row Level Security (RLS) policies that enforce access control at the database level. Every query is constrained by the authenticated user's permissions, regardless of what the application code requests. This defense-in-depth approach means that even a compromised application server cannot access unauthorized data.

Authentication — Email/password and Google OAuth with automatic session management. The middleware refreshes auth tokens on every request, ensuring seamless session persistence without client-side token management.

Realtime — WebSocket subscriptions power Orbuc's live features:

• Notification delivery in under 1 second
• Vigil participant counters that update as people join
• Activity feeds that refresh without polling

Tailwind CSS 4

Orbuc uses Tailwind CSS 4 with the @theme inline configuration for design tokens. This ensures consistent typography (DM Sans for body, Sora for headings), spacing, and color systems across every component.

Capacitor 8

Orbuc is a Progressive Web App that also ships as a native iOS and Android app through Capacitor 8. The Capacitor integration enables:

• Native push notifications
• App Store distribution
• Hardware-accelerated animations
• Safe area handling for notched devices

The Data Architecture

Read/Write Separation

Orbuc enforces a strict separation between data reading and data writing:

• Read operations live in src/lib/data/ — pure server functions that query the database
• Write operations live in src/lib/actions/ — Server Actions with 'use server' directives

This separation provides clear auditability (every mutation is traceable to a server action), testability (read functions can be tested independently), and security (write operations are explicitly marked and validated).

The Vote Pipeline

When a user casts a vote, a cascade of operations executes:

1. Vote insertion — The vote is recorded with user ID, topic ID, and stance

2. Sentiment recalculation — Support/oppose percentages update in real time

3. Profile update — User's vote count and impact score increment

4. Streak check — Consecutive daily voting is tracked

5. Badge evaluation — Category-specific badge thresholds are checked

6. League points — Weekly competition points are awarded

7. Notification dispatch — Topic creator is notified of new votes

All seven steps execute within a single server action, with database constraints ensuring data integrity even under concurrent load.

Geographic Sentiment

Votes include geographic metadata (country-level, derived from user profiles) that enables the geographic sentiment breakdowns we described in our piece on real-time data. Aggregated geographic data is computed using PostgreSQL materialized views that refresh incrementally, providing low-latency access without per-request computation.

AI Infrastructure

Topic Normalization Pipeline

The AI pipeline we described in our post on bias neutralization runs as a Server Action that orchestrates multiple API calls:

1. GPT-4 for neutral rewriting — Generates bias-free titles and descriptions

2. Automatic categorization — Assigns topics to the appropriate category taxonomy

3. Hashtag generation — Creates discoverable tags

4. Embedding generation — Produces vector embeddings for semantic search and recommendations

The pipeline runs asynchronously with optimistic UI, showing the user a processing state while AI works in the background.

Semantic Search

Topic search uses PostgreSQL's full-text search (tsvector/tsquery) for keyword matching, supplemented by vector similarity search using embeddings for semantic relevance. This hybrid approach ensures that searching "climate" finds topics about "global warming," "carbon emissions," and "environmental policy" even when those exact terms aren't used.

Performance Engineering

Edge-Rendered OG Images

Every topic, Vigil, and blog post generates dynamic Open Graph images using Next.js's edge runtime. These images are rendered server-side at 1200x630 pixels and include real-time data (vote percentages, participant counts). Edge deployment ensures sub-200ms response times for social platform crawlers worldwide.

As we discussed in our piece on sentiment cards, these OG images are the primary vector for organic social sharing.

Skeleton Loading States

Every data-dependent page in Orbuc uses skeleton loading states — gray placeholder shapes that show the page structure before data arrives. This technique:

• Reduces perceived load time by 40-60%
• Prevents layout shifts (improving Core Web Vitals)
• Provides immediate visual feedback

Micro-Animations

Vote interactions use choreographed micro-animations:

• Bar grow — Sentiment bars animate to their final width
• Vote ripple — A ripple effect confirms the user's selection
• Result reveal — Vote percentages appear with staggered timing
• Confetti — Streak milestones trigger celebration effects

All animations respect prefers-reduced-motion for accessibility.

Security Model

Row Level Security

Every database table has RLS policies that restrict access based on the authenticated user:

• Users can only read their own notifications
• Users can only modify their own votes and comments
• Public data (topics, aggregate votes) is readable by everyone
• Admin operations require elevated privileges

HTTPS and Headers

All traffic runs over HTTPS with security headers:

• X-Frame-Options: DENY (prevents clickjacking)
• Content-Security-Policy (prevents XSS)
• HSTS with 1-year max-age
• Strict referrer policy

Input Validation

Server Actions validate all input server-side, regardless of client-side validation. This prevents malformed data from reaching the database even if the client is compromised.

Mobile-First Architecture

Orbuc is designed mobile-first because civic engagement happens on phones, not desktops. Key mobile optimizations:

• 44px minimum touch targets — All interactive elements meet accessibility guidelines
• Safe area handling — Proper insets for notched devices (iPhone, Android)
• Bottom navigation — Thumb-friendly navigation with active state indicators
• Pull-to-refresh — Native-feeling gesture support
• Offline resilience — Service worker caching for core app shell

Open Infrastructure

Orbuc is building toward an open civic data infrastructure. The structured 4-point sentiment data the platform generates is designed to be accessible:

• Public API (coming soon) — Programmatic access to aggregate sentiment data
• Embeddable widgets — Sentiment visualizations for news sites and blogs
• Research partnerships — Academic access to anonymized, aggregate datasets

The technology choices described in this post were made with this future in mind. PostgreSQL's extensibility, Supabase's built-in API generation, and Next.js's API routes create a foundation that can evolve from a consumer app into civic infrastructure without architectural rewrites.

Building for the Long Term

Civic technology must outlast election cycles, news cycles, and funding cycles. The decisions we made — open-source foundations, mainstream cloud infrastructure, standard protocols — are designed for longevity.

Orbuc is not a proof of concept. It is production infrastructure for democratic participation, built with the same engineering rigor applied to financial systems, healthcare platforms, and other critical services. Because public opinion is critical infrastructure, and it deserves to be treated that way.

Explore the platform we built. Try Orbuc now and see these engineering decisions in action.