ai-directory-platform/docs/AI-Directory-Platform开发计划与技术设计文档.md

# AI Directory Platform
## AI 目录站系统开发底座与产品化开发计划

**项目定位：** 可复用 AI Directory SaaS / 开源基础平台  
**基础项目：** `coolchange-ai/toolso-ai-open`  
**技术方向：** Next.js + React + TypeScript + PostgreSQL  
**核心目标：**

1. 基于现有 Toolso.AI 开源项目二次开发
2. 建立一个可复用的 AI Directory 基础底座
3. 支持多个不同视觉、不同定位的 AI 网站快速搭建
4. 建立用户注册、认证、投票、评论、收藏、提交工具等社区能力
5. 建立 SEO / Programmatic SEO 流量体系
6. 建立工具提交、认领、审核、排名、推广等商业化能力
7. 最终通过 5 个不同 UI / 产品形态验证底座的可复用性、稳定性和扩展性

---

# 一、产品战略

## 1.1 不要做成普通 AI 导航站

传统 AI 导航站的核心结构：

```text
首页
  ↓
分类
  ↓
工具列表
  ↓
工具详情
  ↓
外链
```

这种模式非常容易同质化。

本项目应该升级成：

```text
                    AI Directory Platform
                           │
       ┌───────────────────┼───────────────────┐
       ↓                   ↓                   ↓
   Discovery           Community           Content
       │                   │                   │
 搜索/分类/任务       Vote/Review/收藏      Blog/Guide/SEO
       │                   │                   │
       └───────────────────┼───────────────────┘
                           ↓
                    Tool / Product Data
                           │
             ┌─────────────┼─────────────┐
             ↓             ↓             ↓
          Ranking       Analytics      Monetization
             │             │             │
             ↓             ↓             ↓
          榜单系统       数据分析       推广/广告/会员
```

最终目标不是：

> “让用户看到 AI 工具。”

而是：

> **让用户通过搜索、任务、榜单、社区评价和内容找到最适合自己的 AI 工具。**

---

# 二、底座选择

## 2.1 基础项目

直接 Fork：

`coolchange-ai/toolso-ai-open`

该项目当前已经包含：

- Next.js 16
- React 19
- TypeScript
- Tailwind CSS
- Framer Motion
- Radix UI
- React Hook Form
- Zod
- Better Auth
- Google OAuth
- PostgreSQL
- Drizzle ORM
- Resend
- R2 / S3
- next-intl
- Blog / MDX
- Admin Panel
- Favorites
- Light / Dark Theme

因此不建议重新开发这些基础能力。

---

# 三、总体架构

建议把项目从：

```text
Toolso.AI
```

升级为：

```text
AI Directory Core
```

然后在 Core 上构建不同站点。

```text
                    AI Directory Core
                           │
       ┌───────────────────┼───────────────────┐
       │                   │                   │
       ↓                   ↓                   ↓
    Core UI             Core Data          Core API
       │                   │                   │
       ├── Header          ├── Tools           ├── Search
       ├── Cards           ├── Categories      ├── Vote
       ├── Filters         ├── Tags            ├── Review
       ├── Search          ├── Users           ├── Submit
       └── Detail          ├── Votes           ├── Ranking
                           └── Reviews         └── Analytics
```

然后：

```text
                    AI Directory Core
                           │
         ┌─────────────────┼─────────────────┐
         ↓                 ↓                 ↓
      Site A            Site B            Site C
      Directory         Product Hunt      Niche AI
      Style             Style             Style

         ↓                 ↓                 ↓

      Site D                              Site E
      Minimal                             Editorial
```

---

# 四、设计原则

## 4.1 禁止 Emoji

整个系统禁止使用：

- Emoji
- Unicode Emoji 图标
- 字符型图标
- `→`
- `←`
- `✓`
- `★`
- `♥`
- `●`
- 类似字符模拟 Icon

所有 UI 图标统一使用：

**Lucide Icons / SVG**
- Lucide 可以通过context7 mcp搜索
例如：

```tsx
import {
  Search,
  Heart,
  Star,
  ArrowUp,
  ChevronRight,
  ExternalLink,
  Plus,
  Settings,
} from "lucide-react";
```

图标规范：

```text
Icon
 ├── stroke-width: 1.8 ~ 2
 ├── currentColor
 ├── SVG
 ├── lucide-react
 └── 禁止手写 Unicode 图标
```

这样能够保证整个系统视觉统一。

