diff --git a/README.md b/README.md index 7991aeb..ed0d241 100644 --- a/README.md +++ b/README.md @@ -1,37 +1,93 @@ -This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app). +# Video Shorts Editor + +A modern web application for trimming and converting videos to portrait format, perfect for creating Shorts, Reels, and TikTok content. + +## Features + +- **Simple Video Upload**: Easily upload your videos directly from your device +- **Precise Trimming**: Set exact start and end points for your video clips +- **Portrait Format**: Automatically converts videos to 9:16 aspect ratio (1080x1920) +- **User-Friendly Interface**: Intuitive controls and real-time preview +- **Fast Processing**: Quick trimming and conversion with progress tracking +- **Responsive Design**: Works on both desktop and mobile devices + +## Supported Formats + +- MP4 +- WebM +- MOV ## Getting Started -First, run the development server: +### Prerequisites -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -# or -bun dev -``` +- Node.js 16.8 or later +- npm, yarn, or pnpm +- Modern web browser with JavaScript enabled -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. +### Installation -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. +1. Clone the repository: + ```bash + git clone https://github.com/yourusername/video-shorts-editor.git + cd video-shorts-editor + ``` -This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel. +2. Install dependencies: + ```bash + npm install + # or + yarn install + # or + pnpm install + ``` -## Learn More +3. Run the development server: + ```bash + npm run dev + # or + yarn dev + # or + pnpm dev + ``` -To learn more about Next.js, take a look at the following resources: +4. Open [http://localhost:3000](http://localhost:3000) in your browser -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. +## How to Use -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome! +1. **Upload Your Video** + - Click "Select Video" to choose a video file from your device + - Supported formats: MP4, WebM, MOV (up to 100MB) -## Deploy on Vercel +2. **Trim Your Clip** + - Play the video to find the perfect start point + - Click "Mark Start" to set the beginning of your short + - Click "Mark End" to set the end of your short (max 60 seconds recommended) + - Use the timeline to fine-tune your selection -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. +3. **Download Your Short** + - Click "Download Short" to process your video + - The processed video will automatically download in MP4 format -Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details. -# video-short-converter +## Tips for Best Results + +- For best quality, use well-lit videos with clear audio +- Keep your shorts under 60 seconds for most platforms +- Center important content in the frame for optimal portrait display +- Use videos with high resolution (at least 1080x1920 for best quality) + +## Technologies Used + +- [Next.js](https://nextjs.org/) - React framework +- [TypeScript](https://www.typescriptlang.org/) - Type-safe JavaScript +- [Tailwind CSS](https://tailwindcss.com/) - Utility-first CSS framework +- [FFmpeg.wasm](https://ffmpegwasm.netlify.app/) - For video processing in the browser +- [React Icons](https://react-icons.github.io/react-icons/) - For UI icons + +## Contributing + +Contributions are welcome! Please feel free to submit a Pull Request. + +## License + +This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.