使用浮动操作按钮(FAB)提升用户体验的5种方法
浏览:154 时间:2023-10-18

浮动操作按钮(FAB)(FAB)是浮动在用户界面上方的图标。它的形状,位置和颜色使其与界面的其他部分明显不同。在Google于2014年推出Material Design之后,FAB被广泛用于网站设计和移动设计作为用户界面元素。虽然FAB可能被视为微不足道的UI组件,但其有效性至关重要。在本文中,作者将介绍五种改善FAB用户体验的方法。

1.代表标志性操作理想情况下,FAB应突出最相关或最常用的操作,其操作突出了当前APP的最重要特征。如果您想在应用程序中使用FAB,请务必仔细考虑应用程序的设计原则,并将用户可能的操作归因于最显着的功能之一。例如,音乐应用可能有一个FAB,意思是“播放/停止”。像Instagram这样的应用程序可能有一个代表“拍摄”的应用程序。

根据Steve Jones的说法,当用户首次使用时,FAB显示出轻微的负面可用性影响。但是,一旦用户使用FAB成功完成任务,他们就可以比使用传统操作按钮更有效地使用它。

2.作为提醒工具,FAB可以作为一种非常自然的指南,告诉用户下一步该做什么。谷歌的研究表明,许多用户在面对不熟悉的屏幕时依赖FAB进行导航。

使用Twitter上的浮动操作按钮来鼓励用户发布内容

3.提供一系列操作在某些情况下,如下面的Evernote示例所示,FAB适用于旋转和暴露其他选项。 FAB可以用一系列更具体的操作来代替自身,并且可以设计成与用户正在阅读的上下文相关联。根据经验,选项数量需要在3-6中控制(包括原始浮动动作按钮目标)。

这些操作必须与FAB本身表示的主要操作相关联,并且相互关联。例如,以下图片

“我在哪里?”该操作与创建内容操作无关。 4.结合上下文场景在用户交互中起着重要作用。有时用户想要消费内容,有时他们想要执行操作。这一切都取决于使用场景。联系使用场景以将FAB应用于任何APP的用户体验行。以Google+为例。

当用户使用流时,Google+会显示FAB并在流停止时隐藏它。这两种状态取决于使用场景:当用户使用流时,主要操作是滚动,因此不需要FAB,并且当用户停止滚动时,他们可能发布一些内容。

5.连接两个状态FAB不仅仅是一个圆形按钮。它具有可变属性,可用于帮助用户适应从一个屏幕跳转到另一个屏幕。以下示例中的动画维护用户的方向感,并帮助用户了解视图布局中刚刚更改的内容,更改原因以及如果以后需要再次启动更改。

图片来源:Ehsan Rahimi

图片来源:Dribbble

结论有人会说FAB不利于用户体验。因为我们都熟悉熟悉的工具栏,而FAB的概念对我们来说相对较新,所以不习惯它。然而,虽然适应新事物很困难,但新事物会为我们的生活带来创新。正确合理地使用FAB可以为用户提供更加用户友好的用户体验。