EchoChamber

• 

  Hero Landing Page — "Find the Truth. Sharpen Your Mind." A sleek entry into the voice-first arena.

• 

  Debate Setup & Topic Selection — Pick or type a topic and configure your environment before launching.

• 

  Custom AI Opponents — Choose between Socratic Mentor, Aggressive Counter-Debater, Fact-Checker, or Logical Formalist.

• 

  Voice-First Socratic Sparring — Speak your thoughts live and receive intelligent counter-arguments in real time.

• 

  Turn-by-Turn Argument Breakdown — Real-time scoring across logical consistency, evidence, rebuttal effectiveness, and tone.

• 

  Debate Victory & Dominance Metrics — Detailed session wrap-up highlighting strong arguments and win rates.

Inspiration

We often express our thoughts most naturally when speaking out loud, yet turning raw spoken ideas into cohesive, logical arguments can be a challenge. We wanted to build an environment where users could talk freely, review their exact words in real time, and immediately refine their points without losing momentum.

EchoChamber was created to bridge the gap between spontaneous speech and structured reasoning. By combining real-time transcription with live "steelmanning" (refining an argument into its strongest possible form), EchoChamber acts as an intelligent sounding board for debate, essay writing, and everyday brainstorming.

What it does

EchoChamber is an interactive, voice-first AI workspace designed to elevate the way people brainstorm, debate, and structure arguments:

Real-Time Voice Transcription: As you speak, your words are streamed instantly into an auto-scrolling, expandable input field so you can see your exact thoughts materialized live on screen.

Instant Steelmanning: With a single click, the app takes your raw, unedited spoken input, identifies its core reasoning, and transforms it into its strongest, most logically sound version (a "steelman").

Seamless Audio Feedback: Provides stable speech synthesis without voice glitches or pitch shifts, letting you listen back to your refined points effortlessly.

Full Argument Review & Editing: Allows users to review, adjust, and edit their text before submitting, making it an ideal tool for speech preparation, essay drafting, and critical thinking.

How we built it

EchoChamber is built on a modern, high-performance web stack designed for real-time responsiveness:

Frontend: Built with React, Vite, and Tailwind CSS for a fast, responsive UI.

Real-Time Voice Processing: Utilizes the browser's Web Speech API (SpeechRecognition) with streaming enabled (interimResults = true), piping live transcription directly into an auto-scrolling, expandable text area.

Backend & Real-Time Sync: Powered by Convex for seamless database state management and backend serverless logic.

Authentication & Storage: Handled via Supabase.

AI & Steelmanning Engine: Integrated with Groq SDK and LLM APIs to quickly parse transcribed text, detect key arguments, and produce steelmanned versions on demand.

Analytics & Deployment: Deployed globally on Vercel with integrated Vercel Analytics to track app performance.

Challenges we ran into

Handling Real-Time Audio & Text State: Managing live audio streaming while allowing users to dynamically edit, expand, and scroll through text in real time required careful state management to avoid audio glitches or UI lag.

Audio Voice Synthesis Consistency: Mid-speech voice switching across different audio chunks in Web Speech APIs proved tricky. We solved this by binding specific voice instances and playback rates directly to every utterance object in the queue

Accomplishments that we're proud of

Zero-Latency Live Streaming: Successfully streaming live transcription directly into the DOM using Web Speech API without causing lag or UI jitter while typing or scrolling.

Solving Speech Engine Glitches: Diagnosing and fixing browser voice resets mid-sentence by locking exact system voice instances and playback rates to every queued speech utterance.

Smooth Full-Stack Integration: Creating a cohesive workflow that connects a real-time reactive database (Convex), fast serverless auth (Supabase), low-latency LLM processing (Groq), and continuous deployment (Vercel).

True Voice-to-Logic Pipeline: Building a tool that doesn't just transcribe audio, but actively helps users sharpen their thinking and express complex ideas clearly.

What we learned

Streaming Web APIs: Gained deep experience working with continuous Web Speech recognition and Web Audio API events.

Full-Stack Serverless Architecture: Learned how to seamlessly connect real-time reactive databases like Convex alongside external LLM inferencing pipelines.

Logic Refinement: Discovered how useful steelmanning algorithms are at helping users identify weak points in their arguments before hitting submit.

What's next for EchoChamber

Adding multi-speaker detection so two people can debate in real time while the AI steelmans both sides.

Expanding export tools to generate structured essays, debate briefs, or outlines directly from voice sessions.

Built With

• api
• axios
• convex
• css
• framer
• groq
• lucide
• motion
• node.js
• radix
• react
• recharts
• router
• speech
• supabase
• tailwind
• typescript
• ui
• vercel
• vite
• web
• zod