Inspiration

Research is messy. Reading one article leads to another question, then another — and suddenly you're lost in 10 tabs. We wanted a way to visualize questions like a map: start with one, and expand it like branches on a tree. That's how the idea of interactive knowledge graphs powered by Perplexity came about.

What it does

The app lets users ask a question and generates a knowledge graph in response. Each node contains:

  • A detailed explanation
  • A brief summary
  • Reasoning for its relevance -Credible sources

Users can then expand any node to go deeper into subtopics — building a graph that grows organically based on curiosity.

How we built it

  • Next.js for frontend/backend logic
  • React Flow to render and manage the interactive graph
  • Supabase for auth and database (PostgreSQL)
  • Perplexity Sonar API to generate structured responses

I used structured prompt engineering to make sure each node consistently returns labeled, accurate, and source-backed content.

Challenges we ran into

Formatting structured API responses: Making sure Sonar returned consistent JSON that matched my node schema. React Flow quirks: Handling edge rendering and position logic while keeping the graph interactive. API limits: We had to limit graph depth and user storage to balance Sonar usage and speed. Graph expansion logic: Designing intuitive UX for expanding and connecting nodes dynamically.

Accomplishments that we're proud of

Built a fully working product in a short time — complete with auth, storage, and AI integration. Made knowledge graphs actually usable — not just pretty, but interactive and informative. Carefully engineered prompts to produce high-quality, structured AI outputs that feel natural to explore.

What's next for nodal

  • Graph sharing: Let users publish or share their graphs with others.
  • Better layouts: Smarter automatic node positioning for complex trees.
  • Question suggestions: Use AI to suggest follow-ups or unexplored angles.

Built With

Share this project:

Updates