用户体验设计成长之路

眼界开阔、知识面广
懂产品、运营、推广等方面的相关知识。相互理解、互 相促进、
好的设计师
乐于分享
分享，学习、交流
糟糕的设计师
缺乏兴趣、
A
不用心
时间估
D
算不准
心态不好、
B
顽固任性
不会恰
E
当表现
不会合理
C
安排时间
过于
F
被动
糟糕的设计师
沟通及团 队协作能 力差
学习意愿 不强
不够专业
糟糕的设计师
心态不好、顽固任性
10 贴心的设计
贴心的设计
可控的感受 积极的反馈 贴心的提醒
界面预先提供提示，形成操作预期（加载进 度，关闭前的确认、即时状态）
给予反馈和鼓励提醒
注册、填写信息时的小提示，改变界面元素 状态（改变颜色，降低饱和度）
11 标准的原型内容
标准的原型内容
0 1
简要说明与信息 结构
0 2
任务流程与页面 流程
https://www.wps.cn
01
观察、留意人的日常，思考背后原因，归纳人的 共性
02
积累自己的知识面和思考深度（多度优秀著作-设计专业、人文历史），了解人性。
用户体验设计的精益之道
理性的思路
认清设计的本质，为谁设计，解 决什么问题，如何解决，增加趣 味
用户体验设计的精益之道
亲自使用、体验
实际项目的工作流程
01
分析需求、了解需求
什么样的产品，目标用 户是谁，要达到什么的 效果，具体有哪些功能、 内容
02
设计规划、实施
草图上梳理信息架构， 设计任务流程，设计界 面，确认ok后将设计方 案呈现
03
项目跟进
设计师跟进后续的视觉、 前端、开发、测试环节， 确保产出物和设计方案 一致
04
成果检验
上线后需要对产品进行 体验、效果检验。及时 解决小问题。大问题留 到下次迭代时解决
04 产品定位
产品定义
01 使用人群
产品为谁服务，所 有的功能、内容、 设计风格的设定都 围绕这类人群进行
02 主要功能
划定给你的范围和 限制
03 产品特色
区别于同类竞争者， 让产品脱颖而出
产品定位
01 目标 用户
02 使用 场景
03 用户 目标
用户需求
05
需求从哪儿来 （最好是前期设计师配 合产品经理共同完成）
用户调研
深入了解目标用户在真是使用下感受、痛点、期望
问卷调查 用户访谈 信息采集
需求从哪儿来 （最好是前期设计 师配合产品经理共同完成）
用户反馈
了解用户使用中存 在的问题
竞品分析
有代表性的同类产品，对比产品之间的优势、劣势， 找到产品的突破口
好的设计师
有天分
学习天分很重要
好的设计师
执行力强
不仅要有好的想法，还要坚持执行到底，不惧怕任何阻 碍
好的设计师
情商高
换位思考、愉快沟通
好的设计师
超出预期
追求完美，关注细节，思考的更 多
好的设计师
有条理
井然有序，清晰明了
好的设计师
有上来自百度文库心
自我学习和提高的意识很强，抽出时间学习、 交流
好的设计师
设计师的品牌意识
01
保证关 联性
02
力求一 致性
03
追求独 特性
04
品牌宣传 无处不在
设计师的品牌意识
保证关联性
追求独特性
力求一致性
品牌宣传无处不 在
01
应用内 一致
04
亲密接 触
设计师的品牌意识
力求一致性
02
衣着品 味
05
平台内 一致
03
表里如 一
06
平台间 一致
设计师的品牌意识
力求一致性
内部产品一致
将前期的需求分析到 后期的设计表达过程 展示 用户调研的结 果、支撑的数据、竞 品分析、设计实施前 制定的目标
做好会议邀请工作
主导流程
提高效率， 控制话题
区分和收 集有价值 的反馈意 见
做设计评审的主导者
在评审中掌握主动权
做设计评审的主导者
评审后的分析与跟进
项目跟进 （保障设计效果的实现）
审核视觉稿
在否定中 积极成长
设计师的自我修养
好的设计师 VS 糟糕的设计师
好的设计师
糟糕的设计 师
哪几方面来 提高
好的设计师
对设计充满 兴趣和激情
A
有天分
B
执行力强
C
情商高
D
超出预期
E
有条理
F
好的设计师
01 有上进心
02
眼界开阔、 知识面广
03 乐于分享
好的设计师
对设计充满兴趣和激情
平时积累各种优秀案例，认真观察生活中的细 小闪光点
遇到问题先抱怨，不是去积极思考原因和解决 办法
糟糕的设计师
不会合理安排时间
拖延散漫，效率底下
糟糕的设计师
不会恰当表现
不懂得与别人沟通、宣传、推进你的方 案
糟糕的设计师
沟通及团队协作能力差
自我意识过强
好的设计师 VS 糟糕的设计师
哪几方面来提高
学习专业知识，专业技能、还需 要良好的沟通、组织能力、流程 意识
项目流程
测试
A
走查
B 上线
项目流程
研究 交互设计参与
用户研究 竞品分析 用户角色
项目流程
概念Demo
Demo评审
项目流程
产品立项
产品定义 需求文档 需求评审 立项会议 排期
项目流程
交互设计
竞品分析 低保真交互 可用性测试 交互评审 高保真交互
项目流程
视觉设计
竞品分析 视觉设计 视觉评审
项目流程
线框图心得
遵守栅格规范
栅格设计系统
线框图心得
表达清楚UI逻辑
操作 》链接 》文本 》 重要 》普通 》不重 要》
13
项目跟进 （保障设计效果的实现）
项目跟进 （保障设计效果的实现）
做设计评审 的主导者
审核视觉稿
开发阶段的 持续跟进
项目跟进 （保障设 计效果的实现）
做设计评审的主导者
评审前的充足 准备
需求文档
项目时间安排
合适启动、合适安排
需求文档
信息结构
简单理解：内容或页面的层 级
需求文档
整体业务流程说明
对于操作多的产品/功能，需要业务流程 图
需求文档
需求详细说明
需求的详细说明
07
设计师易忽略的工作意识
设计师易忽略的工作意识
设计师的品 牌意识
设计师的沟 通意识
设计师的流 程意识
设计师易忽略 的工作意识
拟定产品战略、方向 怎么做用户体验，怎么处理逻辑、 界面层级、界面细节 规划、功能、设计细节
产品数据
产品上线后，预先埋点，收集产品的后期数据 常规的访问浏览数据
浏览痕迹 点击痕迹 在每个页面上的浏览时长 整体的浏览顺序 等等 百度指数、淘宝指数等工具
06 需求文档
A
文档修改 与审核记
录
D
用户类型 和特征
设计师的品牌意识
追求独特性
个性的标 志
独特的风 格
亮眼的细 节
设计流 程
设计师易忽略的工作意识
设计师的流程意识
项目流 程
设计师的流程意识
需求 分析
信息 架构
任务 流程
页面 草图
标准 原型
设计流程
A
研究 交 互设计参
与
D
交互 设计
项目流程
B
概念 Demo
E
视觉 设计
C
产品 立项
F
前端/后 台开发
用户体验设计师的成长之路
演讲人
2020-11-14
01
用户体验设计的精益之道
用户体验设计的精益之道
了解人、观察 人，做到以 “人\"为本， 为”人“设计
理性的思路
亲自使用、体 验
多听用户的反 馈意见
留心好设计， 优化
用户体验 设计的精 益之道
了解人、观察人，做到 以“人\"为本，为”人 “设计
线框图心得
考虑视觉 实现后的 效果
了解视觉 趋势
线框图心得
通过明暗对比表达
突出界面元素的优先级
线框图心得
不使用截图与颜色
不必要对视觉设计师产生干 扰
线框图心得
合理的布局
保持简单的结构，避免 出现2列和3列的混排的 设计 （建议在确定界面 布局时，提前和视觉设 计师沟通商量，避免不 必要的返工）
别害怕 被否定
适度妥 协
设计师的自我修养
在否定中积极成长
学会忍 耐和付 出
超越自 我
识别真 相
健康的 心态
在否定中积极成长
A
别害怕 被否定
D
适度 妥协
B
学会忍耐 和付出
E
超越 自我
C
识别 真相
F
健康的 心态
感谢聆听
竞品界面
“抄袭”竞品的需求分析过程
01 用户调 研
02 竞品分 析
03 用户反 馈
04 产品数 据
设计目标
“抄袭”竞品的需求分析过程
功能
内容
优先级
设计需求
09
友好而易用的界面--简化复杂的操作
友好而易用的界面--简化复杂的操作
减少冗余步骤和干扰 项
将复杂操作转移给系 统
简化操作方式
优化操作过程
需求文档
B
目录
E
项目时 间安排
C
背景 描述
F
信息 结构
需求文档
整体业务流 程说明
1
需求详细说 明
2
需求文档
文档修改与审核记录
如有修改，需要简要记录
需求文档
目录
内容过多情况下
需求文档
背景描述
为什么要做这个产品/模块、市场行情、业务目标、产 品定位
需求文档
用户类型和特征
简要描述目标用户情况或现有使用人群的情 况
操作
常见操作
正常操作时的反馈状 态（普通、聚焦、鼠 标悬停、点击后、初 始状态等）
误操作
主要指当用户操作错 误时的情况。设计时 尽量避免用户犯错的 机会
手势操作
用户使用移动产品是 的操作方式，点击、 双击、长按等等等等
特殊操作
指一些极端情况下的 操作
2011
2012
2013
2014
反馈
提示
操作后，系统给用户的文字说 明
评审后的分析 与跟进
1
2
3
4
设计评审的目 的
在评审中掌握 主动权
设计评审的目的
检验目标
检验设计方案是否 达成了最初确定的
目标
发现问题
发现问题和风险 （是否存在缺陷、 技术可行、其他风
险点等等）
达成共识
让项目成员达成共识， 顺利进入下一个环节
评审前的充足准备
事先考虑所有可能 的方案
准备各种设计依据
0 3
线框图&交互说 明 （处静态 页面外，还需要 考虑各种动态情 况；除正常情况 外，还需要考虑 特殊和错误情况）
标准的原型内容
A
变更 日志
B
版本 说明
C
信息 结构
简要说明与信息结构
简要说明与信息结构
变更日志
日期、变更内容、变更原因、 备注
信息结构
产品内容、产品的逻辑等等
版本说明
以版本为单位，版本说明包含版本号、 日期、更新内容
发现问题，修复问题
用户体验设计的精益之道
多听用户的反馈意见
发觉自己没有发觉的问题bug。
用户体验设计的精益之 道
留心好设计，优化
积累日常优秀设计，提高 自己对于优秀设计的鉴赏 力。
02 用户体验师的目标
用户体验师的目标
解决用户 需求
减少用户 理解和操 作成分
留下美好 而深刻的 印象
03 实际项目的工作流程
项目跟进 （保障设 计效果的 实现）
开发阶段的持续跟进
https://www.wps.cn
勤于沟通 统一的规范和标准
设计走查
开发阶段的持续跟进
勤于沟通
沟通最重要
设计走查
统一的规范和标准
采用与前端相同的规范和标准
14 设计师的自我修养
设计师的自我修养
好的设计 师 VS 糟 糕的设计 师
学会思考， 事半功倍
限制 状态 操作 反馈
限制
范围值
数据的取值范围。下拉菜单、筛 选按钮、滑块控件时，清楚标注选 择范围。 极限值
数据的显示限制。应该显示多少 字数，超过如何显示，是否折行。
状态
A
默认状态
默认显示的文字、数据、
选项等
B
常见状态
针对某一个模块，经常
遇到的一些状态
C
特殊状态
非正常情况下的样式、
文案、说明等
对交互稿理解是否 正确
关注视觉层次是否 足够清晰
01
03
02
04
拒绝毫无发挥的视 觉设计
关注交互细节和状 态标注（各种状态
的效果）
在审美方面不要过 分干涉
05
审核视觉稿
对交互稿理解是否正确
关注视觉层次是否足够 清晰
在审美方面不要过分干 涉
拒绝毫无发挥的视觉设 计
关注交互细节和状态标 注（各种状态的效果）
标准的原型内容
任务流程与页面流程
任务流 程
页面流 程
任务流程与页面流 程
任务流程 使用产品时，每一步会遇到什么结果、系
统如何反馈，更加偏向于业务限制、后台 逻辑等 页面流程
更加清晰、具体的展现用户如何操作、完 成的一个过程
标准的原型内容 线框图&交互说明 （处静态页面外，还需要
考虑各种动态情况；除正常情况外，还需要考 虑特殊和错误情况）
测试走查
功能bug测试 交互走查 视觉走查 产品走查 可用性测试 子主题
项目流程
上线
产品运营 用户反馈收 集 用户流量统 计
08
“抄袭”竞品的需求分析过程
“抄袭”竞品的需求分析过 程
竞品界面 设计目标 设计需求
“抄袭”竞品的需求分析过程
01 界面样 式
02 操作路 径
03 任务流 程
04 用户需 求
跳转
点击某个链接后，页面跳转到 哪里。注明跳转时是“原页面 刷新”还是“新页面打开”等， 如果是手机应用的话，需要标
明跳转是的转场方式。
动画
用户操作后，通过动画的方式 反馈。
12 线框图心得
线框图心得
通过明暗
A
对比表达
遵守栅
D
格规范
不使用截
B
图与颜色
标记第一
E
屏高度
合理的
C
布局
表达清楚
F
UI逻辑
多思考，对自己有更高的要 求
Why，What，How三步分 析法
设计师的自我修养
学会思考，事半功倍
倾听背后的原因，抓到用户 的本质需求
学会思考，事半功倍
多思考，对自己有更高的要求
倾听背后的原因，抓到用户的本质需求
Why，What，How三步分析法
Why：得到外界结论时先思考为什么 What：对现状进行更深层次的解读 How：在已知的基础上，如何做的更好