-
-
Our Figma process for the UI
-
Orby (chat bot) in action
-
Questions from OrbitAI
-
OrbitAI in action
Inspiration
Our main inspiration for this project stems from how easily students these days lose focus when watching a boring lesson video on Youtube. They tend to waste time trying to switch tabs to AI tools like ChatGPT or Gemini to answer any doubts that might occur from watching the video. We wanted to create a tool that turns passive video watching into an active learning experience where users can actually absorb the knowledge they need from the video.
What it does
OrbitAI is a Chrome extension that transforms YouTube videos into interactive study sessions. Users select a focus level and question frequency before starting a session. While learning, they can ask questions about the video, receive AI-generated explanations, and review a personalized summary of what they learned. In addition, if users are stuck on a concept/question, they can also follow up with Orby, an AI chat bot that will answer any conceptual questions users may have.
How we built it
We built the Chrome extension using React, TypeScript, Vite, and CSS. The extension detects the active YouTube video and communicates with a FastAPI backend written in Python. The backend manages learning sessions, retrieves YouTube video metadata, and connects to an AI model to generate context-aware answers and explanations. We connected the frontend and backend using REST API endpoints and designed the interface in Figma before implementing it. We also used Chrome Extension Manifest V3 permissions to access the user's active YouTube tab.
Challenges we ran into
One of our biggest challenges was connecting a Chrome extension frontend to a locally hosted backend while correctly handling permissions, CORS settings, and different YouTube URL formats. We also had to manage Git merge conflicts while multiple team members worked on separate backend features. Another challenge was creating a polished and readable interface within the limited dimensions of a browser extension popup.
Accomplishments that we're proud of
We are proud that we built a functional full-stack Chrome extension within one week. OrbitAI can detect the active YouTube video, retrieve its information, create a learning session, and communicate with an AI-powered backend. We are also proud of the cohesive space-inspired interface and how closely we translated our original Figma design into a working product.
What we learned
We learned how Chrome extensions communicate with browser tabs and external APIs, how to structure a FastAPI backend, and how to connect a React frontend to Python services. We also gained experience with asynchronous requests, REST API design, Git collaboration, CORS configuration, integration debugging, and designing around real browser-extension constraints.
What's next for OrbitAI
Next, we plan to support saved study history, progress tracking, additional video platforms, and cloud deployment so users can access OrbitAI without running the backend locally. In addition, we would also like to implement a session recap page at the end of each video to outline to the users what concepts they are particularly struggling in, what resources they can use to learn the concept, etc.
Log in or sign up for Devpost to join the conversation.