什么是操作反馈
反馈设计在产品中的使用是非常广泛的,如鼠标的悬浮,点击和按下时界面元素视觉样式的改变是操作反馈,如微博中的评论消息通知是用户之间的互动反馈。由于互动反馈涉及到产品的功能逻辑,较为复杂,因此本文中仅仅讨论操作反馈,且对操作反馈做如下约定:
操作反馈指的是用户对产品进行操作后,产品在执行相应的操作逻辑过程中的状态(如页面资源的加载等待状态)以及展示操作结果时展示给用户的辅助提示状态(如账户登录失败后的错误提示)。
操作反馈的特点是不涉及或影响产品的功能逻辑(但其本身是受产品逻辑控制的),即设计中有无操作反馈对产品的功能逻辑不会有任何实质影响(但会影响用户的使用体验)。此外,操作反馈与提示引导类似,都是产品的一种“临时状态”,不会“长久”的在产品或页面中展示,因此操作反馈在一定的条件下会消失。
为什么需要操作反馈
操作反馈的主要目的和作用是以合适的设计形式针对产品的当前逻辑状态进行解释说明,帮助并增强用户对产品当前逻辑状态的理解,从而提升用户的产品使用体验,简单的可以归为为如下几点:
利用操作反馈的形式对当前产品的逻辑状态进行辅助说明,帮助并增强用户对产品当前逻辑状态的理解
操作反馈是针对用户操作的反馈,因此可以很好的帮助用户理解产品响应操作的逻辑(即产品正在干什么)。如下图所示在账户登录过程中,用户点击登录按钮后,按钮上的“登录中”提示文本是用户点击登录的反馈,其可以帮助用户理解产品正在进行登录,即正在进行账号密码的校验。

