The Upside Signal

Riftline is a live link to the Upside Down. Gemini interprets each message’s tone and risk, then paints the wall in a single color—your instant pulse on what’s coming through the crack.

Comment

Inspiration Stranger Things’ “Joyce’s Wall” and the idea that emotion can travel as light. Turning raw text into an immediate, visceral signal using AI and ambient visual feedback. What it does Receives messages from the Upside Down in real time. Sends each message to Google Gemini, which returns: urgency_label: URGENT | MODERATE | LOW light_color: dark_red | red | warm_yellow reason: short rationale The real-world wall instantly updates: LED glow matches the light_color. UI shows the urgency_label and message text. No manual rules; the system fully trusts Gemini’s output. How we built it Frontend: React + Vite + TypeScript. Realtime: Socket.IO with resilient polling/WebSocket fallback. Backend: Node.js + Express + Socket.IO + dotenv. AI: @google/generative-ai with a strict JSON prompt contract. UI: Themed CSS for LEDs, glow, and “behind-the-house” 3D captions. Data: File-backed persistence (houses.json) for quick prototyping. Challenges we ran into WebSocket upgrade failures on some LANs; solved via polling-first transport and reconnection tuning. Enforcing strict JSON-only responses from Gemini; added robust parsing and graceful fallback. Keeping the UI responsive and organized with large PNG assets; tuned grid/card sizing and z-index layering. Avoiding logic drift: ensuring the app doesn’t override Gemini’s judgment. Accomplishments that we’re proud of A clean AI contract where Gemini acts as the sole decision-maker. Real-time, emotionally legible wall that “breathes” with the message tone. Polished visual language: cinematic glow, themed typography, and 3D name treatment. Simple, hackathon-friendly architecture that still feels like a living artifact from Hawkins. What we learned Tight prompt + JSON schema eliminates ambiguity and simplifies the UI. Real-time UX benefits from graceful network fallbacks (polling → WebSocket). Small visual details (glow, gradient text, motion) dramatically increase perceived quality. Logging at event boundaries (init/update/send) speeds up debugging under pressure. What’s next for The Upside Signal Multi-room support: multiple houses/walls with independent streams. Conversation memory: brief context to Gemini for better judgment across messages. Safety and moderation: optional Gemini safety checks and content filters. Observability: dashboards for latency, error rates, and Gemini cost tracking. Accessibility: high-contrast mode, screen reader labels for urgency, keyboard-first interactions. Deployment: one-command dev/prod with HTTPS and environment-based config for keys and origins.

Built With

Share this project:

Updates