页面改造清单

Augmunt智能路由2025/12/27大约 5 分钟

页面改造清单

改造总览

页面	改造类型	工作量	复用率	优先级
首页 `/`	大改	⭐⭐⭐⭐	60%	P0
安装页 `/install/`	改造	⭐⭐⭐	70%	P0
定价页 `/pricing/`	调整	⭐⭐	90%	P0
导航结构	改造	⭐⭐	50%	P0
服务页 `/services/*`	重定向	⭐	-	P0

产品与服务

产品/服务	定位	入口
AgentDesk 客户端	面向所有用户的 AI 助手	首页 + 安装页主体
模型加速服务	AgentDesk 的底层技术，开发者可直接使用	安装页技术引出区

P0 页面详细方案

1. 首页改造 (/)

当前状态

布局：HomePage.vue
组件：AIHeroSection.vue, FeatureShowcase.vue, ServiceCard.vue
内容：AI 编程智能路由服务介绍

改造方案

Hero 区改造 (AIHeroSection.vue)：

项目	原内容	新内容
主标题	AI 编程智能路由	AgentDesk - AI 智能助手
副标题	让开发更智能	让工作学习与编程更智能
描述	提供 Claude、CodeX、Gemini 等 AI 服务的专业智能路由解决方案	智能操作文档、超长上下文理解、内置先进AI模型。下载即用，让AI成为你的得力助手
主 CTA	开始使用	下载客户端
次 CTA	查看定价	了解更多
统计数据	服务可用性、响应提升、活跃用户	支持格式(10+)、处理速度(3x)、活跃用户

保留：

星空背景动画
火箭交互动画
响应式布局

新增组件：

src/.vuepress/components/
├── ProductIntro.vue          # 产品核心介绍
├── DualScenarioShowcase.vue  # 双场景展示（工作学习+编程）
├── TechnologyAdvantage.vue   # 技术优势（融入路由服务）
├── ModelShowcase.vue         # 内置模型展示（卡片形式）
├── PricingCTA.vue            # 定价与下载CTA
└── DownloadButton.vue        # 下载按钮组件

新首页结构 (src/README.md)：

---
layout: HomePage
title: AgentDesk - AI 智能助手
description: 让工作学习与编程更智能的 AI 助手客户端
---

<AIHeroSection />

<ProductIntro />

<DualScenarioShowcase />

<TechnologyAdvantage />

<ModelShowcase />

<FeatureHighlights />

<PricingCTA />

核心卖点展示：

客户端免费 - 下载即用，无需付费
跨模型无缝切换 - Claude、Gemini、CodeX 会话不丢失，上下文完全复用
文件即知识库 - 拖拽文件即可使用
双场景支持 - 工作学习 + 编程
按量付费 - 无月费，用多少付多少

说明：

模型信息以卡片形式展示在首页，不单独开页面
技术优势（原路由服务价值）融入首页展示
功能特性在首页展示，不单独开页面

2. 安装页改造 (/install/)

当前状态

路径：/products/
布局：ChannelLayout.vue
组件：ProductsList.vue
内容：Claude、CodeX、Gemini 安装指引

改造方案

路径变更：

/products/ → /install/

设计理念：自然过渡

安装页以 AgentDesk 客户端为主体，通过技术优势自然引出模型加速服务：

用户下载 AgentDesk
       ↓
了解到 AgentDesk 底层技术（模型加速服务）
       ↓
开发者可选择直接使用 API

页面结构：

---
title: 安装
description: 下载 AgentDesk 客户端
layout: ChannelLayout
---

<!-- 主体：AgentDesk 客户端下载 -->
<AgentDeskDownload />

<!-- 技术说明 + 自然引出模型加速服务 -->
<TechInsight />

内容改造：

区域	内容
主体区	AgentDesk 客户端下载（平台选择、安装步骤、快速开始）
技术引出区	从技术优势自然过渡到模型加速服务

主体区：AgentDesk 客户端下载

产品介绍
平台选择卡片（Windows/Mac/Linux）
系统要求说明
安装步骤
快速开始指引
强调：客户端免费

技术引出区（TechInsight 组件）：

