DEV Community: Risbern Fernandes

Election Educaiton and Assistant app

Risbern Fernandes — Mon, 27 Apr 2026 03:03:28 +0000

Building ElectAssist: Revolutionizing Democracy with AI-Driven Election Intelligence

In an era of information overload and increasing election complexity, how can we empower citizens to make informed decisions? Enter ElectAssist—an interactive, AI-powered election intelligence platform designed to bridge the gap between candidates and voters.

In this post, we’ll dive deep into the technical architecture of ElectAssist, exploring how it leverages the latest in Google Cloud’s AI ecosystem to provide real-time, verified insights to the public.

The Vision: Informed Citizenship through AI

ElectAssist was born from a simple idea: Voting shouldn't be guesswork. We wanted to build a platform that doesn't just list candidates but provides a context-rich, AI-moderated view of their work, promises, and the election process itself.

Key goals included:

Demystifying the process: A step-by-step guide to voting.
Verifying work: A community-driven "proof of work" system for candidates.
Accessibility: A natural language interface to ask complex election questions.

The Stack

To build a platform that is both responsive and scalable, we chose a robust modern stack:

Frontend: A sleek, high-performance UI built with React and Vite. We used Vanilla CSS for a premium, custom feel and Lucide Icons for a clean aesthetic.
Backend: A lightning-fast FastAPI server running on Google Cloud Run, providing the muscle for our AI integrations.
Intelligence: Powered by Gemini 2.5 Flash via Vertex AI, enabling sophisticated RAG (Retrieval-Augmented Generation) and document summarization.
Real-time Data: Firebase Firestore for candidate profiles and leaderboard scores, with Firebase Auth handling secure user identities.

Deep Dive: AI Features

The heart of ElectAssist lies in its intelligent capabilities. We implemented three core AI-driven features:

1. The RAG-Powered Chatbot

Instead of a static FAQ, ElectAssist features a conversational agent. Using Vertex AI, we built a RAG pipeline that fetches live data from Firestore—candidate platforms, party manifestos, and locality info—and feeds it to Gemini.

This ensures that when a user asks, "Who is working on road infrastructure in my ward?", the AI provides a grounded, data-backed response rather than general hallucination.

2. Community Video Proofs & AI Moderation

One of our most innovative features is the Candidate Leaderboard. Citizens can upload short videos as "proof" of a candidate's work (e.g., a new school opening).
To maintain quality and safety:

Video Intelligence API automatically tags content and moderates for inappropriate material.
Gemini generates a text summary of the video, which is then indexed for semantic search.
Verified proofs contribute to the candidate's dynamic "Trust Score."

3. Manifesto Summarizer

Political manifestos are notoriously long and complex. We built a service that uses Gemini to ingest these documents and output neutral, bullet-point summaries. This makes policy positions accessible to the general public in seconds.

Locality-Based Insights

We integrated the Google Maps Embed API to provide a geographical context to the election. Users can:

Visualize candidates per ward/constituency.
Locate their nearest polling booths.
See real-time leaderboard rankings based on their specific locality.

Scalable Infrastructure

Deploying such a feature-rich application required a reliable infrastructure. By using Cloud Run, we ensure our backend scales automatically with traffic during peak election periods. Firebase Cloud Messaging (FCM) keeps users engaged with timely notifications about election dates and leaderboard updates, triggered by Cloud Scheduler.

Security & Integrity

In a political context, data integrity is paramount. We implemented:

Role-Based Access Control (RBAC): Only verified admins can manage candidate profiles.
Firestore Security Rules: Ensuring that user endorsements (likes) are unique and protected.
Rate Limiting: Preventing gaming of the leaderboard system.

The Future of ElectAssist

ElectAssist is just the beginning. Our roadmap includes:

Multilingual Support: Real-time translation of candidate data into regional languages using Gemini's multimodal capabilities.
Poll Sentiment Dashboards: Aggregating public sentiment from verified community contributions.
Voter ID Integration: Streamlining the registration check process through official APIs.

By combining community involvement with cutting-edge AI, ElectAssist is setting a new standard for how technology can support and strengthen the democratic process.

Interested in the technical implementation? Check out the project on GitHub and stay tuned for more updates on how we're building the future of civic tech.

Stadium Sync

Risbern Fernandes — Sun, 19 Apr 2026 16:14:02 +0000