---

# 五、设计系统

建立独立 Design System，而不是把 UI 写死在业务页面中。

## 5.1 Design Tokens

统一：

```text
Colors
Typography
Spacing
Radius
Shadow
Border
Motion
Breakpoints
Icon
Button
Input
Card
Badge
Dialog
Dropdown
Tabs
Pagination
```

例如：

```text
--color-background
--color-foreground
--color-muted
--color-border
--color-primary
--color-secondary

--radius-sm
--radius-md
--radius-lg
--radius-xl

--spacing-xs
--spacing-sm
--spacing-md
--spacing-lg
--spacing-xl
```

---

# 六、主题系统

必须支持：

```text
Light
Dark
System
```

主题切换不能只改变背景颜色。

需要完整适配：

- 页面背景
- Card
- Border
- Text
- Muted Text
- Input
- Dropdown
- Modal
- Tooltip
- Header
- Footer
- Code
- Blog
- Tool Detail
- Admin

---

# 七、响应式设计

必须 Mobile First。

支持：

```text
Mobile
Tablet
Desktop
Large Desktop
```

核心断点：

```text
< 640
640+
768+
1024+
1280+
1536+
```

重点测试：

```text
375 × 812
390 × 844
768 × 1024
1280 × 800
1440 × 900
1920 × 1080
```

---

# 八、核心数据模型

## 8.1 User

```text
User
├── id
├── name
├── username
├── email
├── avatar
├── bio
├── role
├── status
├── createdAt
└── updatedAt
```

Role：

```text
USER
EDITOR
MODERATOR
ADMIN
SUPER_ADMIN
```

---

# 九、认证系统

支持：

```text
Google
GitHub
Email
```

后续可扩展：

```text
Discord
X
Microsoft
Apple
```

Google 和 GitHub 登录属于第一阶段。

认证系统统一基于 Better Auth。

---

# 十、Tool 数据模型

核心实体：

```text
Tool
├── id
├── slug
├── name
├── tagline
├── description
├── logo
├── websiteUrl
├── screenshots
├── video
├── categoryId
├── pricing
├── foundedAt
├── status
├── verified
├── featured
├── createdAt
└── updatedAt
```

---

# 十一、Tool 分类系统

不要只做：

```text
AI Writing
AI Image
AI Video
AI Coding
```

应该同时支持：

## Category

```text
Writing
Image
Video
Audio
Coding
Marketing
Productivity
Research
Business
Education
Finance
Design
Automation
AI Agent
```

## Use Case

例如：

```text
写博客
制作 PPT
生成 Logo
视频剪辑
会议记录
生成字幕
写代码
SEO
客户支持
社交媒体
市场分析
```

## Audience

```text
Developers
Designers
Marketers
Students
Creators
Founders
Researchers
Business
Enterprise
```

这样可以建立三维发现体系：

```text
Category
+
Use Case
+
Audience
```

这比单纯分类更有 SEO 和产品价值。

---

# 十二、Pricing

统一：

```text
Free
Freemium
Free Trial
Paid
Contact
Open Source
```

支持：

```text
monthlyPrice
yearlyPrice
currency
hasFreePlan
hasFreeTrial
```

---

# 十三、Tool Detail 页面

Tool Detail 是整个网站最重要的 SEO 页面之一。

建议结构：

```text
Tool Header
├── Logo
├── Name
├── Tagline
├── Category
├── Pricing
├── Rating
├── Vote
├── Favorite
├── Visit Website
└── Share

Overview

Features

Use Cases

Pricing

Screenshots

Pros & Cons

Alternatives

User Reviews

Related Tools

Similar Tools

FAQ

Related Articles
```

---

# 十四、投票系统

这是整个项目非常重要的差异化功能。

参考 Product Hunt 的产品互动逻辑。

但不要简单做：

```text
Upvote = +1
```

建议建立：

```text
Vote
├── userId
├── toolId
├── value
├── createdAt
└── source
```

目前：

```text
value = 1
```

以后可以扩展：

```text
Like
Upvote
Downvote
```

---

# 十五、投票规则

必须登录才能投票。

用户：

```text
未登录
    ↓
点击 Vote
    ↓
Login
    ↓
完成 OAuth
    ↓
自动返回原页面
    ↓
Vote 成功
```

避免用户频繁刷票。

基础防刷：

```text
User ID
IP
Cookie
Session
Rate Limit
```

高级防刷：

