# zhouxiaoka/autoclip_mvp architecture

> Architecture diagram of the GitHub repository zhouxiaoka/autoclip_mvp, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-10). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/zhouxiaoka/autoclip_mvp
- Repository: https://github.com/zhouxiaoka/autoclip_mvp

## Overview

AutoClip is a deprecated web application for turning local or Bilibili video and subtitles into AI-selected clips and recommended collections. Users submit a source through the web interface, the backend manages a project and runs a six-stage analysis/rendering pipeline, then users review and edit clips and collections and download outputs. The README documents Bilibili ingest, settings, progress, and project archives; those capabilities are included, though some implementation details were not sampled. Edges are limited to relationships supported by shown excerpts or README statements.

Main entry points: [`src/main.py`](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/main.py) (Pipeline orchestration), [`src/utils/llm_factory.py`](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/llm_factory.py) (LLM provider factory), [`frontend/src/services/api.ts`](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/services/api.ts) (API client), [`backend_server.py`](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/backend_server.py) (HTTP API)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_web["Web experience"]
  node_app["App routing<br/>[App.tsx]"]
  node_home["Project home<br/>[HomePage.tsx]"]
  node_ingest_ui["Video intake<br/>[FileUpload.tsx]"]
  node_bili_ui["Bilibili intake"]
  node_detail["Project review"]
  node_collection_ui["Collection editor"]
  node_download_hook["Collection export"]
  node_settings_ui["AI settings<br/>[SettingsPage.tsx]"]
  node_store["Project state<br/>[useProjectStore.ts]"]
  node_client_api["API client<br/>[api.ts]"]
end

subgraph group_service["Backend service"]
  node_backend["HTTP API<br/>[backend_server.py]"]
  node_project_manager[("Project files<br/>[project_manager.py]")]
  node_archive["Project archive<br/>[backend_server.py]"]
end

subgraph group_workflow["Clip processing"]
  node_pipeline_runner["Pipeline orchestration<br/>[main.py]"]
  node_outline["Outline extraction<br/>[step1_outline.py]"]
  node_timeline["Timeline generation<br/>[step2_timeline.py]"]
  node_scoring["Clip scoring<br/>[step3_scoring.py]"]
  node_titles["Clip titles<br/>[step4_title.py]"]
  node_clustering["Collection clustering"]
  node_video_render["Video rendering<br/>[step6_video.py]"]
end

subgraph group_support["AI and media"]
  node_bili_downloader["Bilibili downloader"]
  node_config["Configuration<br/>[config.py]"]
  node_llm_factory["LLM provider factory<br/>[llm_factory.py]"]
  node_dashscope["DashScope client<br/>[llm_client.py]"]
  node_siliconflow["SiliconFlow client"]
  node_text_processor["Subtitle processing<br/>[text_processor.py]"]
  node_video_processor["Media processing<br/>[video_processor.py]"]
end

node_user(("User"))
node_external_bili(("Bilibili"))
node_external_ai(("AI providers"))

node_user -->|"uses"| node_app
node_app -->|"routes to"| node_home
node_app -->|"routes to"| node_detail
node_app -->|"routes to"| node_settings_ui
node_home -->|"offers upload"| node_ingest_ui
node_home -->|"offers download"| node_bili_ui
node_home -->|"requests projects"| node_client_api
node_detail -->|"opens editor"| node_collection_ui
node_collection_ui -->|"starts export"| node_download_hook
node_download_hook -->|"requests export"| node_client_api
node_detail -->|"reads state"| node_store
node_store -->|"calls project API"| node_client_api
node_home -->|"updates state"| node_store
node_settings_ui -->|"updates settings"| node_client_api
node_ingest_ui -.->|"uploads files"| node_client_api
node_bili_ui -.->|"creates download"| node_client_api
node_client_api -->|"sends requests"| node_backend
node_backend -->|"manages projects"| node_project_manager
node_backend -->|"runs processing"| node_pipeline_runner
node_backend -->|"dispatches download"| node_bili_downloader
node_backend -->|"packages project"| node_archive
node_pipeline_runner -->|"reads project inputs"| node_project_manager
node_pipeline_runner -->|"runs step one"| node_outline
node_pipeline_runner -->|"runs step two"| node_timeline
node_pipeline_runner -->|"runs step three"| node_scoring
node_pipeline_runner -->|"runs step four"| node_titles
node_pipeline_runner -->|"runs step five"| node_clustering
node_pipeline_runner -->|"runs step six"| node_video_render
node_outline -->|"creates client"| node_llm_factory
node_timeline -->|"creates client"| node_llm_factory
node_scoring -->|"creates client"| node_llm_factory
node_titles -->|"creates client"| node_llm_factory
node_clustering -->|"creates client"| node_llm_factory
node_outline -->|"uses text tools"| node_text_processor
node_timeline -->|"uses text tools"| node_text_processor
node_scoring -->|"uses text tools"| node_text_processor
node_titles -->|"uses text tools"| node_text_processor
node_video_render -->|"uses media tools"| node_video_processor
node_llm_factory -->|"selects provider"| node_dashscope
node_llm_factory -->|"selects provider"| node_siliconflow
node_config -->|"selects provider"| node_llm_factory
node_dashscope -.->|"calls API"| node_external_ai
node_siliconflow -.->|"calls API"| node_external_ai
node_bili_downloader -->|"downloads source"| node_external_bili
node_config -.->|"configures service"| node_backend

