CandleMe: Sensor-Driven WebGL Experience

CandleMe: Turning a QR Scan into a Persistent Web Experience

Overview CandleMe is a mobile-first participation platform that turns a familiar physical ritual into an interactive digital experience. A person scans a QR code or opens a direct link and reaches a persistent digital candle in a single redirect, without downloading an app, creating an account, or sharing their identity.

The market problem Most QR campaigns end at a static page, a short-lived promotion, or an onboarding flow with too much friction. Every extra step—installation, registration, email confirmation, or password creation—loses participants. Organizations also need continuity: they want to understand where engagement began, preserve attribution, and give people a reason to return.

Product thinking CandleMe uses a familiar ritual to reduce cognitive load. The experience begins immediately, then becomes something a participant can keep, revisit, and share. This changes the QR code from a disposable link into the entry point for an ongoing relationship.

The product supports venues, events, campuses, wellness programs, hospitality, community networks, and distributed organizations. Participation remains simple and privacy-conscious for the user, while the surrounding platform preserves lineage, attribution, and analytics for the organization.

Frontend solution The core experience is a responsive progressive web application built for mobile browsers. Its candle is rendered with a custom WebGL/GLSL shader and reacts to real device input:

• Microphone input lets a participant blow out the flame • Accelerometer data supports shake interactions • Gyroscope data creates natural tilt behavior • Per-candle manifests and deep links let each saved experience reopen in context

The real-time sensor and shader loops are kept outside React’s reconciliation path, allowing animation state and GPU uniforms to update smoothly without forcing the interface to rerender on every frame. This keeps the interaction responsive on mid-range mobile hardware while the surrounding application manages navigation, persistence, sharing, and account state.

My contribution I contributed to the frontend and full-stack product experience, with particular focus on the interactive WebGL behavior, responsive participation flows, application-state integration, QR and direct-link entry, and connecting the experience to the surrounding production platform.

Platform architecture One application serves two related product surfaces: the CandleMe consumer experience and the IDDAS business platform for distribution, links, activation, and analytics. Host-based routing separates the experiences while the backend manages progressive identity states, referral relationships, candle lifecycle events, and usage-based billing.

Outcome The finished experience moves a participant from scan to a meaningful interaction in one HTTP redirect. It supports a sustained 60 fps flame on mid-range mobile hardware, idempotent scan handling, concurrency-safe lifecycle transitions, persistent deep links, and a path from anonymous participation to a verified relationship when the user chooses.

Technology Next.js • NestJS • PostgreSQL • WebGL • GLSL • Progressive Web App • Stripe • Google Cloud Run

Live product: https://candlemenow.com/ Detailed case study: https://devxelabs.com/case-studies/candleme