AutoClip – AI-Powered Video Clipping Tool: Features, Usage, and Development Guide

In today’s digital age, creating and distributing video content has become increasingly important. Whether you’re an individual creator or a professional media organization, efficient and intelligent video clipping tools are essential to improve work efficiency and content quality. AutoClip is one such AI-driven video clipping and collection recommendation system that supports automatic Bilibili video downloading, subtitle extraction, intelligent slicing, and collection generation. In this guide, we’ll explore AutoClip’s features, how to get started, its project structure, configuration methods, user instructions, development guidelines, and frequently asked questions.

What is AutoClip?

AutoClip is an intelligent video clipping and collection recommendation system that uses artificial intelligence to analyze video content, enabling high-quality automatic clipping. It also supports automatic Bilibili video downloads with subtitle extraction, and uses AI to analyze clip content and recommend related collections. Additionally, users can manually edit collections—with support for drag-and-drop sorting, adding or removing clips—and download all clips and collections in one click. The tool features a modern web interface built with React + TypeScript + Ant Design, providing real-time display of processing progress and logs.

Key Features of AutoClip

Intelligent Video Clipping

AutoClip leverages AI technology to analyze video content and generate high-quality automatic clips. This means users don’t need to manually clip videos frame by frame; the system automatically identifies key content in the video for intelligent slicing, saving significant time and effort.

Bilibili Video Download

The tool supports automatic Bilibili video downloads and subtitle extraction. Users simply provide a Bilibili video link, and the system automatically completes the download and subtitle extraction, making it easy to obtain required video materials.

Smart Collection Recommendations

AutoClip uses AI to automatically analyze clip content and recommend related collections. This helps users quickly organize and categorize video clips, improving the efficiency of video content management.

Manual Collection Editing

Users can manually edit collections, with support for drag-and-drop sorting and adding or removing clips. This flexible editing method allows users to personalize video collections according to their needs.

One-Click Package Download

AutoClip supports one-click package download of all clips and collections. Users don’t need to download video clips one by one; the system automatically packages them into a single file for easy saving and sharing.

Modern Web Interface

Built with React + TypeScript + Ant Design, the modern web interface is visually appealing and easy to operate, providing a good user experience.

Real-Time Processing Status

The tool displays real-time processing progress and logs, allowing users to track the status of video processing at any time, ensuring transparency and controllability throughout the process.

Getting Started

System Requirements

Before using AutoClip, ensure your system meets the following requirements:

  • Python 3.8 or higher
  • Node.js 16 or higher
  • DashScope API Key (for AI analysis)

Installation Steps

Clone the Project

First, clone the AutoClip project from GitHub to your local machine. Open a terminal and execute the following commands:

git clone git@github.com:zhouxiaoka/autoclip_mvp.git
cd autoclip_mvp

Install Backend Dependencies

To avoid dependency conflicts with other Python projects, we recommend using a virtual environment. In the terminal, create and activate a virtual environment with these commands:

# Create virtual environment
python3 -m venv venv
source venv/bin/activate  # For Linux/Mac
# Or venv\Scripts\activate  # For Windows

# Install dependencies
pip install -r requirements.txt

Install Frontend Dependencies

Navigate to the frontend directory and install frontend dependencies using npm:

cd frontend
npm install
cd ..

Configure API Key

Copy the example configuration file and edit it to add your DashScope API key:

# Copy example configuration file
cp data/settings.example.json data/settings.json

# Edit the configuration file and add your API key
{
  "dashscope_api_key": "your-dashscope-api-key",
  "model_name": "qwen-plus",
  "chunk_size": 5000,
  "min_score_threshold": 0.7,
  "max_clips_per_collection": 5,
  "default_browser": "chrome"
}

Starting the Service

Method 1: Using the Startup Script (Recommended)

Grant execution permission to the startup script and run it:

chmod +x start_dev.sh
./start_dev.sh

Method 2: Manual Startup

Start the backend and frontend services separately:

# Start backend service
source venv/bin/activate
python backend_server.py

# Open a new terminal and start frontend service
cd frontend
npm run dev

Method 3: Command-Line Tool

You can use the command-line tool to process local video files, existing projects, or list all projects:

# Process local video files
python main.py --video input.mp4 --srt input.srt --project-name "My Project"

# Process an existing project
python main.py --project-id <project_id>

# List all projects
python main.py --list-projects

Access URLs

  • Frontend Interface: http://localhost:3000
  • Backend API: http://localhost:8000
  • API Documentation: http://localhost:8000/docs

Project Structure

AutoClip has a clear project structure with well-defined modules, making it easy to develop and maintain. Here’s the main structure:

