The problem Shorts Live solves

Short-form creators usually juggle too many tools for scripting, editing, captions, audio cleanup, and export. This project brings that workflow into one place so creators can move from idea to publish-ready video faster and with fewer technical blockers.

• Reduces tool-switching by combining script writing, media arrangement, captioning, and preview in a single studio experience.
• Helps creators produce short videos faster by automating repetitive tasks like caption generation and scene/story flow support.
• Makes editing safer and less error-prone with timeline-based control, visual preview, and project-saving workflows.
• Improves accessibility and engagement through cleaner subtitles/captions and better audio-text alignment.
• Supports rapid iteration for creators, marketers, and educators who need to test multiple short-video versions quickly.

Technologies used

• React + TypeScript for the app architecture and UI logic
• Vite for fast development/build workflow
• Tailwind CSS + PostCSS for styling
• HTML5 Canvas/media APIs for preview and render features
• Web Audio APIs for audio analysis/editing support
• Local storage/project persistence logic for saved workflows
• Serverless API routes (Vercel Functions) for AI/media proxy integrations
• PWA-ready setup (manifest + service-friendly web delivery)

Challenges I ran into

Building a browser-based editing workflow meant handling media performance, sync, and reliability without native desktop tooling. Most hurdles were solved by adding smarter processing steps, caching, and fallback logic.

• Keeping audio, captions, and timeline playback perfectly in sync was difficult; I solved this by tightening timestamp handling and update cycles in the render path.
• Large media files caused memory/performance drops in-browser; I added frame/audio optimization and caching to keep editing responsive.
• Export consistency across different devices/browsers was a hurdle; I implemented a more controlled export pipeline with safer defaults and fallback behaviors.
• AI-generated text/captions were sometimes inconsistent; I added guardrails, retries, and post-processing so output quality stayed usable.
• API/CORS and network reliability issues affected remote AI/media calls; I resolved this with proxy/serverless endpoints plus better error handling and user feedback.