赞助商
立即赞助

如何简化操作流程?来看这篇超全面的总结!

交互设计3年前 (2021)发布 流光
2.2K 0 0

王M争:关于提升用户体验的方法论非常,其中一个比常见的就是简化操作流程。我们对此非常熟悉,但我很少看到文章系统的去论述该如何去简化操作流程。这里我就一简单的分析,如果家看完之后所收获或启发,不胜荣幸。

一、什么是操作流程?

操作流程指的用户了达到某目标所需历的操作场景转换。举活中的例子,小时候我爸我去营业厅交电话费。当时交话费的操作流程:从家骑自行车去营业厅,排队,查询话费,交钱,骑车回家。所需历的场景转换从家到营业厅,再回家。

如何简化操作流程?来看这篇超全面的总结!

产品设中的「操作」我们可以理解交互方式,「场景转换」理解参与的页面数。所以简化操作流程可以划分两方向:优化交互方式,减少不必的场景转换(页面)。

二、优化交互方式

交互方式的优化我们可以从两方面入手:减少用户点击次数降低操作难度。让用户少的点击次数下完操作,其实就提升信息的录入反馈效率。一些新技的应用可以帮我们实这目的。

如何简化操作流程?来看这篇超全面的总结!

例如绑银行卡的时候,一些产品给用户提供了拍照识别卡的功能,用户就不需手动输入卡。这样可以减少用户的点击次数,且还降低了用户手动输入错误的风险。此外还一些指纹支付,刷脸登录这样识别功能,这些新技的应用可以极的提升用户的交互效率。所以设师对新技的持续关注非常必的。

当并不意味着我们需要埋头对新技术的追求。很时只要消化现有的技术,同样以优化产品验。例,在别录的时,里设计师选择的下拉列表的样式,但是我得使用单选框更加合适,因为总共就两个选项。选择单选框以减少用户的点击次数。

如何简化操作流程?来看这篇超全面的总结!

从上面个例子我们以现有组件在功能上是有相互重叠的部分。一旦一个功能以由个组件来完成,么我们必须找出最优方案。所以交互设计师产品理的一基本功就明确每的组件的用场景,原型图中予以明确。

以上围绕的重点是减少点击次数,接下来我们主要说降低操难度。我们看一个案例,以前用户想删微信,从底部弹出一个对框确认一下操。但是新版的「确认操」直接在原消息栏里展示。其改版前用户的点击次数是一样的,但是新版的反馈具有更强的指向,用户的目光(注意力)不生转移。

如何简化操作流程?来看这篇超全面的总结!

上面说到用户的目光,里跟大家分享一下人类眼球对视信息的处理程:

  • 基本信息提取,并处理多特征;
  • 根据目的需要,筛选关注内容;
  • 保存关键目标,联想相关描述。

其中一阶段中的基信息涵盖形状、颜、位置、轮廓等。每次用户收到一个反馈,进一个新的界面,要重新去获取信息。为提升用户对视信息的处理效率,我们以提供相同的形状、颜、位置、轮廓等,就是一致原则以减少用户的学习/操成的原因。以上面的例子为例,底部对框的反馈样式,用户要重新识别位置和形状,而新版的反馈样式则不出现种情况,更加易用。

三、减少场景转换

我们在为一个任务绘流程图的时,应该避免让用户跳转的页面,因为跳转一个页面就意味着流失一部分用户,就像漏斗一样。

如何简化操作流程?来看这篇超全面的总结!

前几天有个朋在微信群里问一个问题:新用户在注册完成的时,我们是否应该让用户去设置登录密码,类似的还有支付密码设置问题。

如何简化操作流程?来看这篇超全面的总结!

为回答个问题,我特地下两款竞品,是教你怎么做菜的。里分别说是产品A和产品B,两款产品支持三方登录,而且登录要求用户去绑定手机号。但是产品B给用户提供「跳」按钮,用户以选择不绑定。

如何简化操作流程?来看这篇超全面的总结!

首先得承认我对两款产品不太,直接评论坏的有失偏颇,而且设计无所谓坏。仅从我个人角度来说,不支持在里让用户就去设置密码或者去绑定手机号。因为用户刚注册完,还没有享受到你提供的服务,你就考虑用户次登录和购买的场,说不定用户看到个设置界面直接就走人。因为现在产品同质化现象非常的严重,你的产品以有很替代品。

从上这个例子,我们也可以发现在操作流程设计阶段,我们常有必要去进任务分析,去明确高层任务和低层任务。个任务映射到设计层级,可能是个 icon,也可能是个页。以下图为例,样票界,这里主要任务是选座。而更换场属于要任务,它展示形是个 icon,没有打乱个界布局,也没有过度分散用户注意力,在这里我觉是常合适。

如何简化操作流程?来看这篇超全面的总结!

如低层任务需要新增个页来完成,而新增页又有让用户大量流失风险,我个议是舍去。品设计过程设计师需要去做很多决定,其很多都不是黑即白选择。个选项都有其背后意义,我们能去做更符合前阶段品利益选择。

如何简化操作流程?来看这篇超全面的总结!

然并不是有进任务分析才可以减少场景转换,过简单小细节改也可以到目。以微信为例,用户编辑状态准备发朋友圈,如击了「取消」,我们会发现会弹出个话框,让用户选择「保留」或「不保留」。这样处理有个问题,如用户是误击了「取消」,那么他能击「保留」,然后退出再进入编辑状态。我看了下 QQ 和微,他们用是从底部弹出动作栏,用户如是误操作,要击「取消」可以了。这样弹框个小变化,可以避免了用户再返回到原界,减少了场景转换。

总结

以上是我从优化交互,减少场景转换这两个简化操作流程个分析。如你有不想法,欢迎留言或者添加我个微信讨论交流。

注作者的微信公众号:「王M争」

如何简化操作流程?来看这篇超全面的总结!

图片素材作者:Paul Olek

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

一般而言,杰作的诞生不是花更多的时间和资源去解决问题本身,而是少说废话多做事。 过去我认为随着技术的进步,我们的工作...
Eugen Eşanu
在新业务启航准备出海乘风破浪时,业务方和产研同学就开始思考一个问题:产品体验做得足够好吗? 为了回答这个问题,用研同...
B端设计
在 UI 界面当中使用动效已经成为这几年一直被讨论的热门话题了。动效要怎么用,什么样的动效更优秀等等,这样的探讨层出不穷...
UI动效
@Jenny黄静雯 :节日闪屏的呈现虽然只有一个画面,但了解设计背后的来龙去脉,才能让设计有根可寻。 一、节日闪屏是什么?​ 1...
情感化设计
本文聚焦 Airbnb 产品,描述10大可用性原则的应用场景,希望能够帮助你更系统地理解10大可用性原则。 一、系统状态的可见性 V...
Airbnb
二次确认的主要作用是防止误操作,以及警示操作带来的后果,避免用户无意之间执行了本不想做的操作。从用户流程图中我们不难...
二次确认
怎么能够防止用户在核心流程中中断操作,避免产生流失?以下,笔者将与大家分享他进行实际方案优化时测试过的四种方法。 笔...
交互流程
△ 亲手做的第一个本子,做了30页 △ 正方形剩下的边角料做的第二个小本子 △ 看到喜欢的布又忍不住做了一个,也改进了做...
手绘