02 2019 SEEConf AntDesign情感化设计 周姮&&梓义

1. Ant Des gn 情感化设计
2. 周姮 梓义 体验设计师 体验设计师
3. 01. 02. Ant Design Ant Design 情感化设计研究 情感化设计落地
4. WHY 为什什么要做?
5. 我们的关注点 使⽤用某产品 情绪起伏 情绪起伏 ⼼心理理解释 ⼼心理理解释 常规的关注点 ⽤用到想离职…
6. 让 情感 被重新发现
7. HOW 怎么做?
9. 体系化? 单薄乏⼒力力? 设计验证?
10. Ant Design 设计价值观 确定 ⾃自 然 情感
11. 反思层 ⾏行行为层 本能层 《情感化设计》 Donald A.Norman
12. 治 本
13. 情绪感受 ⽤用户对产品是否满⾜足⾃自⼰己的需要⽽而产⽣生的态度体验
14. ⼈人类正⾯面情感指标 Delft Institute of Positive Design sympathy kindness respect hope anticipation 同情 仁慈 尊重 希望 期待 love admiration dreaminess surprise energized 爱慕 钦佩 梦想 惊喜 活⼒力力 lust desire worship courage pride 情欲 欲望 崇拜 勇⽓气 ⾃自豪 confidence inspiration enchantment fascination euphoria 信任 灵感 魔⼒力力 魅⼒力力 欢快 joy amusement relief relaxation satisfaction 愉悦 娱乐 解脱 放松 满意
15. ⼈人类负⾯面情感指标 Delft Institute of Positive Design anger indignation resentment annoyance dissatisfaction frustration ⽣生⽓气 愤慨 怨恨 烦躁 不不满 挫折 contempt hate disgust boredom reluctance sadness 鄙视 讨厌 厌恶 ⽆无聊 勉勉强 悲伤 disappointment pity loneliness rejection humiliation longing 失望 可怜 孤单 拒绝 屈辱 渴望 envy jealousy guilt regret shame embarrassment 羡慕 妒忌 有罪 后悔悔 耻辱 困窘 fear startle worry anxiety distrust doubt 恐惧 惊吓 担⼼心 焦虑 怀疑 疑惑 nervousness insecurity distress desperation confusion shock 紧张 不不安 苦难 绝望 困惑 震惊
16. ① 探索 提炼情感指标 基于⼈人类正负情感指标提炼企业级产品情感指标 情感诉求导向 的设计流程 ② 聚焦 锁定情感诉求 ③ 设计 产出设计⽅方案 ④ 落地 推动业务落地 ⑤ 验证 验证设计价值
17. 企业级产品 情感指标
18. Ant Design 企业级产品情感指标 V1.0 正向 愉悦 joy 惊喜 surprise 信任 confidence 期待 anticipation ⾃自豪 pride 负向 ⽣生⽓气 anger 失望 disappointment 疑惑 doubt 焦虑 anxiety 挫折 frustration
19. 正向 负向 指标 释义 访谈问题 指标 释义 访谈问题 愉悦 当产品充分发挥其功能、 促进⾼高效⼯工作时,可体 验到的愉悦情绪。 在使⽤用 DataGo 过程 中什什么时候感到开⼼心 愉悦? ⽣生⽓气 遇到不不符预期 / 不不合⼼心 意的操作⽽而产⽣生不不愉快 的情绪。 在使⽤用产品过程中, 哪些瞬间是让你觉得 ⽣生⽓气的? 惊喜 在未知情况下,当产品 体验 / 功能超出预期时 产⽣生的⾼高兴情绪。 产品中有哪些超出期 望、让你感到惊喜的 地⽅方? 失望 当你发现所希望的事情 没有发⽣生时的感觉。 产品中哪些地⽅方让你 觉得⽐比较失望,不不符 预期? 信任 专业、可靠、稳定、易易 ⽤用的产品能给⽤用户带来 信任感。 你信任 DataGo吗? 为什什么?(⽤用四个关 键词来问) 焦虑 对可能发⽣生的潜在威胁 或难以应付的事情⽽而产 ⽣生烦躁、担⼼心的情绪。 在⼯工作中哪些场景让 你产⽣生焦虑的情绪? …… …… …… …… …… ……
20. Ant Design 情感卡⽚片
21. ① 探索 提炼情感指标 ② 聚焦 锁定情感诉求 情感诉求导向 的设计流程 挖掘⽤用户情感诉求点,聚焦设计⽬目标 ③ 设计 产出设计⽅方案 ④ 落地 推动业务落地 ⑤ 验证 验证设计价值
22. 情感化 ⽤用户访谈
23. 情感化 ⽤用户访谈 暖眼 暖胃 暖⼼心
24. 1 个产品 DataGo 数据研发平台 7 名⽤用户 53 个情绪点 数据研发、数据运维、数据 29个正向情绪点 分析师 24个负向情绪点
25. ⽤用户 愉悦 惊喜 信任 期待 ⾃自豪 ⽣生⽓气 失望 疑惑 焦虑 挫折 n ⼩小萌 3 1 8 5 6 0 0 2 4 7 8个 5 6 7 7个 6 2 5 0 9个 10 个 ⼩小红 3 0 2 偶巴 7 8 1 阿表 7 6 7 10 1 4 0 0 = x ( n m + 1 ) 情绪值 n 4 9 3 10 5 9 3 4 8 1 2 6 10 5 9 3 4 8 1 2 0 0 5 4 6 1 0 0 2 3 6个 星星 3 0 4 2 6 0 5 1 0 0 6个 ⼤大头 8 5 4 6 9 10 2 1 7 3 10 个 阿表 阿⻙韦 n:参与排序的情绪数量量 m:情绪排名 10 个
26. ⽤用户 愉悦 惊喜 信任 期待 ⾃自豪 ⽣生⽓气 失望 疑惑 焦虑 挫折 n ⼩小萌 7.50 10.00 1.25 5.00 3.75 0.00 0.00 8.75 6.25 2.50 8个 ⼩小红 7.14 0.00 8.57 10.00 5.71 0.00 0.00 4.29 2.86 1.43 7个 偶巴 3.33 2.22 10.00 6.67 1.11 7.78 4.44 8.89 5.56 0.00 9个 阿表 4.00 5.00 1.00 6.00 2.00 8.00 7.00 3.00 10.00 9.00 10 个 阿⻙韦 0.00 0.00 3.33 5.00 1.67 10.00 0.00 0.00 8.33 6.67 6个 星星 6.67 0.00 5.00 8.33 1.67 0.00 3.33 10.00 0.00 0.00 6个 ⼤大头 3.00 6.00 7.00 5.00 2.00 1.00 9.00 10.00 4.00 8.00 10 个 均值 4.52 3.32 5.16 6.57 2.56 3.83 3.40 6.42 5.29 3.94
27. 维持 强化 提升 期待 疑惑 焦虑 信任 愉悦 挫折 ⽣生⽓气 失望 惊喜 ⾃自豪 6.57 6.42 5.29 5.16 4.52 3.94 3.83 3.40 3.32 2.56 减少 转化
28. 正向 负向 期待 6.57 + 信任 5.16 + 愉悦 4.52 + 惊喜 3.32 22.13 + ⾃自豪 疑惑 2.56 6.42 + 焦虑 5.29 + 挫折 3.94 + ⽣生⽓气 3.83 22.88 + 失望 3.40
29. 满⾜足⽤用户期待的切⼊入点: 1. 产品能⼒力力全景图 转化⽤用户⽣生⽓气、焦虑、挫折的切⼊入点: 1. 运维告警机制 减少⽤用户疑惑的切⼊入点: 1. 帮助引导系统 2. 产品概念形象传达给⽤用户 3. 产品能⼒力力全景图
30. 情感化设计⽬目标 满⾜足期待 - 产品能⼒力力全景图 减少疑惑 - 新⼿手引导 减少疑惑 - 场景问题识别 减少疑惑 - 帮助服务中⼼心 转化疑惑 - 产品概念动效 转化⽣生⽓气、焦虑、挫折 - 运维告警机制
31. 情感化设计⽬目标 产品⻔门户⾸首⻚页 帮助引导系统 运维告警机制 转化疑惑 - 产品概念动效 减少疑惑 - 新⼿手引导 转化⽣生⽓气、焦虑、挫折 满⾜足期待 - 产品能⼒力力全景图 减少疑惑 - 场景问题识别 - 运维告警机制 强化信任 - 产品背后的团队 减少疑惑 - 帮助服务中⼼心
32. 01. 02. Ant Design Ant Design 情感化设计研究 情感化设计落地
33. 1 2 3 产品⾸首⻚页 帮助引导系统 运维告警机制
34. 1 情感诉求导向的产品⾸首⻚页 DataGo是什什么?
35. DataGo是什什么? 原始 数据 采集 加 ⼯工 DataGo 上架 数据 资产
36. DGo
38. 缓解疑惑 第⼀一印象
39. 产品的发展是否能匹配我的业务诉求? 1 情感诉求导向的产品⾸首⻚页 情绪值排第⼀一的情感
40. 承载期待 能⼒力力全景
41. 1 情感诉求导向的产品⾸首⻚页 86% “我信任的是产品背后的团队”
42. “ 在⽹网站中显示他⼈人的存在,将显著改变⽤用户的感觉和⾏行行为。 《怦然⼼心动:情感化交互设计指南》 Stephen P. Anderson
43. 提升信任 访问帮助中⼼心
45. 2 情感诉求导向的 帮助引导系统
46. “ 学习成本太⾼高了了,没⼈人带是学不不会的… 遇到问题⽼老老是得不不到及时解决,⼯工作就会受阻… ⽂文档查阅我⼀一般是不不看的,太费时间了了… ”
47. ⽤用户需要的是帮助引导系统⽽而⾮非⽂文档中⼼心
48. 排解疑惑 提前预判,就地化解
49. 排解疑惑 场景识别,因地制宜
50. 排解疑惑 快速概览,快速开始
51. 排解疑惑 基于场景识别的 帮助引导系统
52. PD 视觉 ⾏行行 为 外貌、举⽌止、谈吐 Designer ⽂文 案 Engineer
54. 3 情感诉求导向的运维告警机制
55. “ 天天这样运维,感觉失去了了⼯工作的意义 by 阿表
56. 🛌 睡觉 📲 海海量量告警 有效信息少 被 60 条告警 炸醒 🛏跨终端 & 起床 🔐 跨平台 D 🛠 📄 跨平台 📌 打开电脑 连接 vpn 打开 DataGo 访问运维 中⼼心 查看告警 ⽇日志 到其他平台定位 错误原因 🛌 ⚙ ✅ 📄 🔎 📤 调整质量量规 则 置成功 睡觉 📢 通知上游 修改 查看错误节 点⽇日志 r 流程断点 找到出错实 例例 前往实例例列列表黏 贴 ID 📥 流程断点 复制任务 ID
57. 🛌 睡觉 告警聚合 海海量量告警 透出 有效信息少 有效信息 被 60 条告警 📲 炸醒 🛏 & 起床 打开电脑 连接 vpn 🛌 移动运维 减少跨终端设备 睡觉 🔐免拨VPN D 🛠 📄 打开 DataGo 访问运维 中⼼心 查看告警 ⽇日志 ⚙ ✅ 📄 调整质量量规 则 置成功 📢 通知上游 修改 查看错误节 点⽇日志 📌 📥 流程打通 到其他平台定位 错误原因 复制任务 ID 信息聚合到 r DataGo 🔎 流程打通📤 找到出错实 例例 前往实例例列列表黏 贴 ID
58. 🛌 📲 睡觉 被30条告 警炸醒 📱 📋 🛠 📄 📌 打开钉钉运维 ⼩小程序 查看告警 列列表 访问运维 中⼼心 查看告警 ⽇日志 定位 错误原因 不不⽤用起床啦 🛌 睡觉 ⚙ ✅ 调整质量量规 则 置成功 📢 通知上游 修改 快速解决60%~70%的 运维告警任务
60. 协同 驱动 从⽤用户情感诉求出发,让设计从协同到驱动
61. 企业级产品情感化设计 不不能只停留留在表⾯面
62. 意义诉求 情感诉求导向 的情感化设计 基本诉求 美学诉求 《情感化设计》 Donald A.Norman
63. 情感诉求导向 的设计流程 ① 探索 提炼情感指标 ② 聚焦 锁定情感诉求 ③ 设计 产出设计⽅方案 ④ 落地 推动业务落地 ⑤ 验证 验证设计价值
64. 以⼈人为本 标本兼治 获取⽤用户真实诉求 构建完整设计视⻆角
65. Ant Design 设计价值观 确定 ⾃自 然 情感
66. 体验掘⾦金金队 它⼭山 周姮 短篇 线丝 罗宪 特别鸣谢: ⽩白⻰龙、奇灵、伏星、燕引、⽟玉郎(阿表扮演者) 梓义