Project Info

BooloTube

Inspiration

With the recent rise of content creators getting demonetized and DMCA takedowns, creators must be more careful than ever when uploading content to YouTube. We want to provide an uninterrupted experience for both creators and viewers watching reaction videos, so we designed a way for creators to still react to the videos that they love without getting demonetized. Viewers can now watch reactors and the videos they're reacting to side-by-side while still contributing views to both creators.

What it does

The content creator captures their response to a video, ensuring not to include any content protected under the DMCA or the original content. The content creator utilizes this software to establish a correspondence of timestamps between their recorded reaction and the original material. For instance, should a content creator capture their reaction, and initiate their response at the 1:21 timestamp in their recorded material, they would correlate this to the 0:00 timestamp of the original video being commented on. For instance, should a content creator capture their reaction, and initiate their response at the 1:21 timestamp in their recorded material, they would correlate this to the 0:00 timestamp of the original video being commented on. The creator subsequently uploads their reaction video to platforms like YouTube (or any platform supporting video embedding) and associates it with the corresponding project generated using this application. During playback, viewers will observe the original content material synchronized to appear alongside the creator's reaction commencing at the 1:21 timestamp.

How we built it

For the front-end and back-end, we used Reflex which uses Python and allowed us to insert in html/js For persistence, we stored data into cockroachDB which helps provide us reliability in the form of a PostgreSQL database We used GitHub as a version control system and used issues and pull requests to track progress on tasks and features development throughout the hackathon

Challenges we ran into

We based our entire stack around Reflex, an emerging framework allowing developers to write full-stack code in "pure" Python. Since it's still a developing technology, many features normally found in front-end frameworks like React (such as being able to use Javascript and hooks), made it harder to adapt to the async nature of front-ends. Many new features are sparsely documented, so we had to rely on the expertise of Reflex's mentors during the hackathon to troubleshoot the many bugs that came up during development. We were testing the limits of this new framework as we were developing, leading to many instances of creative problem-solving to work around Reflex's current limitations. It was very new and challenging to wrap our heads around during front-end development in Python.

Accomplishments we're proud of

We are most proud of our ability to take on a new platform and immediately start building a new project with so many unknowns. Given some very thorough planning and documentation reading, we were very proud of our ability to think on the spot and adapt to an ever-changing set of design limitations. We are also very proud that our product works and successfully achieves the original design goal in a simple and efficient manner.

What we learned

We learned that having a good design and goal in mind from the start is very helpful, but being willing to pick up new things on the way can also provide an eye-opening experience. We also learned that it is important to ask important people for help whether they're the creators of the framework itself or other hackers that are running into the same problems as us. Working together not only as a team but as a community makes the best learning experience.

What's next

We want to implement a Chrome extension that would enhance the user's ability to use our service by having a picture-in-picture video to play side by side with the original video allowing the user to experience a more involved viewer experience. Ideally, viewers don't even need to enter a site to enjoy their new viewing experience. Users might also want to have an opt-in (in favor of privacy) authentication system that allows users to log in and favorite/store videos. It would also be cool to experiment with other features such as supporting other video players and also integrating with currently published reaction videos or automatically timestamping using computer vision. Instructions to try it out! Reflex deployment is still buggy for our use case, so to see the side-by-side you need some tinkering with the deployment link. The base app is here and most functions should work, barring some small routing issues. The side by side demo can be seen here. You will need to navigate to another page like /search, then back to /viewer, and then hit refresh. The side-by-side should show up!

boolotube

boolotube is very boolo

it is an application that allows reaction video creators to release youtube content without worrying about DMCA infringement

the way it works is:

the creator records their reaction to the video without including the DMCA/OG content
the creator uses this application to map of timestamps from the reaction video to the OG content
- for example, let's say I record my reaction video
- I start reacting to the video at timestamp 1:21 on my reaction video
- I map it to 0:00 of the video I'm reacting to
I upload the reaction video to youtube (or any other side with video embeds) and link the corresponding project created from this app
when watching the video, the OG content should pop up alongside my reaction at 1:21

Figma is here

API Functionality

Models

project: {
  uuid: UUID
  my_reaction_url: String,
  original_video_url: String,
  createdAt: Time,
  mapped_timestamps: [Object]
}

timestamp_map: {
  uuid: UUID
  start_time_my_reaction: Integer (seconds from start)
  end_time_my_reaction: Integer,
  start_time_original: Integer,
  end_time_original: Integer,
}

Endpoints

POST /project

Creates a new project. Requires the 2 videos to be present
Body:

  my_reaction_url: String,
  original_video_url: String,

GET /project/:id

Gets the project given the ID
Serves as the "permalink" to the project
Returns both links, generates embeds for both
Gets the list of matching timestamps

POST /timestamp

Body:

project_id: UUID
start_time_my_reaction: Integer,
end_time_my_reaction: Integer,
start_time_original: Integer,
end_time_originak: Integer,

Creates a new timestamp attached to the corresponding object
Does a few quick validations to check that the timestamps are logically correct

GET /timestamp/:id

Optionally can be just a foreign key to project and the query returns all the nested data
Gets relevant info about the timestamps

DELETE /timestamp/:id

Deletes the timestamp object that holds the corresponding mapping

Frontend

Viewer interface

Simple 2 pane interface that contains 2 video embeds. Use something like this to determine the video playtime and play the original video given the mappings.

Creator interface

Simple form to fill in the fields to create a new project. Once a project is created, allow the user in the current session only to add timestamps (for simplicity). Feel free to make a simple auth system to make each field editable.

Analysis

Compare with all teams

View

Metric

Figures cover GitHub contributors during the hackathon window. A co-authored commit counts in full for each author, so per-member totals add up to more than the whole-team figures.

Technology

Found in codeClaimed only

FastAPIIn code
HTMLIn code
JavaScriptIn code
PostgreSQLIn code
PythonIn code
RedisIn code
SQLIn code
Next.jsClaimed

7 of 8 appear in the indexed code. 1 claimed on Devpost could not be matched to code, which may simply mean the tool leaves no trace in the repository.

AI coding agents

No AI coding agent signals were found in this repository.

Detected from committed agent config files and commit authorship. Absence of a signal is not proof an agent was unused.

Codebase size

Source size

45 KB

Source files

Counts recognized source files only; vendored directories, binaries and lockfiles are excluded, so this is smaller than the repository on disk.