加入收藏 | 设为首页 | 会员中心 | 我要投稿 源码网 (https://www.900php.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 运营中心 > 产品 > 正文

深度长文|如何输出一份让团队满意的交互设计交付物

发布时间:2016-11-25 07:28:43 所属栏目:产品 来源:人人都是产品经理
导读:副标题#e# 前言:我希望自己在一年结束时留给自己感慨的不只是“我画了几百张交互稿”或者干巴巴的“完成了几个上线项目”,也非常感谢网易saga前辈耐心的指点,还有“多总结、多思考”的建议。 有感于这样的建议,近期开始,我将陆续把今年实际项目中遇到

虽然有专业的统计学方法和软件可以提供更全面的分析和数据,但这里只想讲讲在缺乏用研人员配备、需要快速得出有效的定性结论时,我所习惯的一种处理方法。不过,这种方法只适用于给定分组名称(一级模块名称)的卡片分类测试,对B端产品的分析应该说大多数情况下足够了。

如果是不给定分组名称、自由分组的测试,结果的处理难度会稍微大一点,一般在没有统计学软件支持的情况下,都是定性地看一下哪些分组比较趋同和固定,以及出现了哪些比较意外的结果。

深度长文|如何输出一份让团队满意的交互设计交付物

第一列:写明是哪张卡片

第二列:“设计分组”是指在初步设计中,根据设计师的心智模型设置的分组。

第三列:“用户分组正确率”是指用户分组与设计分组吻合的百分率。

第四列:“主要偏差分组”是指在不吻合的样本中,卡片主要被分流去其他组中的哪一个了。

第五列:“其他偏差分组”则用于填写除“主要偏差分组”外的其他分流去向。

以这种方法对所有卡片的分类结果进行梳理后,我们就很容易对自己的方案和真实用户心智模型之间的差距有一个大体感知了,通过“主要偏差分组”、辅以“其他偏差分组”,则可以针对产生这些分流的原因进行思考,有条件时还可以进行回访。

3.4 交付物:树状图

形成初步的树状图后,下一步是对同级页面/元素的重要性进行分级,并初步确定其表现形式。

1.分级:

用数字1、2、3……标明各页面/元素的重要性顺序,只有一个页面/元素重要性最高时,可以在交互稿中考虑加大这一信息块/控件的视觉比重,反之同理。

2.表现形式:

这个元素是一个页面,一个Tab页,一个”块“(甚至可以细分成Banner、卡片、列表等更具体的形式),还是一个跳转按钮/链接?用各种脑图软件中的标记工具,可以很方便将各种元素分门别类,不过放进交互文档时别忘了注明图例,方便同事们看懂。当然,如果只是对页面做信息架构的话这一步不适用。

这里不方便放公司产品的信息架构,就放一个竞品分析中的吧,道理是一样的。

深度长文|如何输出一份让团队满意的交互设计交付物

说到这里有个小建议,如果是对页面、功能、信息元素同时做信息架构(我个人也比较建议这种方式),为了防止整个树状图太大造成阅读困难,可以分模块绘制多个树状图,绘制和阅读都更方便。

4流程设计篇:接触点,支线和异常

通过需求的提炼,整理得到诸多需要设计中体现的页面、信息和功能后,信息架构设计相当于将这些元素组合成一张地图,而流程设计则是将地图上各个元素沿着不同的任务路径连起来。

4.1 接触点:流程设计的线索

流程设计就是对用户使用产品的路径进行设计,是B端交互设计最有趣也最有挑战的地方。如何将繁琐、绕来绕去的流程打通成清晰简洁的体验路径,甚至将原来冗长的流程缩短成只有一半,这是最能体现B端交互设计师能力和价值的地方。优秀的流程设计能极大地提高用户完成任务的效率,这对效率为先的B端产品而言尤为重要。

流程设计的线索是场景分析(2.2节)中涉及到的所有接触点。

关于接触点的类型,这里部分参考saga前辈介绍的分类方法。

一种称为”操作”(Do),用户在执行了某个操作后,改变了他所处的状态,产生了接受新信息的机会。

第二种称为”看到”(See),用户接受了新信息,并产生了新的想法。

基本上我们所熟悉的所有接触点都万变不离其宗,接触点之间连接的方式也通常符合Do-See-Do-See-Do…的模式。但也有例外的情况,更适合采用”连续Do”或者”连续See”的设计。

深度长文|如何输出一份让团队满意的交互设计交付物

这里需要注意的是要周全地考虑流程的头和尾,不要遗漏第一个和最后一个接触点。此外,对一些需要跳转至其他应用的流程,例如跳转至支付宝、微信支付的流程,最好将这部分流程也画出(至少是用简单的虚线框),不要因为不是自己APP内的操作就弃之不理。否则会很容易遗漏接触点。

4.2 支线流程和异常流程

流程设计中还需要考虑支线流程和异常流程,这些流程有一部分与业务相关性较大的,已经在目标分析阶段就作为单独的场景分析过了,而还有大量更加琐碎的支线和异常流程需要交互设计师考虑,例如:

支线流程

1.支付方式不同,例如银行卡支付、余额支付、第三方支付平台支付,以及银行卡支付中绑卡和未绑卡的两种情况下,流程有怎样的不同?

2.未登录用户、不同权限的用户在同一接触点的流程是否有区别?例如:流程入口隐藏、流程操作被禁止等。

3.表单提交、照片或文件上传的过程中是否允许用户取消操作,取消后流程如何跳转?

4.对可编辑的表单页面,是否区分了浏览模式和编辑模式?两种模式下的流程是否有区别?

5.业务、运营要求必须增加的接触点,怎样合理地设计流程将它融入主任务流程?

异常流程

1.用户网速缓慢、超时、甚至无网状态时,流程上如何引导用户正确地返回、自动保存已输入信息或检查网络环境?

2.服务器资源不足时,流程上如何引导用户正确地返回、自动保存已输入信息?

3.页面默认/筛选后状态下内容为空或部分为空时,流程上如何引导用户返回或尝试其他选择?

4.用户可能的误操作导致损失时,如何设计防错流程帮助用户避免这样的损失?

以上归纳部分参考了网易UEDC《如何建立交互设计自查表》这篇很棒的总结,并结合自己的项目经验进行了补充和完善。

关于支线流程和异常流程的思考,即使经验再丰富的设计师,实际上在一个新接触的项目中也不可能做到在流程设计阶段就考虑得面面俱到。所以在方案基本完成后的自查阶段还需要重新梳理、查漏补缺。

(编辑:源码网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读