┌─────────────────────────────────────────────────────┐
│  💡 为什么 AgentDesk 又快又稳？                      │
│                                                     │
│  AgentDesk 底层采用我们自研的「模型加速服务」：       │
│  • 智能路由 - 自动选择最优节点                       │
│  • 高可用 - 99.9% SLA 保障                          │
│  • 负载均衡 - 峰值流量平滑处理                       │
│                                                     │
│  ─────────────────────────────────────────────────  │
│                                                     │
│  🔧 开发者选项                                       │
│                                                     │
│  想要将 AI 能力集成到您自己的应用中？                 │
│  可以直接使用模型加速服务 API                        │
│                                                     │
│  [查看 Claude API 配置 →]                           │
│  [查看 CodeX API 配置 →]                            │
│  [查看 Gemini API 配置 →]                           │
└─────────────────────────────────────────────────────┘

文案要点：

先解释 AgentDesk 为什么好用（技术优势）
引出这些优势来自"模型加速服务"
自然过渡：开发者也可以直接使用这个服务
提供 API 配置入口（可折叠或链接到详情）

3. 定价页调整 (/pricing/)

当前状态

布局：ChannelLayout.vue
组件：PricingTable.vue
内容：套餐定价

改造方案

重点强调：客户端免费！

项目	原内容	新内容
标题	定价与充值	AgentDesk 定价
核心卖点	套餐选择	客户端免费下载使用
描述	套餐，充值随心选	客户端免费，按模型使用量付费
付费模式	套餐	按量付费、无月费

复用现有页面：

保留 PricingTable.vue 组件
保留现有定价表格结构
调整文案和重点突出

新增内容：

在页面顶部醒目展示"客户端免费"
添加免费 vs 付费对比
添加按量付费说明
保留模型价格表
添加 FAQ

定价页核心信息：

🎉 AgentDesk 客户端完全免费下载使用

只需为实际使用的 AI 模型能力付费：
- 客户端免费 ✓
- 无月费 ✓
- 无订阅 ✓
- 用多少付多少 ✓

4. 导航结构改造

当前导航

// src/.vuepress/navbar/zh.ts
[
  { text: "首页", link: "/" },
  { text: "安装", link: "/products/" },
  { text: "定价", link: "/pricing/" },
  { text: "服务状态", link: "https://status.augmunt.com" },
  { text: "开始使用", link: "https://dash.augmunt.com" },
]

新导航

// src/.vuepress/navbar/zh.ts
[
  { text: "首页", icon: "house", link: "/" },
  { text: "安装", icon: "download", link: "/install/" },
  { text: "定价", icon: "coins", link: "/pricing/" },
  { text: "服务状态", icon: "circle-check", link: "/status/" },
  { text: "控制台", icon: "rocket", link: "https://dash.augmunt.com" },
]

5. 服务页删除 (/services/*)

当前状态

/services/claude - Claude 服务详情
/services/codex - CodeX 服务详情
/services/augment - Augment 服务详情

改造方案

全部删除，内容融入首页：

Claude、CodeX、Gemini 模型信息 → 首页 <ModelShowcase /> 组件
技术优势信息 → 首页 <TechnologyAdvantage /> 组件

配置 301 重定向：

/services/          → /
/services/claude    → /
/services/codex     → /
/services/augment   → /

组件复用清单

完全复用（无需修改）

组件	用途
`FooterSection.vue`	页脚
所有布局组件	页面布局

部分复用（需要修改文案）

组件	修改内容
`AIHeroSection.vue`	标题、描述、CTA、统计数据
`FeatureShowcase.vue`	特性内容、统计数据
`PricingTable.vue`	部分文案
`ProductsList.vue`	整合下载和配置两部分

需要新建

组件	用途
`ProductIntro.vue`	产品核心介绍
`DualScenarioShowcase.vue`	双场景展示
`TechnologyAdvantage.vue`	技术优势
`ModelShowcase.vue`	模型展示（卡片形式）
`PricingCTA.vue`	定价CTA
`DownloadSection.vue`	安装页的下载区
`ManualConfigSection.vue`	安装页的手动配置区

可删除

组件	原因
`ClaudeServiceDetail.vue`	内容融入首页
`CodexServiceDetail.vue`	内容融入首页
`AugmentServiceDetail.vue`	不再需要
`ServiceCard.vue`	改用 ModelShowcase

文档版本：v1.0
更新日期：2024年12月