```text
Vote velocity
Account age
IP reputation
Device fingerprint
Abnormal voting pattern
```

注意：

**不要让投票数量直接决定所有排名。**

---

# 十六、Ranking 系统

建立统一 Ranking Engine。

例如：

```text
score =
  voteScore
+ reviewScore
+ clickScore
+ favoriteScore
+ freshnessScore
+ qualityScore
```

可以设计：

```text
Trending
Popular
Most Voted
Most Saved
Most Viewed
Highest Rated
New
Editor's Choice
```

---

# 十七、Trending 算法

不要简单：

```text
votes DESC
```

建议：

```text
Trending Score
=
votes
× freshness
× velocity
× engagement
```

例如：

```text
过去 24 小时
过去 7 天
过去 30 天
```

这样新工具才有机会冲榜。

否则老工具会永久霸榜。

---

# 十八、用户评论

用户登录后：

```text
Rating
Review
Pros
Cons
Use Case
```

Review 数据：

```text
Review
├── userId
├── toolId
├── rating
├── title
├── content
├── pros
├── cons
├── status
├── helpfulCount
└── createdAt
```

---

# 十九、Review 可信度

必须避免：

```text
工具厂商自己刷评论
```

可以建立：

```text
Verified User
Verified Usage
Verified Purchase
Verified Owner
```

同时允许：

```text
Helpful
Report
```

---

# 二十、Tool Submission

用户可以：

```text
Submit AI Tool
```

提交：

```text
Name
Website
Description
Logo
Category
Use Cases
Pricing
Social Links
Screenshots
Founder
Contact
```

状态：

```text
Draft
Pending
Reviewing
Approved
Rejected
Published
Archived
```

---

# 二十一、Claim Listing

后期增加：

```text
Claim this tool
```

Tool Owner 可以认领工具。

认领后可以：

```text
修改介绍
修改价格
上传截图
增加视频
回复评论
查看 Analytics
申请 Featured
```

---

# 二十二、商业化

这是未来非常重要的一层。

可以设计：

```text
Free Listing
Verified Listing
Featured Listing
Sponsored
Homepage Placement
Category Placement
Newsletter
Editorial
```

但必须明确区分：

```text
Organic
Sponsored
Verified
Editor's Choice
```

避免影响用户对排名公正性的信任。

Futurepedia 当前已经形成 Basic Listing、Verified Listing 和 Enterprise 等商业化层级；AITopTools 也存在 Listing、Homepage Launch、Directory Growth 等商业模式。

---

# 二十三、SEO 架构

SEO 是整个项目最重要的流量来源之一。

必须从第一天设计。

---

## 23.1 Tool SEO

```text
/tools/chatgpt
/tools/midjourney
/tools/cursor
```

---

## 23.2 Category SEO

```text
/ai-tools/writing
/ai-tools/video
/ai-tools/image
/ai-tools/coding
```

---

## 23.3 Use Case SEO

这是重点。

例如：

```text
/ai-tools-for/blogging
/ai-tools-for/youtube
/ai-tools-for-seo
/ai-tools-for-students
/ai-tools-for-marketing
```

---

## 23.4 Comparison SEO

例如：

```text
/tools/chatgpt-vs-claude
/tools/cursor-vs-windsurf
/tools/midjourney-vs-flux
```

---

## 23.5 Alternative SEO

例如：

```text
/tools/chatgpt-alternatives
/tools/canva-alternatives
/tools/midjourney-alternatives
```

---

## 23.6 Collection SEO

例如：

```text
/best/ai-writing-tools
/best/free-ai-tools
/best-ai-video-generators
/best-ai-coding-tools
```

---

# 二十四、Programmatic SEO

这是整个底座最重要的设计之一。

不要把 SEO 页面写死。

建立：

```text
SEO Page Generator
```

输入：

```text
Category
Use Case
Audience
Pricing
Tool
```

自动生成：

```text
Title
Description
H1
Introduction
Tool List
FAQ
Related Categories
Related Tools
Schema
Internal Links
```

例如：

```text
Best AI Writing Tools for Marketing Teams

Best Free AI Writing Tools

Best AI Writing Tools for Students

Best AI Writing Tools for Bloggers

Best AI Writing Tools for SEO

Best AI Writing Tools in 2026
```

但必须避免大量低质量、重复模板页面。

---

# 二十五、结构化数据

支持：

