ARACHNID

Weave mindmaps with nothing but your voice.

Comment

Arachnid: Voice‑Powered Mind Mapping

Overview Arachnid is a real‑time, voice‑driven mind‑mapping tool. It captures spoken ideas, converts them into structured notes, and displays them on a collaborative canvas.

Key Features

  • Live Speech Recognition: Continuous voice capture with smart pause detection.
  • AI‑Driven Note Conversion: Transforms transcribed speech into problem and solution nodes via OpenAI GPT.
  • Interactive Canvas: Infinite, zoomable workspace; drag, resize, and auto‑position notes.
  • Real‑Time Collaboration: Updates broadcast instantly via WebSockets.
  • Persistent Storage: GitHub OAuth for secure sign‑in; PostgreSQL (Drizzle ORM) retains canvases and speech logs.

Inspiration

When brainstorming project ideas on the train, we realized that ideation isn't linear. You're always looping back to previous ideas, rehashing and updating, and working dynamically. Traditional note taking apps can't exactly replicate this, so we built something that could.

What We Learned

  • Integrating live speech recognition in the browser.
  • Applying GPT models to classify and merge notes.
  • Managing real‑time state with WebSockets and Next.js Server Actions.
  • Designing a scalable canvas UI for smooth zoom and pan.

How We Built It

  • Frontend: Next.js 15, TypeScript, Tailwind CSS, Shadcn/ui, React Zoom Pan Pinch, React Speech Recognition.
  • Backend: Next.js App Router with Server Actions, Better Auth for GitHub OAuth, Drizzle ORM on PostgreSQL (Docker Compose).
  • AI & Voice: Web Speech API for transcription; OpenAI GPT for converting speech to structured notes.
  • Collaboration: Standalone WebSocket server broadcasting canvas changes on port 8080.

Challenges

  • Latency: Balancing continuous listening with performance on lower‑power devices.
  • Note Merging: Designing reliable heuristics to update existing notes without duplication.
  • Canvas Scaling: Ensuring smooth interactions on a large virtual area (10 000×10 000 px).
  • Auth & Persistence: Securing real‑time edits while maintaining session state across reconnects.

Feel free to explore the project README for setup instructions and full architecture details.

Built With

Share this project:

Updates