行业分享 2017-10-25 浮动按钮体验设计

利用5种浮动按钮增加网站的体验设计

在手机应用当中浮动的动作按钮（FAB）或许可以提供我们在制作移动版网站提供一些交互的灵感，浮动的动作按钮是一种漂浮在用户界面上面的图标。它的形状、位置和颜色使它在众多设计元素中脱颖而出。浮动按钮在谷歌2014年的设计标准当中发布和推广。现浮动按钮用户界面元素已被广泛应用在Web和移动设计。

虽然浮动按钮看起来非常地小，甚至看似微不足道的视觉组件，但它的作用是很重要的，总会引导用户的点击。只要对它正确使用，它的可以使用户是立即识别和访问点击。

1、代表一个当前页面最重要的动作

理想的情况是，浮动按钮应突出最相关的或经常使用的操作，它应该被使用，你的应用程序的主要特点的行动。如果你想在你的应用程序使用的晶圆厂，设计必须仔细考虑和用户的可能的行动必须归结到一个单一的突出特点。例如，一个音乐应用程序可能有Fab表示“播放/停止”。Instagram的一个类似的应用程序可能有一个浮动按钮，代表“拍照”。

一个动作按钮代表应用程序中的主要作用。暂停或恢复在这个屏幕上播放告诉用户，这是一个音乐应用程序。

根据研究史蒂夫·琼斯，Fab显示轻微的负对可用性的影响当用户第一次使用按钮。然而，一旦用户成功地完成了任务，使用FAB，他们能够比传统的操作按钮更有效地使用它。

2、最容易找到工具的办法

浮动按地是一个自然的提示告诉用户下一步要做什么。谷歌的调查显示，当面对陌生的屏幕很多用户依浮动按钮导航。因此，FAB是非常有用的一个标志，我们不需要思考就知道下一步要做什么。

一个浮动的动作按钮的使用推特鼓励你的文章内容

3、提供一组动作（多个）

在某些情况下，它是适当的按钮旋转，让其他几个选项，可以在下面看到Evernote。Fab可替换自身一系列更具体的行动，你可以设计你的用户是语境。作为一个经验法则，提供至少三个选项后，按不超过六（含原浮动作按钮的目标）。

也请记住，这些行动必须是初级行动Fab本身表达有关，且相互关联：不要把这些发现的行为作为独立的可如果位于工具栏。

别：“我的行动不创造内容的行为有关。

4、上下文感知

上下文在用户交互的重要作用。有时用户想消费的内容，有时他们要执行的操作。这一切都取决于上下文。使用一些上下文的行为可以带来最好的用户体验的任何应用程序的浮动按钮。让我们来看看谷歌为例。谷歌显示按钮，当用户与流接合，和隐藏在这种交往是相反的。这两个操作需要引导：当用户与社会流的吸引力，一个主要的行为是滚动，因此不需要浮动按钮，当用户停止滚动，他们可能想要的东西后。