```text
SoftwareApplication
Product
Review
AggregateRating
Article
BreadcrumbList
FAQPage
Organization
WebSite
```

---

# 二十六、内部链接系统

必须建立自动 Internal Linking。

例如：

```text
Tool
 ↓
Category
 ↓
Use Case
 ↓
Similar Tools
 ↓
Alternative
 ↓
Blog
```

最终形成：

```text
SEO Graph
```

而不是孤立页面。

---

# 二十七、搜索系统

第一阶段：

```text
PostgreSQL Search
```

第二阶段：

```text
Meilisearch
```

或者：

```text
Typesense
```

最终可以升级：

```text
Semantic Search
```

例如用户搜索：

> 帮我找一个可以自动制作 YouTube Shorts 的工具

系统不只是匹配：

```text
YouTube
Shorts
```

而是识别：

```text
Task = Video Creation
Platform = YouTube
Format = Short Video
```

然后推荐工具。

---

# 二十八、AI 推荐系统

后期加入：

```text
What are you trying to do?
```

用户输入：

```text
I need to create marketing videos.
```

系统输出：

```text
Recommended Tools
```

推荐因素：

```text
Use Case
Category
Pricing
Rating
Popularity
User Reviews
```

这会成为区别于传统导航站的重要能力。

---

# 二十九、内容系统

原有 Blog 保留。

但是升级成：

```text
Blog
Guides
Comparisons
Alternatives
Best Lists
Tutorials
News
Prompts
Resources
```

例如：

```text
Best AI Video Generators

10 Best AI Tools for YouTube

ChatGPT Alternatives

Best Free AI Writing Tools

AI Tools for Developers
```

---

# 三十、首页设计

不要简单：

```text
Header
Banner
Category
Tools
Footer
```

建议：

```text
Header

Hero
├── Main headline
├── Search
└── Popular searches

Trending Tools

Popular Categories

New AI Tools

Tools by Use Case

Editor's Picks

Community Rankings

Latest Reviews

Latest Articles

Newsletter

Footer
```

首页核心任务只有三个：

```text
Search
Discover
Explore
```

---

# 三十一、Header

Desktop：

```text
Logo
Discover
Categories
Collections
Rankings
Blog
Submit
Search
Theme
Login
```

Mobile：

```text
Logo
Search
Menu
```

所有图标使用 Lucide SVG。

---

# 三十二、Mobile

Mobile 不是 Desktop 缩小。

需要重新设计：

```text
Bottom Navigation
Search
Filter Drawer
Tool Card
Vote
Favorite
```

重点保证：

```text
Thumb friendly
One hand operation
Fast navigation
```

---

# 三十三、后台 Admin

Admin 应成为整个系统的内容运营中心。

Dashboard：

```text
Users
Tools
Submissions
Reviews
Votes
Traffic
Search
Revenue
```

Tool Management：

```text
Create
Edit
Review
Publish
Feature
Archive
Delete
Merge
```

---

# 三十四、审核系统

Submission：

```text
Pending
 ↓
Auto Validation
 ↓
AI Classification
 ↓
Human Review
 ↓
Publish
```

AI 可以自动识别：

```text
Category
Tags
Use Cases
Description
Pricing
Language
Duplicate
```

人工负责最终审核。

---

# 三十五、重复工具检测

用户提交工具时：

```text
Website URL
Domain
Tool Name
Embedding
```

进行重复检测。

例如：

```text
chatgpt.com
chat.openai.com
openai.com/chatgpt
```

不能形成三个工具。

---

# 三十六、数据采集系统

未来需要：

```text
Tool Discovery
Tool Import
Tool Update
Pricing Update
Broken Link Detection
Logo Update
Screenshot Update
```

建立：

```text
Crawler
 ↓
Parser
 ↓
Normalizer
 ↓
AI Classifier
 ↓
Duplicate Detection
 ↓
Review Queue
 ↓
Publish
```

---

# 三十七、Analytics

每个 Tool：

```text
Views
Clicks
Outbound Clicks
Favorites
Votes
Reviews
Search Impressions
```

后台可以看到：

```text
Tool CTR
Category CTR
Homepage CTR
Search CTR
```

这是未来商业化非常重要的数据。

---

# 三十八、事件系统

统一：

```text
tool_view
tool_click
tool_vote
tool_favorite
tool_review
tool_share
search
category_view
submit_tool
claim_tool
```

形成：

```text
Event
├── id
├── userId
├── sessionId
├── event
├── entityType
├── entityId
├── metadata
└── createdAt
```

