StreamCut

🚀Inspiration

Content creators often have to juggle between multiple apps to record and edit videos, which can be time-consuming and frustrating. I wanted to build something that simplifies this process, a single tool where creators can record and edit videos quickly in one place. That’s how StreamCut was born.

🎥What it does

StreamCut is an all-in-one video recorder and editor that allows users to record videos directly within the app and edit them using a timeline-based workflow. Users can preview edits live with an integrated preview window, apply color correction to clips, transform clips by adjusting scale, position, and rotation, add text overlays anywhere on the timeline, apply blur effects, control clip opacity, rearrange clips efficiently, and export the final edited video quickly. StreamCut simplifies the entire process from recording to editing, making it fast and intuitive for creators.

⚙️How I built it

I built StreamCut using React for the core application structure, Tailwind CSS for fast and responsive UI styling, TypeScript for type safety and maintainable code, and Vite for a fast and optimized development environment. My focus was on building a smooth recording experience, a responsive timeline, and real-time editing tools that work together seamlessly to deliver an integrated video creation platform.

🎬Challenges I ran into

Exporting the final video was a major challenge as it required solving performance and formatting issues to ensure the output was usable. Making the video play correctly in the preview window was also difficult, especially in synchronizing the timeline with the preview and ensuring smooth, real-time playback. Implementing zooming in the timeline was another tough problem because it had to remain smooth and responsive without compromising performance. Another significant challenge was working with Bolt, where sometimes when I asked it to perform specific tasks, it either did not execute them properly or did not perform them at all. While this is understandable, it still consumed a large number of tokens and made iteration slower and more resource-intensive.

🏆Accomplishments that I am proud of

I am proud to have successfully integrated recording, timeline editing, and advanced effects into a single app. Built a live preview window that updates edits in real time and delivered a working video editing platform with transformation, color correction, text overlays, blur, and opacity features within the hackathon timeframe.

📚What I learnt

I learnt how to build a real-time video editing experience from scratch using Bolt. Gained a deeper understanding of the technical challenges involved in timeline-based editing and live playback. I also learnt the importance of focusing on core user flows first and refining complex features over time to meet strict deadlines.

🚀What's next for StreamCut

Next, I plan to improve the trimming and cutting precision to make editing smoother and more accurate. I also want to add advanced effects like transitions and multi-layer editing to give users more creative control. StreamCut will introduce user authentication to support personalized projects and saved sessions. I’m also working on adding a combined screen and webcam recording mode to expand recording options, and I plan to implement keyframes for more detailed control over animations, transformations, and effects.

Built With

• bolt.new
• react
• tailwind
• typescript
• vite