StockTube

Let's get sendy!! (Viral)

Comment

We were inspired by the viral stock comparison videos on TikTok and Instagram that millions of people engage with daily. These videos often show dramatic comparisons between stocks like "If you invested $1000 in Tesla vs Apple 5 years ago" and generate massive engagement. However, creating these videos manually is time-consuming and requires video editing skills. We wanted to democratize this content creation by building an automated platform that generates these viral stock comparison videos in seconds.

What it does

StockTube is an AI-powered platform that automatically generates viral stock comparison videos for social media platforms. Users can:

  • Compare any two stocks with custom date ranges and investment amounts
  • Generate videos in multiple formats optimized for TikTok (9:16), Instagram, and YouTube
  • Get AI-powered suggestions for trending stock comparisons with optimal settings
  • Browse hot stocks with real-time data and performance metrics
  • Upload directly to YouTube with OAuth integration for seamless publishing (WORK IN PROGRESS)
  • Download videos for cross-platform sharing

The platform fetches real stock data using yfinance, creates animated visualizations, and compiles them into engaging videos using MoviePy, complete with charts, comparisons, and investment calculations.

How we built it

Frontend (Next.js + TypeScript):

  • Built with Next.js 15 and React 19 for modern web performance
  • Used Radix UI components with Tailwind CSS for a beautiful, responsive interface
  • Implemented real-time video preview and streaming capabilities
  • Added dark/light theme support with next-themes

Backend (Flask + Python):

  • Flask API server handling video generation requests
  • YouTube Data API v3 integration for direct video uploads
  • OAuth 2.0 flow for secure YouTube authentication
  • Cloudinary integration for video hosting and CDN delivery

Video Generation Pipeline:

  • Data Processing: yfinance for real-time stock data fetching
  • Visualization: matplotlib and OpenCV for creating animated charts and frames
  • Video Compilation: MoviePy for efficient video creation with compression
  • Cloud Storage: Automatic upload to Cloudinary with public URLs

Key Technologies:

  • Frontend: Next.js, TypeScript, Tailwind CSS, Radix UI, Recharts
  • Backend: Flask, Python, Google APIs, Cloudinary
  • Pipeline: MoviePy, matplotlib, yfinance
  • Authentication: Google OAuth 2.0, YouTube Data API

Challenges we ran into

YouTube API Integration: Initially, we configured the YouTube Data API v3 and set up OAuth authentication. However, we encountered several issues with the API connection and authentication flow. It's almost there; the last part of the authentication is hard. We are limited, and despite us having test users, when we try to log in with those test users, the authentication fails. It says "Users not permitted", despite us giving the accounts permissions.

Video Generation Performance: Our initial approach using OpenCV for video creation was slow and produced large file sizes. We switched to MovieP,y which provided much better compression and faster processing times. This integration with the frontend required careful coordination between the Flask API and Next.js frontend.

Real-time Data Processing: Fetching and processing stock data in real-time while maintaining video quality was challenging. We had to optimize our data pipeline to handle various date ranges and frequencies efficiently.

Cross-platform Compatibility: Ensuring videos work seamlessly across TikTok, Instagram, and YouTube required careful aspect ratio and format considerations.

Accomplishments that we're proud of

  • Complete end-to-end video generation pipeline from stock data to published YouTube videos
  • Real-time video preview with streaming capabilities in the web interface
  • AI-powered smart suggestions that recommend trending stock comparisons with optimal settings
  • Responsive, modern UI that works beautifully on desktop and mobile devices
  • Efficient video compression using MoviePy that reduces file sizes by 70% compared to our initial approach

What we learned

  • API Integration Complexity: Working with Google's YouTube API taught us the importance of proper OAuth flow implementation and error handling
  • Video Processing Optimization: Switching from OpenCV to MoviePy significantly improved our video generation speed and file size efficiency
  • Real-time Data Handling: Processing financial data in real-time requires careful optimization to maintain performance
  • Frontend-Backend Coordination: Seamless integration between Next.js and Flask required careful API design and error handling
  • User Experience Design: Creating an intuitive interface for complex video generation required multiple iterations and user feedback

What's next for StockTube

  • Advanced AI Features: Implement GPT integration for automated video scripts and voiceovers
  • More Video Templates: Add customizable templates like "Subway Surfers style" and "Minecraft style" comparisons
  • Real-time Stock Alerts: Notify users when their tracked stocks hit significant milestones
  • Social Media Automation: Direct posting to TikTok and Instagram APIs
  • Analytics Dashboard: Track video performance across platforms with detailed metrics
  • Collaborative Features: Allow teams to collaborate on video creation and scheduling
  • Mobile App: Native iOS and Android apps for on-the-go video creation
  • Advanced Customization: More chart types, animations, and branding options
  • Subscription Model: Premium features for power users and content creators

The platform has the potential to become the go-to tool for financial content creators, influencers, and anyone wanting to create engaging stock-related content for social media.

Built With

Share this project:

Updates