Inspiration

YouTube has some of the best free resources for learning almost anything. I used to study from YouTube when I was in school, and I still learn from it often.

But I noticed that finding resources is usually not the hardest part. Finishing what we already chose is much harder.

When you search for a topic, you may find hundreds of videos, playlists, roadmaps, and teacher recommendations. Then you start comparing them. You check one playlist, then another, read comments to see whether a teacher is good, watch 10 or 15 minutes, get distracted, and start searching again.

The loop continues.

We keep looking for the “best” resource instead of finishing a good one we already found. We may watch many roadmaps but follow none of them.

That made me think: instead of helping learners search for more resources, why not help them finish the resources they already trust?

That idea became K12Learn2Gether.

I wanted a learner to be able to save the lessons and playlists they trust in their own learning library, set a daily focus goal, return without searching YouTube again, and continue from where they stopped.

I also wanted the study session itself to discourage unnecessary switching. When eligible playback is running, the app records focus time. If browser focus is lost, the lesson is asked to pause and focus time stops recording. Returning does not automatically resume the lesson; the learner chooses when to continue.

Another problem I personally noticed is continuity. If I stop a long lesson today and return tomorrow, I should not have to search for the video again and manually remember that I stopped at 6:13. K12Learn2Gether saves the learning resource and its last confirmed playback position so the learner can return to the same learning thread.

K12Learn2Gether started from a simple idea: the problem is not always finding more learning content. Sometimes the harder problem is returning to what you already chose and continuing consistently.

What it does

K12Learn2Gether is a browser-based personal learning library for trusted YouTube learning resources.

A learner can save a supported lesson or playlist, give it a subject and learning objective, set a focus-time goal, and return later through My Learning instead of searching for the resource again.

The workspace keeps the lesson, saved playback position, focus goal, and recorded activity together. When the learner returns to a saved resource, the app restores the last confirmed playback position and keeps the lesson paused until the learner chooses to continue.

Recorded focus advances only when the app's supported playback and browser-focus signals are eligible. It is a productivity signal, not proof of attention, comprehension, or mastery.

The Focus Cup makes progress toward the learner's selected focus-time goal visible. Learners can choose between different vessel styles such as a glass, coffee cup, mug, or bottle. As recorded focus moves toward the selected goal, the vessel fills visually.

The app also provides dated focus summaries and a streak based on eligible recorded activity. A day qualifies for the streak after 10 minutes of eligible recorded focus.

Learners can also generate shareable progress cards such as Daily Focus, Learning Recap, and Goal Reached when eligible. These can be exported as PNG images, with native image sharing offered where the browser supports it.

How I built it

I used the Devpost Learn Skill Pack to structure the planning process for the project and work through the product problem, requirements, specification, build process, and review stages.

I used Codex as my coding agent while building the application.

The application is built with React, TypeScript, and Vite. It uses YouTube's embedded player for lesson playback and browser-local persistence for the learner's library, saved position, focus activity, goals, and preferences.

For this hackathon version, I intentionally kept the architecture browser-first. There is currently no required account, backend, or cloud database. Learning state is stored locally in the same browser profile.

One important part of the implementation was keeping the product honest about what it measures. Focus time is based on supported playback and browser-focus signals rather than claiming that the application can verify whether someone is actually paying attention or understanding a lesson.

The project also includes automated unit tests and Playwright browser tests covering areas such as persistence, focus eligibility, resume continuity, Focus Cup behavior, responsive layouts, and progress sharing.

Challenges I faced

One of the biggest challenges was deciding how to make the product useful for students without turning it into another application full of features.

I kept asking myself: what would actually help someone stay with a resource and finish what they planned to study?

That led to several important product decisions.

The first was focus tracking. I wanted recorded time to stop when the learner leaves the study context instead of allowing a timer to continue running in the background. Implementing this while being honest about browser limitations was an important challenge.

The second was continuity. A learner should not need to remember where they stopped in a long video. Saving and restoring the playback position while keeping the returned lesson paused until the learner explicitly continues became an important part of the experience.

Another challenge was making progress feel visible and motivating without inventing fake achievements. That led to the Focus Cup. Instead of showing only another number or timer, the selected vessel fills according to progress toward the learner's own focus-time goal.

Students also like sharing progress and maintaining streaks, so I explored how those ideas could support the same core problem instead of becoming unrelated gamification. The result was the 10-minute activity-based streak and shareable progress cards that use only activity the application has actually recorded.

The product also evolved from an initial single learning commitment into a personal learning library so learners could keep multiple trusted resources without repeatedly returning to YouTube to search for them again.

What I learned

The biggest thing I learned is that building something useful is very different from simply adding features.

This problem matters to me because I experienced it myself. When I was in school, I often studied from YouTube. Sometimes I would spend a lot of time searching for the best video, playlist, teacher, or roadmap instead of actually completing the resource I had already found.

Building K12Learn2Gether made me think much more from the user's perspective.

I learned to ask questions such as:

  • Does this feature actually solve the user's problem?
  • Does it reduce friction or create more of it?
  • What should the product deliberately not include?
  • How can the UI communicate progress without making misleading claims?
  • How can browser and player limitations be handled honestly?
  • How can testing protect the core learning flow as the product evolves?

I also learned that good product development sometimes means removing ideas or leaving them for later. Solving one problem clearly is more valuable than building a large number of features that do not improve the core experience.

For me, the most important lesson from this project was learning to think not only like someone writing code, but also like a product and UI/UX engineer who has to understand why a feature should exist in the first place.

What's next

For this hackathon version, I deliberately kept the scope focused on the core learning-continuity experience.

The current proof of concept focuses on helping learners save trusted resources, return to them, continue from where they stopped, record eligible focus activity, visualize progress, and build consistency.

Features such as cloud accounts, cross-device synchronization, AI tutoring, group study, community features, PDF workflows, and exam mode are outside the submitted proof of concept.

Those are possible future directions, but the current goal is intentionally smaller:

Less searching. More finishing.

Built With

Share this project:

Updates

Submission history