降低一些不可控因素带来的负面产品使用体验
在“人——产品”交互过程中,用户应该是绝对的主体,即用户对产品应该有着足够的控制权。因此在产品使用过程中,出现一些用户无法控制的逻辑状态时,合适的操作反馈就可以降低这些不可控因素带来的负面体验,同时增强用户对产品的控制感,如下图所示用户点击下载按钮开始下载任务,在下载过程中用户是没有办法控制下载进程的(受网络带宽等因素限制),但在按钮上显示下载的具体进度,利用下载的实时进度反馈就可以增强用户对下载任务的“控制感”。
满足用户情感诉求
操作反馈还可以增强并满足用户的情感诉求,如成就感,荣誉等。如常见的签到反馈就是典型的满足用户感情诉求的设计,即用户签到后会展示形式感非常强(色彩,动销等形式)的反馈提示用户的等级、获得奖品积分等。
体验升级
在一些场景下利用操作反馈,可以极大的提升用户的产品使用体验,如在用户切手机换铃声音乐后,不仅会在产品页面中提示用户铃声切换成功,还会自动的播放新的铃声,让用户体验铃声的实际效果。
提示引导用户
虽然操作反馈本身不涉及任何产品功能逻辑,但是在设计方案中,可以利用操作反馈提示和引导用户。如常见的表单提交,若果用户表单信息填写错误,则用户提交表单后,可以利用操作反馈告知用户错误,且提示用户哪里错误,如何修改以及输入要求等。
操作反馈种类
根据用户与产品交互过程中产品逻辑状态的不同,可以将操作反馈大致分为2大类,即过程反馈和结果反馈。
过程反馈:指的是产品响应并执行用户操作的过程中(执行操作逻辑到出现执行结果),展示给用户的反馈。如上文所述的账户登录中的产品状态就是过程反馈。过程反馈可以很好帮助用户理解当前产品的逻辑状态。
结果反馈:指的是产品向用户展示操作结果(操作逻辑执行完毕)的同时,展示给用户的反馈。结果反馈的有无对产品功能逻辑没有什么实质的影响,但合适的结果反馈可以提升产品的使用体验和提示引导用户达成一些产品目标,如JD中,点击商品添加购物车,添加成功后会有一个反馈动画,这个结果反馈可以很好告诉用户添加购物车成功以及引导用户去购物车结算。
操作反馈的逻辑流程
常见操作反馈的逻辑流程可以简单归纳为如下图所示,即用户对产品(状态1)进行操作,产品响应用户操作并执行相应的逻辑,同时产品进入状态2,执行操作完成后,产品进入状态3,即向用户展示操作结果。产品状态2就是非常典型的操作反馈,此外,产品进入状态3,即向用户展示操作结果时,也可以根据需要设计合适的反馈以提示用户操作已经完成。
如上图所示,可以将操作操作反馈的逻辑流程大致分为3个阶段,即出现,展示和消失3个阶段。
出现:即什么时候用户可以看到操作反馈,这是一个瞬时状态。操作反馈一般出现于产品执行用户操作时,即用户操作后立马出现,如上图所示的进入产品状态2。
展示:即操作反馈展示的过程,一般来说产品执行操作逻辑是一个持续的过程,如上图所示的产品状态2持续的时间就是操作反馈展示的时间。如果设计有结果反馈,反馈的过程会持续到结果反馈消失。一般来说,过程反馈展示时间是不确定的,取决于产品执行操作逻辑的耗时,在不同的条件下,同一个过程反馈的耗时可能是不同的,但结果反馈的展示时间一般是固定的,在设计过程中就需要确定的,如toast的展示时间一般为2s~5s,或者用户操作后消失。
消失:操作反馈是一个“临时状态”,因此其一定会消失。一般来说,用户的操作有结果时,操作反馈就会消失。如果有结果反馈设计,则反馈消失的时间会相应的延迟,即在操作结果出现的同时出现结果反馈,结果反馈展示一段时间才会消失
值得注意是,结果反馈也意味着用户一个操作可能会有多个反馈。
如何设计操作反馈
操作反馈本身虽然不涉及和影响产品的功能逻辑,但不意味着可以随意的设计和使用操作反馈。与产品功能逻辑设计一样,操作反馈的设计需要遵循一定的原则,否则不仅不会起到正面积极的作用还会产生负面消极的作用。一般可以从以下几个方面进行思考和设计操作反馈。
(1)及时原则——合适的反馈时机
操作反馈设计的第一原则就是及时原则,即操作反馈总是在合适的时机出现并在合适的时机消失。
及时出现:用户操作之后立即出现操作反馈,即操作反馈一定是与用户的操作紧密关联,不会主动出现展示给用户。
及时消失:操作反馈是一种“临时状态”,不可能长久的存在,因此一定会消失,而消失时机跟操作反馈类型有关,如果是过程反馈,则在操作结果展示时(即操作逻辑执行完毕时)消失,如果是结果反馈则会在操作结果展示出来后遵循一定的逻辑消失。常见的结果反馈消失逻辑有2种,第一种就是展示一段时间后根据设定的逻辑自动消失,如toast形式的结果反馈;第二种是需要用户进行操作操才会消失,如模态弹窗形式的结果反馈。
(2)准确原则——准确的反馈内容
操作反馈包含有一定的“信息”内容,即反馈给用户的信息,如上文所述账号登录中的操作反馈会在登录按钮上显示“登录中”字样。操作反馈中包含的“信息”内容一定要遵循准确原则,即操作反馈的内容一定是合适且准确的。在设计过程中,可以从以下几个方面考虑操作反馈“内容”的设计。
包含的信息应该简短精炼,不可以包含过多复杂的信息
操作反馈本身就是一个非常轻量级的“提示”,其视觉形式也注定了无法承载过多复杂的信息内容。因此操作反馈包含的信息应该简短精炼,不可以包含过多复杂的信息。
能准确的表达当前的产品状态或设计目的
操作反馈一定要能表达出当前的产品状态或逻辑,即操作反馈中包含的信息要能精准的表达出产品的当前状态或设计目的,如上文所述账号登录中的操作反馈是在按钮上显示“登录中”字样,“登录中”文字可以很好的表达出当前产品处于账号登录校验的逻辑状态。
用户易于理解,不产生歧义
操作反馈中包含的“信息”需要确保用户能够理解,不会产生歧义。因此操作反馈中包含的内容应该是可读的和易于理解的,不应该包含过于专业化或过于隐喻的信息内容,或者让用户容易产生歧义的内容。
(3)合适原则——合适的反馈形式
操作反馈包含有反馈信息,因此需要借助一定的视觉形式来展示这些反馈信息。在满足设计需求的前提下,我们必须选用合适的形式来承载反馈信息,否则操作反馈只能起到负面作用和影响。可以从以下几个方面考虑操作反馈形式的设计。
不影响用户的正常产品操作流程
操作反馈是不涉及产品功能逻辑的“轻量级提示”,其主要目的是为了提升用户的产品体验,因此其设计一定不能影响用户的正常使用流程。
确定操作反馈对用户的影响程度
虽说操作反馈是对用户操作的“轻量级提示”,但是在实际中还是需要考虑反馈提示对用户的影响程度,如果操作反馈需要用户关注,则需要使用较强的反馈形式,如弹窗,如果操作反馈对用户的影响不大,则可以使用较弱的反馈形式,如toast形式。
考虑操作反馈展示的时长
上文所述,操作反馈有一定的展示“时长”(这里指的是同一操作反馈在绝大部分场景下展示的“时长”),操作反馈的”时长“对用户对发现和理解操作反馈“信息”内容有着直接的影响。在设计过程中需要避免操作反馈展示“时长”过长或者过短的场景,从而对用户的使用体验造成负面影响。比如页面在向服务端请求数据时,假设绝部分用户耗时在500ms内,则加载等待状态的操作反馈中不适宜包含文字,因为用户的反应式时间一般在300~500ms内,阅读文字还需要一定的耗时,如果使用文字可能会导致用户还没有看清文字是什么,操作反馈就结束了(文字一闪而过),在这种场景下使用简单图形做为操作反馈更为合适。
常见的反馈形式
根据上文所述的操作反馈的类型(即过程反馈和结果反馈),可以将常见的操作反馈形式归纳为如下几种,在设计过程中,可以根据需要来选择或设计合适的操作反馈。
(1)过程反馈
页面元素的逻辑状态
用户对页面中的控件组件进行操作后,页面元素在产品执行操作逻辑过程中的状态就是操作反馈。使用页面元素逻辑状态做为操作反馈的特点是操作反馈本身没有独立的视觉形式,而是借用页面元素的逻辑状态来表达操作反馈。一般来说页面元素的逻辑状态操作反馈的展示时间都较短,操作反馈对用户的影响较小,需要用户的关注度较小。常见的可以做为操作反馈的页面元素逻辑状态有按下状态,禁用状态,悬浮状态(鼠标操作),焦点状态(文本框)和拖拽等状态。如下图所示为按钮操作后的禁用状态和文本框的焦点状态做为操作反馈的示意图。
面元素的可用状态和选中状态等是一种常态化的逻辑状态,与用户的操作无关无关,因此不属于操作反馈。
等待加载
等待加载反馈指的是用户进行操作后,产品需要耗费一定的时间来执行相应的逻辑,在此过程中展示的产品状态(形式)就是加载等待反馈。一般来说加载等待反馈都会有其独立的设计形式,即在页面中有专门的视觉形式。等待加载反馈对用户的产品体验影响较大,不合适的设计方案很容易造成负面影响。常见的等待加载都是向服务端请求数据(如新页面打开时向服务端请求数据)以及产品执行逻辑需要耗时等待(如复制文件),如下图所示为常见的打开新页面加载内容的操作反馈示意图。
其他操作反馈一般都是静态的,而等待加载反馈一般都是动态的,其视觉形式是不固定,一般常见的是如上图所示的圆圈或者进度条,也可以与品牌形象结合,只要设计方案能表达出“正在加载,请等待” 的含义就可以。
(2)结果反馈
结果反馈指的是产品完成用户操作逻辑后展示操作结果的同时展示的操作反馈。结果反馈的重点在于会同用户操作结果同时出现,与操作逻辑执行的过程无关,其主要目的是提示用户操作完成或者跟操作相关的提示/引导。常见的结果反馈有如下几种,在设计过程中,可以根据需要来选择合适的形式。
toast
toast是标准控件,其使用规范就不做详细叙述了。toast形式的结果反馈其主要特点是反馈形式轻量,不会对用户的操作造成过多的干扰,但是其不能承载过多的信息内容,因此常用于重要程度较低的操作反馈。
弹窗
弹窗与toast类似,也是标准组件,同样可以用于结果反馈,与toast的区别在于弹窗形式的结果反馈会中断用户操作流程,对用户操作的干扰较大,但是其可以承载较多的信息内容以及丰富展现形式,此外,弹窗类型的结构反馈一定需要用户点击按钮才会消失,因此其的反馈效果是较好的(即可以认为用户一定阅读了结果反馈中的信息内容)。值得注意的是,一般用于结果反馈的弹窗都是是通知类(Alert)弹窗,弹窗中不能包含具体的产品功能逻辑,即弹窗仅展示结构反馈的“信息内容”,且弹窗底部只有一个“确定”按钮(如我知道了)。
气泡
气泡形式也是一种常见的反馈形式,其综合了toast和弹窗的优缺点,即可以展示较多的内容也可以降低反馈对用户的干扰。气泡的设计可以根据实际需要设计具体的方案,其设计自由度较大,但同样不能包含任何产品功能逻辑。
物理反馈
物理反馈指的是在用户操作完成时,物理硬件会提供操结果反馈,最为常见的是音效和震动反馈。例如切换手机铃声成功时,会自动播放新铃声,让用户实际体验铃声的实际效果。按键震动是最为典型的震动反馈,一般手机系统都可以提供按键震动反馈,即用户按下按键时,手机会震动以提示用户。
页面元素状态反馈
与页面元素的逻辑状态当做过程反馈类似,页面元素的状态也可以作为结果反馈,其区别在于作为结果反馈的页面元素状态一般仅会更改元素的视觉样式,不会涉及到页面元素的逻辑状态,如最为常见的就是表单校验,当用户输入文本不符合要求后,就会出现结果反馈,出现错误提示文字的同时,文本框一般也会视觉样式的改变以增强提醒用户,如下图所示。如上图所示,页面元素状态的结果反馈可以归为2种,即更改当前页面元素的视觉样式(不更改页面元素的任何功能逻辑)和出现新的页面元素(一般都是提示类元素,在设计过程中需要预留布局空间)。如果使用页面元素状态做为用户操作的结果反馈,那么一定要有页面元素恢复默认状态的逻辑设计,即在用户进行一定操作后,页面元素状态的结果反馈会消失,如上图所示的文本框的错误提示样式和提示文案都会在用户修改文本框内容后消失。

直接利用操作结果当做结果反馈
针对结果反馈的设计,在一些场景下,如果产品的功能逻辑以及操作结果都在页面中表达的很完善(即用户能理解且不会产生歧义),则可以不设计结果反馈。因为任何信息的传递对用来说都是一种负担。常见不设计结果反馈的场景都是使用操作结果充当结果反馈,即用户操作的结果十分明显,无需再在展示任何结果反馈,用户也可以理解。也是基于此种原因,在上文所述的操作反馈流程中结果反馈是一种可选的设计元素。
在设计过程中,虽说操作反馈不包含任何功能逻辑,但是其本身的逻辑流程还是与产品的功能逻辑紧密相关,即用户怎么操作,产品怎么执行功能逻辑以及给出什么样的操作反馈,这些在实际中我们都需要仔细的分析,然后再设计出合适的方案。
网友评论