截图需求清单 - PDF Connect v3 文 档
优先级 1：核心工作流（必须提供）📸
主应用界面
- PDF Connect v3 控制台 - 展示现代设计的主界面
- PDF 库管理 - 含搜索、标签、批量操作的网格视图
- PDF 详情页 - 单个 PDF 的视图，突出显示"关联"按钮
全站关联
- 页面类型下拉菜单 - 所有支持的页面类型（产品、分类、文章、页面、首页、搜索）
- 资源选择弹窗 - 搜索栏、资源列表、分页、批量选择
- 关联进行中 - 加载状态与确认提示
- 已关联资源展示 - 已连接的页面及取消关联选项
发布系统
- 发布选项弹窗 - 三种展示样式并排显示
- 主题编辑器集成 - 向模板添加 PDF 区块
- 区块配置 - 每种展示类型的设置面板
展示样式实际效果
- 嵌入式 PDF 示例 - 包含嵌入 PDF 的产品页面
- PDF 按钮示例 - 弹出覆盖层打开状态下的按钮
- PDF 列表示例 - 有组织地列出多个 PDF
优先级 2：高级功能（重要）📸
多区块策略
- 多区块产品页面 - 同一页面同时展示嵌入式 + 按钮 + 列表
- 模板状态概览 - 已配置区块的模板列表
- 批量选择界面 - 已选中多个项目并显示计数
移动端体验
- 移动端 PDF 浏览 - 三种展示样式在移动设备上的效果
- 移动端管理界面 - 在移动端进行关联与发布操作
- 响应式行为 - PDF 如何适配不同屏幕尺寸
工作流示例
- 前后对比 - 新旧界面对比
- 跨页面关联 - 同一 PDF 关联到多种页面类型
- 搜索功能 - 实时搜索结果展示
优先级 3：辅助内容（锦上添花）📸
使用场景示例
- 产品文档 - 技术手册的集成展示
- 分类目录 - 含 PDF 目录的分类页面
- 博客资源 - 含可下载 PDF 的文章页面
- 首页展示 - 首页上的公司宣传册
错误与边缘情况
- 加载状态 - 操作执行中用户所见的界面
- 错误提示 - 清晰的错误信息展示
- 空状态 - 新用户在添加内容前所见的界面
数据分析与性能
- 使用数据分析 - PDF 互动指标（如有）
- 性能指标 - 速度与优化数据
- 模板分析 - 使用最频繁的模板统计
截图规格说明
技术要求
- 分辨率：高清（HiDPI），确保文档中显示清晰
- 浏览器：Chrome 或 Safari，保持渲染一致性
- 窗口尺寸：标准桌面端（1920x1080）及移动端（375x812）
- 主题：使用简洁、专业的 Shopify 主题进行演示
内容要求
- 示例 PDF：真实业务文档（手册、目录、指南）
- 测试店铺：填充与主题相关的产品、分类、文章、页面内容
- 整洁数据：专业命名、规范描述、有条理的内容组织
品牌要求
- 界面统一：所有截图应展示相同版本的应用
- 专业外观：界面呈现整洁、有组织
- 重点突出：清晰展示所演示的具体功能
截图工作流程
准备阶段
- 搭建包含真实内容的测试店铺
- 创建具有专业命名的示例 PDF
- 配置所有三种展示样式
- 确保所有功能正常运行
拍摄阶段
- 以全分辨率截取桌面端截图
- 拍摄关键界面的移动端版本
- 记录加载与错误状态
- 在适当位置进行前后对比拍摄
处理阶段
- 裁剪以聚焦相关界面元素
- 在有帮助的地方添加标注与说明
- 确保所有图片具有统一的视觉风格
- 优化文件大小以适应网页加载
在文档中的使用方式
放置策略
- 主图：在文档开头展示重要的界面变化
- 分步图示：教程中每个操作步骤均配图
- 对比图：对重大改进进行前后对比
- 参考图：快速直观地确认位置与外观
替代文本要求
所有截图均需提供描述性替代文本以满足无障碍访问需求：
- 描述界面中展示的内容
- 包括图中可见的关键文字
- 注明重要的界面元素或操作
- 尽量控制在 125 个字符以内
文件命名规范
使用统一命名，便于管理：
pdf-guru-v3-[功能]-[上下文].png- 示例：
pdf-guru-v3-linking-page-types.png - 示例：
pdf-guru-v3-display-embedded-product.png
这套系 统化的方法确保了完整的视觉文档，与我们增强版 PDF Connect v3 功能的质量相匹配。