Inspiration
I built an interactive AI debate where two personas — Millennial and Gen Z — fall into a 3D scene and debate a user topic using AI-generated dialogue, voice, subtitles, and expressive gestures. Personality emerges through posture, motion, and pacing, making the debate feel like a watchable scene rather than a chat.
What it does
AI DEBATERS is an interactive experience where two AI personas debate a user-chosen topic in a shared 3D scene. After the user enters a topic, two characters fall into place, sit across a table, and begin debating using AI-generated dialogue.
Each debater has a distinct personality (Millennial vs Gen Z) expressed through:
different speaking styles and pacing text-to-speech voices physical gestures and reactions animated subtitles synced with speech
Instead of a chat interface, the debate unfolds like a small performance you can watch.
How we built it
We built the project using a lightweight, framework-free stack:
Frontend: HTML, CSS, and vanilla JavaScript 3D & animation: Three.js for the scene and GSAP for character motion AI backend: Peplexity AI Voice: Browser-based text-to-speech using Puter Architecture: Static frontend + serverless backend
The characters are intentionally simple, but their posture, timing, and motion are carefully animated to convey personality and emotion. Voice, subtitles, and gestures are orchestrated together so each line of dialogue feels intentional.
Challenges we ran into
Synchronizing voice, subtitles, and animation so they feel cohesive Making characters expressive without complex models Handling browser audio restrictions for text-to-speech Prompting the AI to return clean, structured debate output consistently A big challenge was finding the balance between simplicity and expressiveness.
Accomplishments that we're proud of
Turning a debate into a visual, embodied experience, not just text Making two AI personas feel distinct using the same underlying model Successfully combining AI, voice, animation, and interaction in a small MVP Keeping the project lightweight, fast, and demo-ready We’re especially proud that the debate feels “watchable,” not just readable.
What's next for AI DEBATERS
:)Stronger character customization and personas :)Improved gestures and emotional reactions :)Educational and entertainment use cases
Built With
- css
- gsap
- html
- javascript
- puter
- three.js
- vanilla
Log in or sign up for Devpost to join the conversation.