ProjectsProject Detail
ZN AI (Zunayra)
Public voice Q&A about Zohaib Nawaz on ai.zohaibnawaz.dev—Gemini Live in the browser with server-minted ephemeral tokens and Z-dark noir styling.
The Brief
Talk to the portfolio—not another generic chatbot.
ZN AI (product name Zunayra) gives visitors a microphone-first path to skills, experience, and contact facts—grounded in the same read-only memories as the main brand site.
Gemini API keys never ship to the client. /api/live-token mints short-lived Live constraints; the browser streams audio directly to Google after mint succeeds.
Technical Architecture
Gemini Live
Browser WebSocket session after ephemeral authTokens.create with liveConnectConstraints.
Vite + React
Voice controls, caption stage, GSAP/Motion visualizer, PWA shell—styled to Z-dark tokens.
Token mint + quotas
Vercel /api/live-token with per-IP rate limits; dev Express server shares quota defaults.
Noir brand, phone-call pacing
Suggested questions, synced captions, and a focused voice header—no agent settings, screen share, or memory editor in this product cut.
Deploy
Vercel · ai.zohaibnawaz.dev
Scope
Voice Q&A · Read-only facts
Role
Full Stack Product Engineer
Client
Personal brand / voice companion
Date
2026
Collaborators
Solo build
Next Project