1. 认识低保真原型
1.1 什么是低保真原型
低保真原型(Low-Fidelity Prototype,简称 Lo-Fi)是用最简化的视觉元素(线框、占位符、灰度形状)来表达产品界面结构与交互逻辑的设计产物。它不关注颜色、图标细节或最终视觉风格,只回答一个核心问题:“信息如何组织、用户如何完成任务?”
一句话定义:低保真原型是产品需求的“草图级”可交互表达,用于在正式 UI 设计前快速验证信息架构与核心流程。
1.2 与高保真原型的核心区别
| 对比维度 | 低保真原型 | 高保真原型 |
|---|---|---|
| 视觉精度 | 灰度、无细节、占位符代替真实内容 | 接近上线 UI,含品牌色、图标、真实文案 |
| 制作速度 | 10~30 分钟/屏 | 2~10 小时/屏 |
| 修改成本 | 拖拽、粘贴即时修改 | 需调整设计组件、重新导出 |
| 适用讨论对象 | 产品经理、工程师、早期用户 | 客户、管理层、最终验收方 |
| 交互模拟 | 简单跳转、点击区域触发 | 交互动画、过渡、响应式预览 |
| 反馈焦点 | 流程是否合理、功能是否缺失 | 视觉是否达标、品牌是否一致 |
1.3 适用场景(来自真实业务问题)
- 需求模糊期:业务方只说“要一个订单管理后台”,但不懂具体字段顺序。用低保真快速画 3 种布局方案,让业务直接指点。
- 跨角色对齐:开发说“这个步骤太复杂”,用低保真走查流程,直接撕掉 2 个中间页,节省 60% 开发量。
- 早期可用性测试:给 5 个目标用户看低保真线框图,发现“注册流程第 3 步输入验证码位置写错”,一页纸修改改好。
- 敏捷迭代:每次 Sprint 开始前,用 15 分钟产出一个低保真页面集合,让团队所有人都能看到下周要做什么。
1.4 核心价值
- 低成本试错:修改一个文本框位置只要 3 秒,不涉及像素对齐。
- 聚焦功能而非形式:避免团队过早纠结“这个按钮到底用#3498db还是#2980b9”。
- 加速共识达成的锚点:一张低保真线框比 1000 字需求文档更快让人明白“对或不对”。
- 需求变更的缓冲垫:当业务说“加一个筛选条件”,低保真可以直接拖入组件,设计资产零破坏。
产品需求型课程视角:本章后续所有章节都围绕“用户场景 → 业务问题 → 需求拆解 → 原型表达 → 交互流程 → 指标验证 → 验收标准”这条闭环展开。低保真原型正是这条闭环的起点表达工具。
1.5 产品需求型知识点速查
| 课程环节 | 对应本章内容 |
|---|---|
| 用户场景 | 产品经理与开发、业务方在需求早期无法对齐界面细节 |
| 业务问题 | 花大量时间做高保真却发现流程被推翻,返工成本高 |
| 需求拆解 | 先拆解为“信息分组、操作步骤、跳转逻辑”三层核心 |
| 原型表达 | 用灰度矩形、单色文字、简单箭头模拟点击区域 |
| 交互流程 | 核心页面的跳转路径,用线稿展示“A→B→C” |
| 指标验证 | 测试中判定“用户能否 30 秒内找到新增按钮”等任务完成率 |
| 验收标准 | 低保真走查后所有角色对流程无异议,修改点小于 3 处 |
| 交付物模板 | Figma 灰度组件库 + 线框图页面组 + 可点击原型链接 |
常见误区:不要把低保真原型做“干净”而加入灰度渐变或阴影。低保真越“丑”,团队越敢于提意见。一旦视觉上“看起来像成品”,非设计角色就会闭嘴,导致核心流程问题被掩盖。