autoclip_mvp/
├── backend_server.py          # FastAPI backend service
├── main.py                   # Command-line entry
├── start_dev.sh              # Development environment startup script
├── requirements.txt           # Python dependencies
├── .gitignore               # Git ignore file
├── README.md                # Project documentation
│
├── frontend/                # React frontend
│   ├── src/
│   │   ├── components/      # React components
│   │   ├── pages/          # Page components
│   │   ├── services/       # API services
│   │   ├── store/          # State management
│   │   └── hooks/          # Custom Hooks
│   ├── package.json        # Frontend dependencies
│   └── vite.config.ts      # Vite configuration
│
├── src/                    # Core business logic
│   ├── main.py            # Main processing logic
│   ├── config.py          # Configuration management
│   ├── api.py             # API interfaces
│   ├── pipeline/          # Processing pipeline
│   │   ├── step1_outline.py    # Outline extraction
│   │   ├── step2_timeline.py   # Timeline generation
│   │   ├── step3_scoring.py    # Score calculation
│   │   ├── step4_title.py      # Title generation
│   │   ├── step5_clustering.py # Clustering analysis
│   │   └── step6_video.py      # Video generation
│   ├── utils/             # Utility functions
│   │   ├── llm_client.py      # AI client
│   │   ├── video_processor.py # Video processing
│   │   ├── text_processor.py  # Text processing
│   │   ├── project_manager.py # Project management
│   │   ├── error_handler.py   # Error handling
│   │   └── bilibili_downloader.py # Bilibili downloader
│   └── upload/            # File upload
│       └── upload_manager.py
│
├── data/                  # Data files
│   ├── projects.json     # Project data
│   └── settings.json     # Configuration file
│
├── uploads/              # Upload file storage
│   ├── tmp/             # Temporary download files
│   └── {project_id}/    # Project files
│       ├── input/       # Original files
│       └── output/      # Processing results
│           ├── clips/   # Sliced videos
│           └── collections/ # Collection videos
│
├── prompt/               # AI prompt templates
│   ├── business/        # Business & Finance
│   ├── knowledge/       # Knowledge & Science
│   ├── entertainment/   # Entertainment content
│   └── ...
│
└── tests/               # Test files
    ├── test_config.py
    └── test_error_handler.py

Configuration Methods

API Key Configuration

Configure your DashScope API key in the data/settings.json file:

{
  "dashscope_api_key": "your-dashscope-api-key",
  "model_name": "qwen-plus",
  "chunk_size": 5000,
  "min_score_threshold": 0.7,
  "max_clips_per_collection": 5,
  "default_browser": "chrome"
}

Browser Configuration

You can select supported browsers (such as Chrome, Firefox, Safari, etc.) for Bilibili video downloads in the configuration file:

{
  "default_browser": "chrome"
}

User Guide

Uploading Local Videos

  1. Visit http://localhost:3000
  2. Click the “Upload Video” button
  3. Select a video file and a subtitle file (required)
  4. Fill in the project name and category
  5. Click “Start Processing”

Downloading Bilibili Videos

  1. Click “Bilibili Video Download” on the homepage
  2. Enter the Bilibili video link (must be a video with subtitles)
  3. Select a browser (for login status)
  4. Click “Start Download”

Editing Collections

  1. Navigate to the project detail page
  2. Click on a collection card to enter edit mode
  3. Drag and drop clips to adjust their order
  4. Add or remove clips
  5. Save your changes

Downloading a Project

  1. Click the download button on the project card
  2. The system will automatically package all clips and collections
  3. Download the complete zip file

Development Guide

Backend Development

# Start development server (with hot reload)
python backend_server.py

# Run tests
pytest tests/

Frontend Development

cd frontend
npm run dev    # Development mode
npm run build  # Production build
npm run lint   # Code linting

Adding New Video Categories

  1. Create a new category folder in the prompt/ directory
  2. Add corresponding prompt template files
  3. Add category options in the frontend src/services/api.ts

Frequently Asked Questions (FAQ)

Q: What should I do if Bilibili video download fails?

A: Ensure you’re logged into your Bilibili account and select the correct browser. Chrome is recommended.

Q: Why is AI analysis slow?

A: You can adjust the chunk_size parameter. Smaller values will improve speed but may affect quality.

Q: How can I improve clip quality?

A: Adjust the min_score_threshold parameter. Higher values will improve clip quality but reduce the number of clips.

Q: What if there are too few collections?

A: Adjust the max_clips_per_collection parameter to increase the maximum number of clips per collection.

License and Contribution

License

This project is licensed under the MIT License. For details, refer to the LICENSE file.

Contribution

We welcome contributions through Issues and Pull Requests. Here’s how:

  1. Fork this project
  2. Create a feature branch (git checkout -b feature/AmazingFeature)
  3. Commit your changes (git commit -m 'Add some AmazingFeature')
  4. Push to the branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

In summary, AutoClip is a powerful and user-friendly video clipping tool that combines artificial intelligence technology to provide efficient and intelligent video processing solutions for content creators. Whether you’re an individual user or a professional developer, AutoClip can help improve the efficiency and quality of your video creation. We hope this guide helps you better understand and use AutoClip. If you encounter any problems during use, feel free to contact us.