DEV Community

Cover image for ▢️ Swiftube - Creating videos using React βš›οΈ & AI
Pranav
Pranav

Posted on • Updated on

▢️ Swiftube - Creating videos using React βš›οΈ & AI

What I built πŸš€

I've built Swiftube, an innovative application that transforms user prompts into animated videos, complete with intro & outro, images, voice-over and table.

My Tech Stack:

Image description

Category Submission: πŸƒ

Wacky Wildcards

App Link 🌐

https://swiftube.vercel.app

Screenshots πŸ–ΌοΈ

  • Video Playback ▢️
    Video Playback

  • Homepage 🏠
    Homepage

  • Creating a new video πŸͺ„
    Creating a new video

  • Explore videos made by others!
    Explore videos made by others

Description

Swiftube generates videos based on the instructions and raw content provided by the user, by leveraging the power of:

This is very useful when you have some talking points and images from a presentation and want to quickly convert it into an engaging video for YouTube, Instagram, or what have you!

Remotion's programmatic approach unlocks many features, including but not limited to:

  • Changing the video host entirely (this is huge!)
  • Changing the Channel Logo in the outro

Watch this example video to see it in action! (try changing the Video Settings)

Given some more time, I'd love to implement:

  • Rendering mp4 videos in the cloud using GitHub Actions and Remotion Lambda!
  • Prettier looking video w/ animations (right now it's just the talking points and images)
  • and many more features...

Link to Source Code πŸ§‘β€πŸ’»

Permissive License 🌟

MIT License

Background πŸ€”

I loved the idea of creating videos with dynamic data using Remotion and started to dabble with it. I had a vague idea that it can be used to make simple videos that convey some text.

Then, after experimenting more with it, I got a basic demo of Remotion with Text-to-speech working.

I realized that the pairing of OpenAI and Remotion can be a huge time saver for many because it eliminates the need for:

  • Fancy & expensive equipment for recording your voice.
  • Video/Audio editing skills

Just bring your own content!

How I built it πŸ€“

After learning about the Text-to-speech APIs, Cloud storage, picking the right databases, facing lots of challenges, and dealing with lots and lots of mathematics on the Remotion size, it finally worked as intended.

Admittedly, it's still in the early stages, and is only good for < 10 mins videos. But I invite members of the Open Source community to criticize, iterate and improve on it, if they find it useful :)

Happy to be a part of this Hackathon!
Thanks for reading this far, appreciate it :)

Additional Resources/Info πŸ“‘

Top comments (5)

Collapse
 
just_moh_it profile image
Mohit Yadav

Killing it with these automated videos, Pranav! The app is so polished and the UI & UX is really nice πŸ”₯

Created this video about video games 🀩: swiftube.vercel.app/video/2580cde4...

Collapse
 
thecmdrunner profile image
Pranav

Thanks for trying it out Mohit! πŸ˜„ Looks like the video took only around 1.5 mins to make!
Not a UI expert myself, but somehow got things aligned πŸ˜‚

Collapse
 
nickparsons profile image
Nick Parsons

Wow! This is awesome. Nice one @thecmdrunner!

Collapse
 
thecmdrunner profile image
Pranav

Thanks a lot Nick! πŸ˜„
I'm glad that you liked it, and that the Clerk video you made turned out well in the first try itself 😁

Collapse
 
nickparsons profile image
Nick Parsons

Heyyy, you saw it? That was so cool haha. Can’t wait to see how the app evolves. Keep me posted!