塑造产品核心亮点的设计
Post on 09-Jul-2015
153 Views
Preview:
DESCRIPTION
TRANSCRIPT
塑造产品核心亮点的设计--搜狗号码通改版实战总结
SOGOU Desktop Experience Design Center
Glance Think Review Verify
Glance Think Review Verify
Glance Think VerifyReview
Glance Think VerifyReview
Glance Think VerifyReview
Glance Think VerifyReview
整理
logo
Tab1 Tab2 Tab3 Tab4
Title
Glance Think Review Verify
框架-旧版
简化
logo
Tab1 Tab2 Tab3
搜狗号码通三 logo logo
Tab1 Tab2 Tab3
搜狗号码通三 logo
Glance Think Verify
框架-新版
Review
logo
当前页面Titlelogo当前页面Titlelogo
Glance Think Verify
导航-旧版 导航-新版
Review
Glance Think VerifyReview
操作区域（旧版）
Glance Think Verify
logo
Button（s）
当前页面titlelogo 次要操作区域
主要操作区域（FIT原则）
Review
操作区域（新版）
Glance Think Verify
弹窗（旧版）
Review
操作列表单选说明文字 输入框
logo
当前页面titlelogo
Yes,我是弹窗~
Title
Content
Button
Glance Think Verify
弹窗规范（新版）
Review
Glance Think Verify
Glance
框架
导航
操作
控件
Review
Glance Think Verify
Glance
框架
导航
操作
控件
Think
Review
WHAT HOW
Glance Think VerifyReview
Glance Think Verify
WHAT
Review
问：我们的目标是？
答：提高留存率，增加用户粘度
Glance Think Verify
如何确定改版目标？WHAT
Review
掌握状况—导入观点—确定目标
产品问诊，取得信息;
检视信息，分析问题；
定义问题；
确定目标。
Glance Think VerifyReview
如何确定改版目标？WHAT
掌握状况—导入观点—确定目标
Glance Think VerifyReview
2014/4/09 会议邀请
2014/4/10 第一次沟通交流会
2014/4/15 第二次沟通交流会
WHAT
Glance Think Verify
WHAT
Review
2014/4/09 会议邀请掌握状况
Glance Think VerifyReview
掌握状况 使用产品
•寻找标记入口遇到困难；•有的号码可以标记，有的号码不能标记；•层级太深，导航混乱；
Glance Think VerifyReview
掌握状况 与相关设计师/产品 沟通
•通话详情页面内操作混乱；•成就展示无亮点；
Glance Think VerifyReview
掌握状况 与用户沟通
标记过程中，在通话页面尝试长按，寻找标记入口；
Glance Think VerifyReview
你还可以
找产品要数据
线上用户反馈
…
掌握状况
Glance Think VerifyReview
2014/4/09 会议邀请
2014/4/10 第一次沟通交流会
使用产品
与相关设计师/产品 沟通
与用户沟通
找产品要数据
线上用户反馈
视觉同学引导
提出部分问题
掌握状况
Glance Think VerifyReview
掌握状况
Glance Think VerifyReview
对产品进行问诊，取得关于现状的信息；
掌握状况
标记入口问题；标记操作流程复杂；页面找不到；弹窗样式混乱；结构不符合安卓用户习惯；…
Glance Think VerifyReview
掌握状况
Glance Think Verify
WHAT
Review
掌握状况--导入观点--确定目标
Glance Think Verify
WHAT
Review
掌握状况--导入观点--确定目标
Glance Think VerifyReview
框架结构梳理导入观点标记功能定位；页面逻辑不顺；页面层级太深；…
Glance Think VerifyReview
交互准则 知识积累 项目经验
导入观点
Glance Think VerifyReview
导入观点
以各种角度检视信息，找出问题本质；
Glance Think VerifyReview
掌握状况
•凸显产品核心功能;
•信息层级梳理简化;
•提高吸引力；
•遵守安卓平台特性。
•标记入口问题；
•标记操作流程复杂；
•页面找不到；
•弹窗样式混乱；
•无功能亮点；
•不符合安卓用户习惯；
导入观点
Glance Think VerifyReview
掌握状况--导入观点--确定目标
WHAT
Glance Think Verify
WHAT
Review
掌握状况--导入观点--确定目标
Glance Think Verify
确定目标
Review
2014/4/15 第二次沟通交流会
结合问题；抛出观点；确定目标；
Glance Think VerifyReview
•凸显产品核心功能：标记；
•信息层级梳理简化：整理；
•提高成就吸引力：亮点设计；
•遵守安卓平台特性：用户习惯。
我们的目标是？确定目标
Glance Think VerifyReview
•试用产品•与设计师/产品沟通•用户调查•数据•用户反馈
梳理架构参考基本交互原则经验积累
抛出问题；定义问题；对问题提出合理建议与产品一起确定改版目标
产品问诊，取得信息； 检视信息，分析问题； 定义问题，确定目标。
掌握状况 导入观点 确定目标
Glance Think VerifyReview
WHAT HOW
Glance Think Verify
HOW
Review
简化
删除 组织 隐藏
Glance Think VerifyReview
标记功能瘦身删除
logo
标记陌生来电
fangjietu
logo
当前页面titlelogo
默认分类
我是标记弹窗~
默认分类+自定义全集
logo
已标记号码logo
Glance Think VerifyReview
砍掉陌生号码页面
logo
Tab1 Tab2 Tab3
搜狗号码通三 logo
已标记号码 >
删除
已标记号码已标记号码 陌生来电
Glance Think VerifyReview
砍掉成就页面删除
logo
Tab1 Tab2 Tab3
搜狗号码通三 logo
已标记号码 >
4级标记英雄
删除
Glance Think VerifyReview
删除删除 去掉不必要的
去掉重复的
去掉残缺的
去掉分散注意力的因素，使用户聚焦有价值的功能。
Glance Think VerifyReview
组织
logo
Button（s）
当前页面titlelogo
页面操作
Glance Think VerifyReview
组织 标记页面
logo
已标记号码logo
6月25日 诈骗
外卖
前台MM
6月22日
陌生人
隔壁那家披萨
Glance Think VerifyReview
组织分块 分层 分组…
提供良好的的界面秩序
引导用户自然操作
Glance Think VerifyReview
隐藏 抽屉菜单
简化
logo
Tab1 Tab2 Tab3
搜狗号码通三 logo
截图
Glance Think VerifyReview
隐藏 点评操作
139485674748(圆通速递)
给TA的服务评价，让更多人知道。
提交取消
|还不错，推荐你试试！
Glance Think VerifyReview
删除隐藏 不常用但不能少
渐进展示
阶段展示
让用户聚焦核心功能
显而易见的复杂
Glance Think VerifyReview
隐藏组织删除
无法避免的复杂
到了设计简单用户体验的最后，往往不是问“怎样才能把这个功能设计得更简单”，而是问“到
底应该把这个复杂性放到哪里”。
Glance Think VerifyReview
最后的叮嘱
创造简单用户体验的秘诀就在于把复杂性转移到正确的地方，让用户每时每刻都能感受到简单之美。
Glance Think VerifyReview
最后的叮嘱
佐藤可士和的超整理术
简约至上-交互式设计四策略
掌握状况
导入观点
确定目标
删除
组织
隐藏
Glance Think VerifyReview
WHAT HOW
Glance Think VerifyReview
REVIEW
Glance Think VerifyReview
•凸显产品核心功能：标记 ；•标记功能入口增强，操作流程简化；
•信息层级梳理简化：整理；
•提高成就吸引力：亮点设计；
•遵守安卓平台特性：用户习惯。
•删除大量冗余页面；层级明显减少；
•成就设计亮点增强；尤其增强新用户的使用体验；
•提供符合安卓平台用户习惯的架构，导航和控件。
Glance Think VerifyReview
设计方案还原程度和其他角色沟通顺畅程度
产品数据
用户反馈
出境花絮。。。
THANKS ALL~
敬请期待…
top related