---
title: 第 11 章 产品研究、原型、浏览器与视觉验证
seo:
  title: "产品研究与视觉验证流程指南"
description: "全面讲解产品研究方法、原型验证与浏览器视觉验证流程，帮助团队将决策问题、证据、洞察、MVP Spec与真实体验验证串成完整工作流。"
---

真正拉开差距的是把决策问题、证据、洞察、MVP Spec、实现与真实体验验证串成一条线，而不是生成一份看起来完整的竞品报告。

## 11.1 研究必须支持一个决策

| **研究类型** | **要回答的问题** | **最终动作** |
|----|----|----|
| **机会研究** | 痛点是否真实、频繁、值得付费？ | 做 MVP、先验证或停止 |
| **竞品研究** | 用户怎样替代？哪里满意或不满？ | 差异化、进入点与不做清单 |
| **技术可行性** | 当前架构、模型、数据和成本能否支撑？ | 方案、试点、风险与验证 |
| **需求澄清** | 当前版本到底交付什么？ | Spec、优先级、验收 |
| **上线验证** | 用户能否完成核心任务？哪里失败？ | 修复、灰度、回滚或继续 |

## 11.2 双工作台研究闭环

| **阶段** | **首选工具** | **主要动作** | **产物** |
|----|----|----|----|
| **定义问题** | Chat / Work | 采访、范围、时间窗、决策门槛 | Research Brief |
| **收集证据** | Work + Browser / Web；Claude/Codex 脚本 | 官网、帮助、价格、评论、访谈、代码、数据 | 证据目录与原始材料 |
| **结构化分析** | Work / Claude Code | 去重、标签、事实/推断分离、矩阵 | 事实表、竞品矩阵、JTBD |
| **生成机会** | Chat / Work | 痛点、空白、约束、替代方案 | 机会地图与假设 |
| **形成 Spec** | Work + Codex / Claude | MVP、流程、验收、风险 | SPEC.md 与任务树 |
| **原型实现** | Codex / Claude Code | 前后端、数据、脚本、测试 | 可运行 MVP |
| **真实验证** | Browser / Kimi WebBridge / Computer Use + 测试 | 走查、截图、异常、用户测试 | 证据化验收与下一轮 |

## 11.3 证据表：避免营销文案变成事实

| **字段**         | **说明**                                           |
|------------------|----------------------------------------------------|
| **Evidence ID**  | 唯一编号，便于在结论中引用                         |
| **来源与日期**   | 官网、帮助中心、评论、访谈、截图、日志、内部文档   |
| **原始内容**     | 保留必要摘录、截图位置或文件/行号                  |
| **证据类型**     | 官方声明 / 实测 / 用户观点 / 第三方分析 / 内部数据 |
| **适用范围**     | 版本、地区、套餐、用户群、时间窗口                 |
| **可信度与冲突** | 是否独立验证；是否与其他来源矛盾                   |
| **支持的结论**   | 这条证据能支持什么，不能支持什么                   |

## 11.4 竞品 Demo 与视觉采集

- 官网架构图、产品截图和 Demo 录屏只能说明厂商展示的路径，不自动证明真实交付能力。

- 采集时记录日期、URL、版本、套餐、登录状态、地区和是否为营销演示。

- 截图要覆盖入口、核心流程、成功、空数据、错误、权限和设置，不只截“最好看”的页面。

- 把视觉证据和文字结论一一对应；不确定或模糊内容不要强行识别。

- 在报告中明确图片版权与使用范围；内部研究与对外材料的使用标准不同。

## 11.5 用 Browser / Kimi WebBridge / Computer Use 验证原型

| **层次**     | **验证内容**                       | **证据**                  |
|--------------|------------------------------------|---------------------------|
| **可达**     | 能启动、能打开、路由正确           | URL、启动日志、截图       |
| **功能**     | 核心动作可完成，数据结果正确       | 操作步骤、请求/数据库结果 |
| **异常**     | 空、错误、超时、权限、重复提交     | 错误截图、日志、恢复行为  |
| **视觉**     | 布局、溢出、响应式、加载态、一致性 | 桌面/移动截图、对照设计   |
| **可访问性** | 键盘、焦点、语义、对比度、表单标签 | 自动检查 + 人工走查       |
| **性能**     | 关键路径延迟、资源与大数据量       | 测量脚本、环境、前后数据  |

> [!NOTE]
> 视觉“通过”不等于产品“通过”
>
> Computer Use 能看到页面并点击，但仍需要数据层、日志、权限、异常和可访问性证据。反过来，测试全部通过也不代表真实体验可用；两类验证必须合并。

## 11.6 Claude /design 与可编辑 UI 画布

Claude Code 在 2026 年 8 月提供 ``/design`` 研究预览，可生成可编辑 UI artboard。它适合快速探索页面与组件，但不是稳定的组织级设计系统替代品。原型进入正式开发前，仍应回到真实组件库、设计 token、浏览器验证和代码评审。

资料依据：Anthropic Week 34（2026-08-17 至 21）；功能状态为 research preview。

## 11.7 研究输出必须落到动作

| **证据结论** | **建议动作** | **Agent 下一步** |
|----|----|----|
| **痛点强、竞品覆盖差、可低成本验证** | 做 MVP | 生成最小 Spec、假设和 2 周实验 |
| **痛点存在但用户分群差异大** | 先验证 | 访谈提纲、招募、原型与成功门槛 |
| **需求明确但实现风险高** | 技术试点 | 最小技术路线、数据需求、失败标准 |
| **竞品已成熟、差异化弱** | 停止或换进入点 | 记录不做理由与新的细分假设 |
| **证据矛盾或不足** | 继续收集 | 列缺口、优先来源和停止条件 |

## 11.8 产品研究起手 Brief

> [!NOTE]
> **产品研究 Brief**
> ```markdown
> # 决策问题
> 这项研究要支持哪个具体决策？
>
> # 时间窗口
> 只研究最近 12 个月；所有变化标注日期。
>
> # 目标用户
> 行业、规模、角色、地区、成熟度。
>
> # 对象
> 竞品、替代方案、人工流程、内部旧方案。
>
> # 证据
> 官网 / 帮助 / 定价 / Demo / 评论 / 访谈 / 数据 / 代码。
>
> # 输出
> 1. 已验证事实
> 2. 关键洞察与反证
> 3. 机会与风险
> 4. MVP / 实验建议
> 5. 不做清单
> 6. 待验证与证据缺口
> ```