---

# 三十九、通知系统

支持：

```text
In-app
Email
```

例如：

```text
你的工具已通过审核

你的工具获得新的 Vote

你的工具收到新的 Review

有人回复了你的 Review

你的工具进入 Trending
```

---

# 四十、分享系统

支持：

```text
Copy Link
X
LinkedIn
Facebook
Reddit
```

不要用 Unicode 字符作为社交图标。

统一 SVG Icon。

---

# 四十一、五套 UI 验证计划

底座完成后，必须真正做 5 个网站。

目的不是做 5 个完整商业项目。

而是验证：

```text
数据层是否通用
组件是否通用
SEO 是否通用
认证是否通用
Ranking 是否通用
Theme 是否通用
后台是否通用
```

---

# 方案 A：Classic AI Directory

定位：

> 最标准的 AI 工具导航站。

特点：

```text
大量 Tool
分类
搜索
筛选
排行榜
Trending
New
```

视觉：

```text
Clean
Dense
Professional
```

验证：

```text
Tool Grid
Filter
Search
Category
Pagination
```

---

# 方案 B：Product Hunt Style

定位：

> AI 产品社区。

核心：

```text
Daily Launch
Upvote
Comments
Maker
Ranking
Collections
```

首页：

```text
Today's AI Products

Product Feed

Top Products

Upcoming

Discussions
```

重点验证：

```text
Vote
User
Comment
Ranking
```

---

# 方案 C：Editorial AI

定位：

> AI 媒体 + 工具目录。

核心：

```text
Articles
Guides
Best Tools
Reviews
Comparisons
```

首页：

```text
Featured Story

Editor's Picks

Best AI Tools

Latest Articles

Popular Guides
```

重点验证：

```text
Blog
SEO
Editorial
Content
```

---

# 方案 D：Niche AI Directory

定位：

> 垂直行业 AI。

例如：

```text
AI for Developers
```

或者：

```text
AI for Marketing
```

核心：

```text
Tools
Use Cases
Workflows
Templates
Guides
```

重点验证：

```text
Use Case
Audience
Workflow
Recommendation
```

---

# 方案 E：Minimal AI Search

定位：

> 极简 AI 搜索引擎。

首页：

```text
Logo

What are you looking for?

[ Search AI Tools ]

Popular Searches
```

搜索后：

```text
Recommended Tools
```

重点验证：

```text
Search
Semantic Search
Recommendation
Performance
Mobile
```

---

# 四十二、五个网站验证标准

每个站都必须使用同一个：

```text
Database
Auth
Admin
Tool Model
User Model
Vote System
Review System
Search
SEO Engine
Analytics
```

只改变：

```text
Theme
Layout
Navigation
Components
Content
Brand
```

如果需要大量修改 Core 代码才能完成第五个站：

> 说明底座架构失败。

---

# 四十三、组件架构

建议：

```text
src/
├── app/
├── components/
│   ├── ui/
│   ├── layout/
│   ├── navigation/
│   ├── tool/
│   ├── voting/
│   ├── review/
│   ├── search/
│   └── content/
│
├── features/
│   ├── auth/
│   ├── tools/
│   ├── categories/
│   ├── voting/
│   ├── reviews/
│   ├── ranking/
│   ├── search/
│   ├── submission/
│   ├── claim/
│   ├── analytics/
│   └── seo/
│
├── lib/
│   ├── auth/
│   ├── db/
│   ├── search/
│   ├── ranking/
│   ├── seo/
│   └── analytics/
│
└── themes/
    ├── classic/
    ├── product/
    ├── editorial/
    ├── niche/
    └── minimal/
```

---

# 四十四、Feature First 架构

不要：

```text
components
utils
pages
```

全部混在一起。

推荐：

```text
features/tools
features/voting
features/reviews
features/ranking
```

每个 Feature 自己管理：

```text
components
actions
queries
schemas
types
utils
```

这样以后拆模块非常容易。

---

# 四十五、API 架构

核心 API：

```text
GET    /api/tools
GET    /api/tools/:slug

POST   /api/tools
PATCH  /api/tools/:id
DELETE /api/tools/:id

POST   /api/tools/:id/vote
DELETE /api/tools/:id/vote

POST   /api/tools/:id/favorite
DELETE /api/tools/:id/favorite

GET    /api/tools/:id/reviews
POST   /api/tools/:id/reviews

POST   /api/submissions
POST   /api/tools/:id/claim

GET    /api/rankings
GET    /api/search
```

