Inspiration

We have repeatedly been dropped into large, unfamiliar codebases where orientation takes days or weeks. Industry data shows developers spend significant time reading, searching, and interpreting code rather than writing it, and many teams report long onboarding cycles before new engineers are effective. If we can cut even a slice of that ramp time for interns and new hires, the impact is huge.

We also wanted a better way for learners and non engineers to understand systems at a high level. A visual map with structure, concise explanations, and direct links to source gives people a fast path from overview to evidence.

What it does

Adaptive turns any repository into an interactive 3D stack with three layers by default: Frontend, Backend, and Database. On each push, the model updates the proportions and highlights changes. Clicking a layer opens a file tree with code previews and AI generated explanations for each file, grounded by snippets and metadata. Natural language search over those explanations lets you ask questions like show me where authentication is handled and jump directly to relevant files.

How we built it

Frontend is Next.js with React and React Three Fiber for the 3D scene. The cylinders visualize per layer composition and recent activity. The UI includes a drawer with file trees, snippet previews, and explanation panels.

Backend is Node and Express. A GitHub integration fetches trees and file contents. A rule based multi classifier scores files into layers using paths, language signals, and framework hints. If confidence is low, we call Gemini to classify and to summarize files. Explanations are always returned with file paths and line ranges to keep trust high. We store lightweight indices so updates on push only diff changed files.

Challenges we ran into

Layering a real world repo is not trivial. Monorepos blur boundaries and naive heuristics misclassify. Running a model across every file is slow and expensive. Our solution is a split approach that relies on deterministic signals first and only falls back to Gemini when confidence is below a threshold, which keeps results fast and costs predictable.

Another challenge was making 3D helpful instead of ornamental. We iterated on interaction design so every click shortens the path from question to code. The drawer pairs summaries with source anchors and commit context so explanations are auditable.

Accomplishments that we’re proud of

We shipped a running system with a clean UI and a supportive, low friction experience. The stack view gives newcomers a reliable mental model in minutes. Explanations are concise and grounded, and the search surface lets PMs and reviewers self serve answers without pinging the team.

Also we're really proud of the fact that we did this in ~12 hours, because we pivoted from a completely different idea that we were already working on beforehand in the middle of the hackathon.

What we learned

Most tools and reports focus on speeding up typing, but the real drag is orientation, retrieval, and interpretation. Closing that gap matters more than minor coding speedups. Designing visualizations that reduce cognitive load requires ruthless scoping and evidence backed summaries.

What’s next for Adaptive

  • Add more layers like Deployment and Infra with editable sections.
  • Deep links from files to external IDEs for one click open in context.
  • Richer explanations that include narrated voiceovers and optional video walkthroughs for critical paths.
  • Timeline scrubber to see how the stack changes across releases.
  • Org ready indexing and access control, plus embeddings to power faster semantic search at scale. There are so many more possibilities, and ideas we have regarding directions we can take this in.

Note

Our online demo is currently specific to the following repository (For Now): https://github.com/TaseskiCS/devconnect

Built With

+ 2 more
Share this project:

Updates