Cognitive Nexus - Your Visual Second Brain 🧠

Inspiration πŸ’‘

Have you ever felt overwhelmed by the amount of information scattered across your notes? Ideas, research, code snippets, and random thoughts living in isolation, never connecting the dots? That's exactly what inspired Cognitive Nexus.

We wanted to build a system that doesn't just store your knowledgeβ€”it visualizes how your ideas relate to each other, like neurons in a brain. Imagine seeing your thoughts form clusters, discovering connections you never noticed, and having AI-powered conversations with your own accumulated wisdom.

The vision: A living, breathing representation of your mind that grows smarter as you do.

What it does ✨

Cognitive Nexus transforms your Notion workspace into an interactive 3D knowledge graph where:

  • πŸ“„ Auto-syncs your Notion pages - Captures all your notes, including nested pages recursively
  • 🌐 Visualizes connections - Displays your knowledge as a beautiful 3D neural network with black nodes on white background
  • πŸ” Semantic search - Finds ideas by meaning, not just keywords (using vector embeddings)
  • πŸ’¬ Chat with your brain - Ask questions and get answers citing exactly which note contains the information
  • 🎨 AI content generation - Generate research summaries, visualizations, audio summaries, and videos from any node
  • πŸ•ΈοΈ Smart connections - Automatically links related ideas using similarity algorithms

How we built it πŸ› οΈ

Tech Stack

Frontend:

  • Next.js 14 (App Router)
  • React + TypeScript
  • react-force-graph-3d + Three.js for 3D visualization
  • shadcn/ui for premium components
  • Tailwind CSS for styling

Backend & Services:

  • Supabase (PostgreSQL) - Stores chunks and outbox queue
  • Elasticsearch Serverless - Vector search with kNN + BM25 hybrid
  • Google Gemini AI - Embeddings (text-embedding-004) and generation (gemini-2.0-flash-exp)
  • Notion API - Content synchronization

Key Features Implementation:

  1. Recursive Notion Sync - Built a custom endpoint that traverses page hierarchies, extracts markdown, and chunks content intelligently with overlap for context preservation

  2. Hybrid Search - Implemented RRF (Reciprocal Rank Fusion) combining BM25 keyword search with kNN semantic search for best-in-class retrieval

  3. Semantic Graph Connections - Nodes connect by:

    • Same-page chunks (structural)
    • Shared tags (categorical)
    • Cosine similarity > 0.6 threshold (semantic)
  4. Real-time 3D Physics - Integrated force-directed graph with custom materials, lighting removal for pure black nodes, and physics tuning for smooth movement

Challenges we ran into πŸ”₯

1. Elasticsearch Serverless Mystery

We spent hours looking for the "Cloud ID" in Elastic Cloud dashboard. Turns out Serverless doesn't use Cloud IDs - it uses direct URL endpoints! Documentation from 2024 was outdated. Had to search 2025 docs to discover the difference between Hosted vs Serverless deployments.

2. API Migration Hell

Google deprecated @google/generative-ai SDK in favor of @google/genai. The API completely changed:

  • getGenerativeModel() β†’ Direct model access
  • embedContent() parameters changed from content to contents
  • Response structure changed from .values to .embeddings[0].values

Had to rewrite all embedding and generation logic mid-hackathon!

3. 3D Graph Rendering Nightmares

  • Nodes appeared yellow instead of black - discovered MeshStandardMaterial was affected by default scene lighting
  • Solution: Used MeshBasicMaterial and removed ALL scene lights
  • SSR errors with react-force-graph-3d - fixed with dynamic import and ssr: false
  • Rotation animation caused "shaking" - removed rotation, tuned physics parameters instead

4. Duplicate Nodes & Self-loops

The graph API was generating duplicate nodes and edges connecting to themselves! Had to implement:

  • Map-based deduplication for nodes
  • Set-based deduplication for edges
  • Validation to prevent self-loops (if (source !== target))
  • Minimum chunk requirements (only connect pages with 2+ chunks)

5. Secret Leakage

GitHub blocked our push because graph.txt contained AWS credentials from a synced Notion page! Had to:

  • Remove the file
  • Rewrite git history with filter-branch
  • Force push cleaned history
  • Learn the hard way: NEVER commit secrets πŸ˜…

What we learned πŸŽ“

Technical Deep Dives:

  • Vector databases aren't just for AI - Elasticsearch's hybrid search (BM25 + kNN) is insanely powerful for semantic retrieval
  • Embeddings reveal hidden connections - Cosine similarity between 768-dimensional vectors actually works to find related ideas
  • 3D physics for data viz - Force-directed graphs with proper physics parameters create organic, brain-like structures
  • Notion API quirks - Parsing nested blocks requires recursive traversal and careful handling of block types

Architecture Lessons:

  • Outbox pattern saves lives - Decoupling sync from indexing via Supabase outbox queue prevents data loss
  • Chunking strategy matters - 800 tokens with 12% overlap preserves context across semantic boundaries
  • Progressive enhancement - Built features incrementally: sync β†’ index β†’ search β†’ graph β†’ AI generation

Soft Skills:

  • Read the fing docs (RTFM)* - When stuck, search for the LATEST documentation (2025, not 2024!)
  • Debug systematically - Git history, logs, API responses - follow the data trail
  • Embrace breaking changes - Sometimes you just have to refactor everything (looking at you, Google AI SDK)

What's next for Cognitive Nexus πŸš€

  • Real-time collaboration - Multiple users exploring the same knowledge graph simultaneously
  • Voice interface - Already have voice control stub - make it fully functional
  • Temporal view - See how your knowledge graph evolved over time (time-series visualization)
  • Graph algorithms - PageRank for important nodes, community detection for topic clusters
  • Mobile app - AR visualization of your knowledge graph in physical space
  • Export to Obsidian - Bidirectional sync with other PKM tools
  • Custom embeddings - Fine-tune models on your personal writing style

Cognitive Nexus isn't just a toolβ€”it's a mirror for your mind. A place where ideas connect, insights emerge, and knowledge becomes alive. 🧠✨

Tools & Technologies Used πŸ› οΈ

Frontend Framework & UI:

  • Next.js 14 (App Router)
  • React 18
  • TypeScript
  • Tailwind CSS v4
  • shadcn/ui (Radix UI components)
  • Phosphor Icons

3D Visualization:

  • react-force-graph-3d
  • Three.js
  • WebGL

Backend & Database:

  • Supabase (PostgreSQL with pgVector)
  • Elasticsearch Serverless
  • Node.js runtime

AI & Machine Learning:

  • Google Gemini AI
    • text-embedding-004 (for embeddings)
    • gemini-2.0-flash-exp (for generation)
  • @google/genai SDK

APIs & Integrations:

  • Notion API (@notionhq/client)
  • Elasticsearch Client (@elastic/elasticsearch)
  • Supabase JS Client

Search & Retrieval:

  • Vector similarity search (kNN with HNSW)
  • BM25 keyword search
  • RRF (Reciprocal Rank Fusion) algorithm

Development Tools:

  • Git & GitHub
  • npm package manager
  • Turbopack (Next.js dev server)

Additional Libraries:

  • Markdown rendering (react-markdown, remark-gfm)
  • nanoid (ID generation)
  • zod (schema validation)

Powered by:

  • ⚑ Deployed on Vercel
  • πŸ—„οΈ Powered by Supabase
  • πŸ” Indexed by Elasticsearch
  • πŸ€– Intelligence by Google Gemini
  • πŸ“ Connected to Notion

Built With

Share this project:

Updates