---

# 四十六、数据库核心关系

```text
User
 │
 ├── Vote ─────── Tool
 │
 ├── Review ───── Tool
 │
 ├── Favorite ─── Tool
 │
 └── Submission

Tool
 │
 ├── Category
 ├── Tags
 ├── UseCases
 ├── Reviews
 ├── Votes
 ├── Favorites
 └── Analytics
```

---

# 四十七、性能要求

目标：

```text
LCP < 2.5s
INP < 200ms
CLS < 0.1
```

核心页面：

```text
Homepage
Category
Search
Tool Detail
Blog
```

必须：

```text
Server Components First
Image Optimization
Lazy Loading
Pagination
Caching
ISR
Database Index
```

---

# 四十八、缓存策略

例如：

```text
Tool Detail
Category
Ranking
Homepage
```

可以：

```text
ISR
revalidate
Cache
```

而：

```text
Vote
Review
Favorite
```

使用实时请求。

---

# 四十九、安全

必须：

```text
Rate Limiting
CSRF
XSS
SQL Injection Protection
Input Validation
OAuth Security
Session Security
Admin RBAC
Audit Log
```

所有用户输入：

```text
Zod
```

统一验证。

---

# 五十、反作弊

尤其是 Vote。

建立：

```text
Rate Limit
IP Limit
Account Age
Vote Velocity
Duplicate Detection
Suspicious Account
```

管理员：

```text
Vote Audit
```

可以查看：

```text
User
IP
Timestamp
Tool
Action
```

---

# 五十一、SEO 流量战略

最终流量来源应该形成：

```text
Google
   ↓
SEO Landing Page
   ↓
Category / Use Case
   ↓
Tool
   ↓
Related Tools
   ↓
More Pages
```

同时：

```text
Google
 ↓
Blog
 ↓
Tool
 ↓
Category
```

以及：

```text
Google
 ↓
Comparison
 ↓
Tool
```

---

# 五十二、SEO 页面矩阵

至少建立：

```text
Tool Pages
Category Pages
Use Case Pages
Audience Pages
Best Pages
Alternative Pages
Comparison Pages
Blog Pages
Guide Pages
```

形成：

```text
8 × N
```

的可扩展 SEO 页面体系。

---

# 五十三、流量增长模型

第一阶段：

```text
SEO
```

第二阶段：

```text
User Generated Content
```

第三阶段：

```text
Community
```

第四阶段：

```text
Newsletter
```

第五阶段：

```text
Social Distribution
```

第六阶段：

```text
Tool Owner Distribution
```

---

# 五十四、最重要的增长闭环

必须建立：

```text
Tool Owner
      ↓
Submit Tool
      ↓
获得 Listing
      ↓
分享 Listing
      ↓
带来用户
      ↓
用户 Vote / Review
      ↓
Tool Ranking 上升
      ↓
更多流量
      ↓
Tool Owner 更愿意提交
```

这是比单纯 SEO 更重要的增长飞轮。

---

# 五十五、Newsletter

保留现有 Resend。

增加：

```text
Weekly AI Tools
New AI Tools
Trending AI Tools
Editor's Picks
```

Newsletter 不是简单：

```text
订阅成功
```

而是成为：

```text
Traffic Retention
```

渠道。

---

# 五十六、商业模式

第一阶段不要急着收费。

先建立：

```text
Traffic
Users
Tools
Reviews
Votes
```

之后：

```text
Free Listing
      ↓
Verified Listing
      ↓
Featured
      ↓
Sponsored
      ↓
Advertising
      ↓
Enterprise
```

---

# 五十七、第一阶段 MVP

MVP 必须包含：

```text
Tool Directory
Category
Search
Filter
Tool Detail
Google Login
GitHub Login
Favorite
Vote
Review
Submit Tool
Admin
Theme
i18n
SEO
Blog
Analytics
```

---

# 五十八、V1

增加：

```text
Ranking
Trending
Claim Tool
User Profile
Collections
Alternative
Comparison
Newsletter
Advanced SEO
```

---

# 五十九、V2

增加：

```text
Semantic Search
AI Recommendation
Automatic Tool Import
Automatic Classification
Duplicate Detection
Tool Health Check
Advanced Analytics
Monetization
```

---

# 六十、V3

最终变成：

```text
AI Directory Platform
```

支持：

