Inspiration
Our inspiration stems directly from Track 3: "Building Tooling for the AI Workforce of the Future." While Large Language Models (LLMs) have revolutionized how we access information, the interfaces we use to interact with them remain fundamentally outdated.
We identified a critical problem we call "Context Collapse." Thinking is inherently non-linear—we explore tangents, question definitions, and synthesize disparate sources. However, current AI tools like ChatGPT are strictly linear. When you pursue a tangent, you either muddy the main conversation or start a new chat, immediately losing the context of the previous one. This constant switching fractures focus and makes deep research incredibly inefficient.
We were inspired to create an AI-native tool that truly augments human cognition rather than replacing it. We wanted to move beyond passive consumption and build a system that allows knowledge workers to explore complex topics the way the human brain naturally works: spatially and non-linearly.
What it does
Dive is a cognitive augmentation tool that transforms how knowledge workers research, learn, and synthesize information. It combines a spatial canvas with AI-powered branching conversations, allowing users to "dive deep" into concepts without losing their place.
Key features include:
- The Spatial Canvas: Dive provides an infinite canvas where users visualize the structure of their research. Documents, concepts, and conversations are laid out visually, maintaining spatial awareness.
- Concept Anchoring: Users can highlight any text within a document (PDF or URL) or even a previous chat message to create a "Concept." This anchors the subsequent conversation to a specific source, ensuring provenance and accuracy.
- ChatTrees (Branching Conversations): This is our core innovation. Users can "fork" any AI response to explore a tangent or ask a follow-up question. The system automatically manages context, inheriting the upstream conversation while keeping the new inquiry separate. This allows for parallel lines of thought.
- Context Management: Dive provides transparency into the AI's thought process. The "Context Inspector" allows users to see exactly which messages and sources are being included in the prompt sent to the LLM.
Dive transforms the research process from a frustrating exercise in tab management into a structured, visual exploration of knowledge.
How we built it
We built Dive over 72 hours using a modern, high-velocity tech stack focused on real-time performance and scalability.
- Frontend: We used Next.js 15 (App Router) and React 19 with TypeScript. This provided a robust foundation and excellent developer experience.
- Visualization: The core canvas experience is powered by ReactFlow. We implemented complex logic to translate the branching data structure into a visual graph, utilizing the dagre algorithm for automatic layout.
- UI/Styling: We used Tailwind CSS and shadcn/ui for a clean, responsive, and accessible design.
- Backend & Database: We utilized Convex, a real-time backend platform. This was crucial for managing the complex, tree-structured data of the chats and concepts and ensuring the UI updates instantly.
- Authentication: Implemented using NextAuth.js.
- LLM Integration: We built a custom adapter system to stream responses from LLMs (like OpenAI's GPT-4o) using server-sent events (SSE), ensuring a fluid conversational experience.
The architecture is entirely serverless (Vercel and Convex), making it highly scalable from day one.
Challenges we ran into
The development of Dive presented several significant challenges, primarily around designing a novel interaction paradigm and managing the underlying data complexity.
- Defining the Interaction Rules: The most significant challenge was conceptual. How should branching work intuitively? We spent significant time on Day 1 debating the visualization and the rules for creating concepts versus continuing chats. We iterated rapidly, moving from a complex node-based system to the elegant ChatTree structure that ensures every concept leads to an actionable chat.
- Context Inheritance Management: Ensuring that a new branch inherits the correct upstream context (its parent and ancestors) while excluding its siblings was a complex data modeling challenge. We had to design an efficient schema in Convex to trace the lineage of every message accurately.
- Visualizing Complexity (ReactFlow): Integrating the real-time data from Convex with the visualization layer of ReactFlow, while maintaining performance and implementing features like auto-layout and collapse/expand, required careful state management and optimization.
Accomplishments that we're proud of
We are incredibly proud of the execution speed and the innovation we delivered in just 72 hours.
- A Fully Functional MVP: We successfully built a robust, interactive web application with authentication, a real-time database, complex visualization, and LLM integration. This demonstrates our team's technical capability and velocity.
- The ChatTree Innovation: We believe the ChatTree interface is a genuinely new and superior way to interact with AI for deep work. The positive feedback from our pilot testing validated this approach, with users reporting significant efficiency gains.
- Rapid Iteration and Learning: When we observed during testing that users were unsure about the context the AI was using, we rapidly prioritized and implemented the "Context Inspector" feature within hours. This demonstrates our ability to learn quickly and adapt.
- Architectural Soundness: We didn't just hack something together; we built a scalable application using best-in-class technologies (Next.js 15, Convex, TypeScript).
What we learned
This hackathon provided deep insights into human-AI interaction and the future of productivity tools.
- The Interface is the Bottleneck: Our key learning is that the power of current LLMs is often limited not by the model's intelligence, but by the interface used to interact with it. Designing better interaction paradigms (like ChatTrees) unlocks capabilities that generalized AI interfaces cannot match.
- The Need for Active Augmentation: We learned that users gain deeper understanding when they actively direct the research process. Tools that promote active engagement are far more effective for cognitive augmentation than passive summarization tools.
- Transparency Builds Trust: In the AI workforce, trust is paramount. Features like the Context Inspector and Concept Anchoring are not just nice-to-haves; they are essential for professional adoption.
What's next for Dive
Dive is more than a hackathon project; it's the first step in our mission to build "Thinking Technologies" that upgrade human cognition.
Immediate Roadmap (Next 3 Months):
- Chrome Extension: The essential next step is launching the Dive Chrome extension, allowing users to instantly capture concepts and start Dives from any webpage or online PDF, seamlessly integrating Dive into their existing workflows.
- Collaborative Features: Implementing real-time collaboration on the Dive canvas, allowing teams to research and synthesize information together.
- Enhanced Attachments and Export: Expanding support for different file types and improving the Markdown/JSON export features for better integration with existing knowledge bases.
Long-Term Vision: We aim to expand Dive into a comprehensive suite of cognitive tools—a "Cognition OS"—dedicated to enhancing how humans think, learn, and make decisions in the age of AI.
Built With
- convex
- nextjs
- openai
- react
Log in or sign up for Devpost to join the conversation.