Braen

Inspiration

Braen came from a simple problem: notes are easy to capture, but hard to navigate once you have a lot of them. Most tools treat notes like isolated documents in folders, but that is not how people actually think. Ideas connect, reinforce each other, and form patterns over time.

We wanted to build something that makes knowledge feel alive. Instead of just storing notes, Braen turns them into a connected system you can explore visually, inspect through relationships, and question through chat. The inspiration was to make a tool that feels less like file storage and more like an external brain.

What it does

Braen lets users upload or create notes, extract concepts from them, and organize those concepts into a graph. In the graph view, users can explore how ideas relate, inspect relationships between concepts, and dive into supporting documents.

It also includes chat, so users can ask questions about their knowledge base instead of just searching manually. On top of that, users can open, edit, and save notes directly in the interface, making the system both a writing tool and a discovery tool.

How we built it

We built Braen as a full-stack app with a React frontend and a Python backend.

The frontend handles the graph view, chat panel, file explorer, and note editor. A lot of work went into making the graph feel smooth and interactive, including node focus animations, relationship detail panels, zoom controls, mesh controls, and document drill-down behavior.

The backend handles document ingestion, note storage, graph retrieval, and query orchestration. Notes and document data are stored so they can be reopened and edited, while graph relationships are exposed through API endpoints that feed the frontend. We also added provenance into the query flow so chat responses can point back to supporting documents and relationships.

Challenges we ran into

One of the biggest challenges was keeping the frontend and backend in sync. It is easy for a UI to show graph edges or note states that the backend has not fully processed yet, and that leads to broken details, stale views, or confusing errors. We had to tighten those flows so the frontend treated backend data as the source of truth.

Another challenge was interaction quality. Small UX issues mattered a lot more than we expected. Things like scroll leaking into the graph behind a panel, note save status flickering too often, or graph camera motion feeling slightly off made the app feel unfinished even when the core functionality worked.

We also ran into tradeoffs between fast note saving and full graph ingestion. Saving a note instantly is important for usability, but that does not automatically mean the note is immediately integrated into the brain. We had to separate those flows more clearly and think carefully about what the user expects from each action.

Accomplishments that we're proud of

We are proud that Braen is not just a concept demo. It supports real note creation, document persistence, graph exploration, relationship inspection, and chat-based querying in one connected product.

We are also proud of the polish we added to the experience. A lot of effort went into making the graph interactions feel intentional, improving scroll behavior, making note workflows cleaner, and surfacing provenance so AI responses feel grounded instead of opaque.

Most importantly, we built something that gives notes a stronger sense of structure. Instead of a static list of documents, the user can actually move through knowledge and see how ideas relate.

What we learned

We learned that building a knowledge tool is as much a UX problem as it is a technical one. The graph, the notes, and the chat all need to feel like parts of the same system. If any one part behaves awkwardly, the entire product feels weaker.

We also learned that AI features need transparency. It is not enough to give a response; users need to understand where it came from and why it should be trusted.

From an engineering perspective, we learned the value of keeping responsibilities separate. Clear boundaries between note editing, graph retrieval, chat state, and backend persistence made the codebase easier to improve and debug.

What's next for Braen

The next step for Braen is making the connection between note-taking and graph intelligence even tighter. Right now, saving a note and integrating it into the brain are still separate ideas, and we want that flow to become more seamless.

We also want to improve the intelligence layer by making chat responses more reliable, more explainable, and more personalized to the user’s actual knowledge base. Beyond that, we see a lot of room to make the graph more expressive, with better clustering, stronger discovery tools, and richer ways to move from one idea to the next.

The long-term goal is simple: make Braen feel like a true thinking companion, not just a place where notes are stored.