Virtual AI Character with Live TikTok Interaction
Overview
A virtual AI character web app that drives an interactive on-screen character, with real-time sessions and a live TikTok feed integration so audience activity can feed the experience. Built on React and Firebase.
Why It Exists
The concept explores audience-driven virtual characters: an AI persona that reacts in real time, fed by live social-stream signals. This repo is the working app that brings that interaction loop together.
What We Built
A React 18 app with Firebase (auth, hosting, cloud functions) and Socket.IO for real-time messaging. Notable modules include a tiktokFeed integration (connection.js) wiring in a live TikTok stream, session pages (CreateSession, Session), an auth context with public/private route guards, and a chat-scroll UX. The functions/ directory holds Firebase Cloud Functions (firebase-admin), and the front-end pulls in @webcontainer/api for in-browser runtime iterative development. Roughly a year of active development.
Technologies & Approach
React + react-router-dom on the front-end; Firebase for auth, hosting, and serverless functions; Socket.IO for real-time session messaging; axios for HTTP; WebContainer for in-browser execution. The interesting integration is connecting a live TikTok feed into a real-time character session.
Outcome / Impact
Delivered a working virtual-character experience tying real-time sessions to a live social feed, proving out the interaction model for audience-driven AI personas.
Capabilities Demonstrated
- Building real-time, session-based web experiences with Socket.IO and Firebase
- Integrating live social-stream (TikTok) data into an interactive app
- Firebase auth, hosting, and Cloud Functions end to end
- Front-end engineering for AI-character / avatar interaction