```text
Multi Site
Multi Brand
Multi Theme
Multi Locale
Multi Tenant
```

也就是：

```text
一个 Core
    ↓
多个 AI Directory
```

---

# 六十一、开发阶段

## Phase 0：底座审计

时间：

**2~3 天**

工作：

```text
Clone Repository
Run Project
Review Architecture
Review Database
Review Auth
Review UI
Review Admin
Review SEO
Review i18n
```

输出：

```text
Architecture Audit
Technical Debt List
Refactor Plan
```

---

# 六十二、Phase 1：Design System

时间：

**3~5 天**

完成：

```text
Theme
Typography
Color
Spacing
Icon
Button
Card
Input
Modal
Dropdown
Tabs
Toast
Skeleton
```

同时建立：

```text
Lucide Icon Rule
```

严格禁止：

```text
Emoji
Unicode Icon
HTML Entity Icon
```

---

# 六十三、Phase 2：Core Data

时间：

**4~7 天**

完成：

```text
Tool
Category
Tag
UseCase
Pricing
User
Vote
Review
Favorite
Submission
Claim
```

数据库 Migration。

---

# 六十四、Phase 3：Community

时间：

**5~7 天**

完成：

```text
Google
GitHub
Profile
Vote
Favorite
Review
Comment
User Activity
```

---

# 六十五、Phase 4：Ranking

时间：

**3~5 天**

完成：

```text
Trending
Popular
Most Voted
Most Saved
Highest Rated
New
Editor's Choice
```

建立 Ranking Engine。

---

# 六十六、Phase 5：Submission

时间：

**3~5 天**

完成：

```text
Submit
Review
Approve
Reject
Edit
Claim
```

---

# 六十七、Phase 6：SEO

时间：

**5~8 天**

完成：

```text
Metadata
Sitemap
Robots
Schema
Canonical
Breadcrumb
Internal Linking
Category SEO
Use Case SEO
Alternative
Comparison
```

---

# 六十八、Phase 7：Search

时间：

**3~5 天**

第一版：

```text
PostgreSQL Search
```

后续：

```text
Meilisearch
```

---

# 六十九、Phase 8：Analytics

时间：

**3~5 天**

完成：

```text
Page View
Tool View
Outbound Click
Vote
Favorite
Search
Review
Submission
```

---

# 七十、Phase 9：五套 UI

时间：

**10~15 天**

依次实现：

```text
Classic
Product Hunt
Editorial
Niche
Minimal Search
```

---

# 七十一、Phase 10：压力测试

测试：

```text
100 tools
1,000 tools
10,000 tools
100,000 tools
```

测试：

```text
Search
Category
Ranking
Vote
Review
Homepage
Sitemap
```

---

# 七十二、Phase 11：上线

推荐：

```text
Vercel
+
PostgreSQL
+
R2
+
Resend
```

现有项目本身已经提供 Vercel / Docker 的部署路径。

---

# 七十三、建议的项目里程碑

```text
M1
基础架构稳定

M2
Design System 完成

M3
Tool Directory 完成

M4
Auth + User 完成

M5
Vote + Review 完成

M6
Ranking 完成

M7
Submission + Claim 完成

M8
SEO Engine 完成

M9
Search 完成

M10
Analytics 完成

M11
UI Theme A

M12
UI Theme B

M13
UI Theme C

M14
UI Theme D

M15
UI Theme E

M16
性能、安全、SEO、上线
```

---

# 七十四、验收标准

## UI

```text
所有图标 SVG
所有图标 Lucide
无 Emoji
无 Unicode Icon
无字符箭头
Responsive
Light/Dark
```

## Functional

```text
Google Login
GitHub Login
Vote
Favorite
Review
Submit
Claim
Search
Filter
Ranking
```

## SEO

```text
SSR
Metadata
Sitemap
Schema
Canonical
Internal Linking
```

## Performance

```text
LCP < 2.5s
INP < 200ms
CLS < 0.1
```

## Security

```text
RBAC
Rate Limit
Input Validation
Audit Log
Anti Spam
Anti Vote Abuse
```

---

# 七十五、最重要的架构原则

未来开发过程中必须坚持：

### 原则 1

**Core 与 Site Theme 分离。**

不要：

```text
if site === "xxx"
```

满天飞。

应该：

```text
Theme
Layout
Component Variant
```

---

### 原则 2

**业务逻辑与 UI 分离。**

例如 Vote：