Building StadiumSync: Transforming the Live Stadium Experience with React and Firebase

In the roar of a 50,000-seat stadium, information is often the one thing that doesn't travel fast enough. Whether it's finding the nearest pizza stall, knowing when it's your turn to leave the stand, or coordinating a massive stadium-wide chant, the gap between organizers and fans has traditionally been filled by static signs and overtaxed PA systems.

Enter StadiumSync—a real-time experience platform built to bridge that gap. In this post, I’ll dive into how I built this platform using React, Firebase, and Glassmorphism design to bring the stadium experience into the digital age.

The Vision: Orchestrating the Chaos

Large-scale events are logistical puzzles. The goal for StadiumSync was simple: create a two-sided platform that empowers coordinators to manage the event flow in real-time, while giving attendees a seamless, "no-installation-required" web experience.

Key Pillars:

Real-time Coordination: Broadcast exit instructions and chants instantly.
Interactive Content: Digital menus and venue maps at your fingertips.
Feedback Loop: Instant crowd sentiment collection for organizers.

The Tech Stack

To ensure speed and reliability, I chose a modern, lightweight stack:

Frontend: Vite + React for a lightning-fast Single Page Application (SPA).
Real-time Database: Firebase Firestore for instant data synchronization across thousands of devices.
Cloud Storage: Firebase Storage for high-res venue maps and stall images.
Styling: Vanilla CSS with a heavy focus on Glassmorphism. No heavy UI libraries—just lean, high-performance CSS.

Technical Deep Dive

1. Real-time Sync with `onSnapshot`

The "magic" of StadiumSync comes from Firestore's onSnapshot. We didn't want attendees refreshing the page for updates. When a coordinator changes the "Exit Guide" message, it pulses on every attendee's phone within milliseconds.

// A snippet of how real-time updates are handled in AttendeeView.jsx
useEffect(() => {
  const unsubscribe = onSnapshot(doc(db, "config", "egressMessage"), (doc) => {
    if (doc.exists()) {
      setEgressData(doc.data());
    }
  });
  return () => unsubscribe(); // Clean up listener on unmount
}, []);

2. The "Event Code" Gate

Security doesn't always need to be complex. Since we wanted anyone in the stadium to join without creating an account, we implemented a Code Gate.

Coordinators generate a unique session code.
Attendees enter the code to unlock the event data.
The session is persisted in sessionStorage, keeping the experience friction-free.

3. Glassmorphism & Mobile-First Design

Stadiums are high-energy, dark environments. The UI follows a "Dark Mode" aesthetic with semi-transparent, frosted-glass layers (Glassmorphism). This ensures high legibility and a premium feel while the crowd is under the stadium lights.

We used 100dvh (Dynamic Viewport Height) to ensure the UI fits perfectly on mobile screens, avoiding the "jumping" effect caused by mobile browser URL bars.

Key Features Highlights

Dynamic Chant Broadcaster

Ever wanted to lead a 10,000-person chant? Coordinators can push "Active Chants" to everyone's screen. A "Join" button helps fans stay in sync with the rhythm of the game.

🍔 Digital Stall Menus

No more squinting at distant posters. Attendees can browse all food stalls, view high-res item images, and check prices directly from their seats.

Smart Exit Logic

Post-match congestion is a safety risk. Our real-time Egress Guide allows coordinators to broadcast "Wait" or "Go" instructions stand-by-stand, ensuring a smooth and safe exit for everyone.

Challenges & Lessons

Building for a "Smart Stadium" context reminded me that connectivity is king. By keeping the asset sizes small and relying on Firebase's efficient synchronization, we built a tool that works even on spotty stadium Wi-Fi.

Vanilla CSS was a deliberate choice. It allowed for fine-tuned animations (like the pulsing exit alert) without the overhead of a CSS-in-JS library, keeping the Lighthouse scores high and the "Time to Interactive" low.

Final Thoughts

StadiumSync isn't just a dashboard; it's a bridge between the physical and digital world of live sports. By leveraging real-time cloud tech, we can turn a stressful match-day experience into a seamless, interactive journey.

Built for the Virtual PromptWars Challenge #1 - Physical Event Experience

Check out the project on GitHub: [https://github.com/Risbern21/StadiumSync.git]
Built by: Antigravity AI