【Mark】悬浮按钮要怎么设计才能带来好体验?

悬浮按钮要怎么设计才能带来好体验?


悬浮操作按钮(Floating Action Button,FAB)

使用规则

使用场景

A. 执行关键操作

承载特征性的、最常用的操作/核心功能。


B. 作为引导工具

为用户提供下一步的提示和引导。(当面对不熟悉的界面之时,许多用户都倾向于点击悬浮按钮来探索,获取引导)

Twitter -发推

注意事项

A. 并不是每屏都需要悬浮按钮

悬浮按钮色彩显眼,高亮,吸引注意。不要滥用悬浮按钮,它只为了关键操作而存在!

判断一个界面的主要操作“五分钟规则”:如果你花费了5分钟还没找到这一屏的主要操作,那么这说明这一屏不需要悬浮按钮。


B. 避免出现“迷之导航”

迷之导航指的是“Mystery meat navigation”,简称为MMN。指的是那些难于被发现、目的不明、只有当光标移动到其上才能发现、直到打开才知道其内容的“隐藏式”链接。

悬浮按钮是一个典型的图标式按钮,并不包含文字标签来说明其功能,而通用的、普遍被认识的图标始终是少数。APP的上下文环境要明晰,用户才能够清晰判断按钮的含义和功能。


C. 一屏只使用一个悬浮按钮

悬浮按钮在界面中是突出、最具有侵略性的

D. 悬浮按钮只承载正向操作

通常它应该是个积极正向的交互,比如创建、分享、探索等。唯一的悬浮按钮不应该执行破坏性的操作,比如删除、归档;不应该是非特定的操作,或者是不完整的交互,比如剪切和粘贴。

Material Design 设计规范对于悬浮按钮所承载交互和图标的指引说明

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容