```text
useVote()
```

不应该知道：

```text
Button 长什么样
```

---

### 原则 3

**Ranking Engine 独立。**

未来可以：

```text
Product Hunt Ranking
AI Directory Ranking
Editor's Ranking
Sponsored Ranking
```

---

### 原则 4

**SEO Engine 独立。**

让任何站点都可以：

```text
generateSEOPage()
```

---

### 原则 5

**内容模型不要写死。**

Tool、Category、Use Case、Audience、Collection 都应该可以组合。

---

# 七十六、推荐的最终产品模型

最终不要把系统理解成：

```text
AI Tools Directory
```

而应该理解成：

```text
                    AI Discovery Platform
                            │
        ┌───────────────────┼───────────────────┐
        │                   │                   │
    Directory            Community           Content
        │                   │                   │
     Tools              Vote/Review        Blog/Guide
        │                   │                   │
        └───────────────────┼───────────────────┘
                            │
                       Recommendation
                            │
                       Ranking Engine
                            │
                       Search Engine
                            │
                       SEO Engine
                            │
                       Analytics
                            │
                       Monetization
```

---

# 七十七、最终目标

第一阶段：

> 做一个比普通 AI 导航站更现代的 AI Directory。

第二阶段：

> 做一个有用户行为和社区机制的 AI Product Discovery 平台。

第三阶段：

> 做一个能够通过 SEO、UGC、Ranking、Review、Submission 自增长的流量平台。

最终：

> **同一套 Core，可以快速生成不同品牌、不同视觉、不同垂直领域的 AI Directory。**

---

# 七十八、开发优先级

最终优先级建议严格按照：

```text
P0

基础架构
Design System
Tool
Category
Search
SEO
Auth
Admin


P1

Vote
Favorite
Review
Ranking
Submission
Claim
User Profile


P2

Collections
Comparison
Alternative
Newsletter
Analytics


P3

Semantic Search
AI Recommendation
Auto Classification
Crawler
Tool Health
Advanced Ranking


P4

Monetization
Sponsored
Featured
Enterprise
Multi Tenant
```

---

# 七十九、第一版不要做的东西

为了避免项目失控，第一版暂时不要做：

```text
复杂 AI Chat
复杂推荐模型
完整广告平台
复杂会员系统
复杂支付系统
实时聊天
过度复杂社交关系
过度复杂积分系统
```

第一版真正需要验证的是：

```text
用户能不能找到工具
用户愿不愿意 Vote
用户愿不愿意 Review
Tool Owner 愿不愿意提交
Google 能不能大量收录
SEO 页面有没有流量
五套 UI 能不能共用 Core
```

---

# 八十、最终验收目标

整个项目完成后，需要得到：

```text
AI Directory Core
│
├── Auth
├── User
├── Tool
├── Category
├── Use Case
├── Search
├── Vote
├── Review
├── Favorite
├── Ranking
├── Submission
├── Claim
├── Analytics
├── SEO
├── Blog
├── Newsletter
├── Admin
├── Theme
└── i18n
```

然后：

```text
             AI Directory Core
                    │
       ┌────────────┼────────────┐
       ↓            ↓            ↓
   Classic       Community    Editorial
       │            │            │
       └────────────┼────────────┘
                    ↓
              Niche Directory
                    │
                    ↓
               AI Search
```

如果这五套产品都能够在不修改核心业务逻辑的情况下快速完成，那么这个项目才算真正完成了“**AI Directory 开发底座**”的目标。

---

# 八十一、最终产品战略结论

这个项目最值得投入的不是：

```text
把页面做得像 Toolify
```

而是建立四个核心资产：

```text
1. Tool Data
2. User Community
3. SEO Page Graph
4. Ranking / Recommendation Engine
```

其中：

**Tool Data 是内容资产。**

**User Community 是增长资产。**

**SEO Page Graph 是流量资产。**

**Ranking / Recommendation Engine 是产品壁垒。**

UI 只是这四个资产的不同表现形式。

所以五套 UI 的验证意义非常重要：

> **如果五套完全不同的网站都能够复用同一套 Tool、User、Vote、Review、Ranking、SEO、Search 和 Admin，那么这个项目就不再是一个 AI 导航站，而是一套真正可以持续孵化 AI 流量网站的基础设施。**

## 最后要求
- 完成底坐后，搞个5个不同UI, 类型的AI网站来验证底坐的`快速, 易用, 可用, 可靠`