click node_app "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/App.tsx"
click node_home "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/pages/HomePage.tsx"
click node_ingest_ui "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/components/FileUpload.tsx"
click node_bili_ui "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/components/BilibiliDownload.tsx"
click node_detail "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/pages/ProjectDetailPage.tsx"
click node_collection_ui "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/components/CollectionPreviewModal.tsx"
click node_download_hook "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/hooks/useCollectionVideoDownload.ts"
click node_settings_ui "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/pages/SettingsPage.tsx"
click node_store "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/store/useProjectStore.ts"
click node_client_api "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/services/api.ts"
click node_backend "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/backend_server.py"
click node_project_manager "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/project_manager.py"
click node_pipeline_runner "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/main.py"
click node_outline "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/pipeline/step1_outline.py"
click node_timeline "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/pipeline/step2_timeline.py"
click node_scoring "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/pipeline/step3_scoring.py"
click node_titles "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/pipeline/step4_title.py"
click node_clustering "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/pipeline/step5_clustering.py"
click node_video_render "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/pipeline/step6_video.py"
click node_bili_downloader "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/bilibili_downloader.py"
click node_config "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/config.py"
click node_llm_factory "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/llm_factory.py"
click node_dashscope "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/llm_client.py"
click node_siliconflow "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/siliconflow_client.py"
click node_text_processor "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/text_processor.py"
click node_video_processor "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/video_processor.py"
click node_archive "https://github.com/zhouxiaoka/autoclip_mvp/blob/main/backend_server.py"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_app,node_home,node_ingest_ui,node_bili_ui,node_detail,node_collection_ui,node_download_hook,node_settings_ui,node_store,node_client_api,node_user toneBlue
class node_backend,node_project_manager,node_archive toneAmber
class node_pipeline_runner,node_outline,node_timeline,node_scoring,node_titles,node_clustering,node_video_render toneMint
class node_bili_downloader,node_config,node_llm_factory,node_dashscope,node_siliconflow,node_text_processor,node_video_processor toneRose
class node_external_bili,node_external_ai toneIndigo
```

## Components

### Web experience

- [App routing](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/App.tsx): `frontend/src/App.tsx`
- [Project home](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/pages/HomePage.tsx): `frontend/src/pages/HomePage.tsx`
- [Video intake](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/components/FileUpload.tsx): `frontend/src/components/FileUpload.tsx`
- [Bilibili intake](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/components/BilibiliDownload.tsx): `frontend/src/components/BilibiliDownload.tsx`
- [Project review](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/pages/ProjectDetailPage.tsx): `frontend/src/pages/ProjectDetailPage.tsx`
- [Collection editor](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/components/CollectionPreviewModal.tsx): `frontend/src/components/CollectionPreviewModal.tsx`
- [Collection export](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/hooks/useCollectionVideoDownload.ts): `frontend/src/hooks/useCollectionVideoDownload.ts`
- [AI settings](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/pages/SettingsPage.tsx): `frontend/src/pages/SettingsPage.tsx`
- [Project state](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/store/useProjectStore.ts): `frontend/src/store/useProjectStore.ts`
- [API client](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/frontend/src/services/api.ts): `frontend/src/services/api.ts`

### Backend service

- [HTTP API](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/backend_server.py): `backend_server.py`
- [Project files](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/project_manager.py): `src/utils/project_manager.py`
- [Project archive](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/backend_server.py): `backend_server.py`

### Clip processing

- [Pipeline orchestration](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/main.py): `src/main.py`
- [Outline extraction](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/pipeline/step1_outline.py): `src/pipeline/step1_outline.py`
- [Timeline generation](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/pipeline/step2_timeline.py): `src/pipeline/step2_timeline.py`
- [Clip scoring](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/pipeline/step3_scoring.py): `src/pipeline/step3_scoring.py`
- [Clip titles](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/pipeline/step4_title.py): `src/pipeline/step4_title.py`
- [Collection clustering](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/pipeline/step5_clustering.py): `src/pipeline/step5_clustering.py`
- [Video rendering](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/pipeline/step6_video.py): `src/pipeline/step6_video.py`

### AI and media

- [Bilibili downloader](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/bilibili_downloader.py): `src/utils/bilibili_downloader.py`
- [Configuration](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/config.py): `src/config.py`
- [LLM provider factory](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/llm_factory.py): `src/utils/llm_factory.py`
- [DashScope client](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/llm_client.py): `src/utils/llm_client.py`
- [SiliconFlow client](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/siliconflow_client.py): `src/utils/siliconflow_client.py`
- [Subtitle processing](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/text_processor.py): `src/utils/text_processor.py`
- [Media processing](https://github.com/zhouxiaoka/autoclip_mvp/blob/main/src/utils/video_processor.py): `src/utils/video_processor.py`

### Other components

- **User**
- **Bilibili**
- **AI providers**

## Connections

- User → App routing: uses (evidence: `README.md`)
- App routing → Project home: routes to (evidence: `frontend/src/App.tsx`)
- App routing → Project review: routes to (evidence: `frontend/src/App.tsx`)
- App routing → AI settings: routes to (evidence: `frontend/src/App.tsx`)
- Project home → Video intake: offers upload (evidence: `frontend/src/pages/HomePage.tsx`)
- Project home → Bilibili intake: offers download (evidence: `frontend/src/pages/HomePage.tsx`)
- Project home → API client: requests projects (evidence: `frontend/src/pages/HomePage.tsx`)
- Project review → Collection editor: opens editor (evidence: `frontend/src/pages/ProjectDetailPage.tsx`)
- Collection editor → Collection export: starts export (evidence: `frontend/src/components/CollectionPreviewModal.tsx`)
- Collection export → API client: requests export (evidence: `frontend/src/hooks/useCollectionVideoDownload.ts`)
- Project review → Project state: reads state (evidence: `frontend/src/pages/ProjectDetailPage.tsx`)
- Project state → API client: calls project API (evidence: `frontend/src/store/useProjectStore.ts`)
- Project home → Project state: updates state (evidence: `frontend/src/pages/HomePage.tsx`)
- AI settings → API client: updates settings (evidence: `frontend/src/pages/SettingsPage.tsx`)
- Video intake → API client: uploads files
- Bilibili intake → API client: creates download
- API client → HTTP API: sends requests (evidence: `frontend/src/services/api.ts`)
- HTTP API → Project files: manages projects (evidence: `backend_server.py`)
- HTTP API → Pipeline orchestration: runs processing (evidence: `backend_server.py`)
- HTTP API → Bilibili downloader: dispatches download (evidence: `backend_server.py`)
- HTTP API → Project archive: packages project (evidence: `README.md`)
- Pipeline orchestration → Project files: reads project inputs (evidence: `src/main.py`)
- Pipeline orchestration → Outline extraction: runs step one (evidence: `src/main.py`)
- Pipeline orchestration → Timeline generation: runs step two (evidence: `src/main.py`)
- Pipeline orchestration → Clip scoring: runs step three (evidence: `src/main.py`)
- Pipeline orchestration → Clip titles: runs step four (evidence: `src/main.py`)
- Pipeline orchestration → Collection clustering: runs step five (evidence: `src/main.py`)
- Pipeline orchestration → Video rendering: runs step six (evidence: `src/main.py`)
- Outline extraction → LLM provider factory: creates client (evidence: `src/pipeline/step1_outline.py`)
- Timeline generation → LLM provider factory: creates client (evidence: `src/pipeline/step2_timeline.py`)
- Clip scoring → LLM provider factory: creates client (evidence: `src/pipeline/step3_scoring.py`)
- Clip titles → LLM provider factory: creates client (evidence: `src/pipeline/step4_title.py`)
- Collection clustering → LLM provider factory: creates client (evidence: `src/pipeline/step5_clustering.py`)
- Outline extraction → Subtitle processing: uses text tools (evidence: `src/pipeline/step1_outline.py`)
- Timeline generation → Subtitle processing: uses text tools (evidence: `src/pipeline/step2_timeline.py`)
- Clip scoring → Subtitle processing: uses text tools (evidence: `src/pipeline/step3_scoring.py`)
- Clip titles → Subtitle processing: uses text tools (evidence: `src/pipeline/step4_title.py`)
- Video rendering → Media processing: uses media tools (evidence: `src/pipeline/step6_video.py`)
- LLM provider factory → DashScope client: selects provider (evidence: `src/utils/llm_factory.py`)
- LLM provider factory → SiliconFlow client: selects provider (evidence: `src/utils/llm_factory.py`)
- Configuration → LLM provider factory: selects provider (evidence: `src/utils/llm_factory.py`)
- DashScope client → AI providers: calls API
- SiliconFlow client → AI providers: calls API
- Bilibili downloader → Bilibili: downloads source (evidence: `README.md`)
- Configuration → HTTP API: configures service (evidence: `backend_server.py`)