产品侧页面结构草图

目标

本文档用于定义首版页面信息结构，帮助后续落地首页、套餐页、FAQ 和引导页。

以下为文字版草图，重点在结构和模块，不是视觉稿。

1. 首页落地页结构

页面结构

顶部导航
首屏 Hero
核心卖点区
使用场景区
三步使用流程
演示视频区
方案选择区
FAQ 简版
页脚

1.1 顶部导航

建议内容：

Logo / 产品名
功能介绍
套餐
FAQ
GitHub
登录
立即体验

1.2 首屏 Hero

左侧：

标题
副标题
主按钮
次按钮

右侧：

产品截图或播放动图

1.3 核心卖点区

建议 4 个卡片：

点句即读
逐句高亮
起播快
普通 CPU 可部署

1.4 使用场景区

建议 4 个场景卡片：

英语学习
论文阅读
教材精读
机构部署

1.5 三步使用流程

横向三列或竖向三步：

上传 PDF
点击句子
跟随听读

1.6 演示视频区

视频缩略图
播放按钮
一句辅助说明

1.7 方案选择区

三列：

免费版
Pro
私有部署

每列包含：

适合谁
核心权益
按钮

1.8 FAQ 简版

展示 4-6 条最常见问题。

1.9 页脚

建议包含：

产品简介
开源版入口
隐私政策
服务条款
联系方式

2. 套餐页结构

页面结构

页面标题
套餐卡片
功能对比表
私有部署说明
常见问题
联系入口

2.1 套餐卡片

三张卡片：

免费版
Pro 版
私有部署版

每张卡片包括：

名称
简介
核心权益
价格
按钮

2.2 功能对比表

建议对比：

每日额度
每月额度
单次文本长度
音色数量
并发任务数
优先支持
私有部署支持

3. FAQ 页面结构

页面结构

页面标题
分类导航
问题列表
联系支持

分类建议

产品能力
使用限制
文件与隐私
付费与部署

4. 新手引导结构

首次引导弹层

内容：

欢迎标题
三步说明
开始体验按钮

阅读器内引导

建议在以下位置做轻提示：

文件上传区域
句子区域
控制栏

5. 隐私政策页结构

页面结构

标题
生效日期
我们收集什么
为什么收集
如何存储
是否共享
用户权利
联系方式

6. 服务条款页结构

页面结构

标题
生效日期
服务内容
账号责任
禁止行为
付费说明
服务中断与变更
责任限制
联系方式

7. 页面跳转关系

建议关系：

首页 -> 注册/登录
首页 -> 演示视频
首页 -> 套餐页
首页 -> FAQ
首页 -> GitHub
套餐页 -> 注册/升级/咨询
FAQ -> 联系方式
页脚 -> 隐私政策/服务条款

8. 首版实现建议

首版不需要复杂交互，重点是：

结构清晰
价值表达明确
有明确 CTA
能支撑注册、试用、咨询

总结

页面结构草图的重点不是好看，而是先把信息流和转化路径理顺。对你这个项目来说，首页和套餐页是核心，FAQ、隐私政策、服务条款是支撑页面，新手引导则直接影响首次体验和留存。