百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 博客教程 > 正文

基于用户体验的浮动操作按钮设计--一个即将到来的设计趋势!

connygpt 2024-08-20 14:07 5 浏览

浮动操作按钮(Floating Action Button , FAB)将是Material Design的下一件大事!它以圆形的样子漂浮在用户界面上,有着特异的作用。这些图标有着特殊的运动行为,漂浮在UI上方并执行一些操作,如启动、变形。他们有两个不同的尺寸,包括迷你型和默认大小。

浮动操作按钮是一个优雅、动态、轻量级和始终如一的设计元素,提供快速而有效的导航和增强用户体验。按照规则和指导方针,它被定位在右边,使程序通用并且扩展其功能。根据谷歌的规范,浮动操作按钮应具有建设性的色调,提供快速访问重要工具的功能。

1. 着色UI

虽然用户界面可以饱满厚重,Lois Yang还是通过选择一个有吸引力的颜色来完成其优秀的工作。带有微妙的阴影效果的坚实红色背景使得图标能够将内容区分,抓住用户的注意力。

2. 通过Eric Azares添加媒体

静止在屏幕的底部,一个○形按钮被其他四个快速访问的CTA(Call to action,行为召唤)环绕,展示成一个圆形的形状。四个按钮颜色鲜艳,带有快速逻辑符号并且显示出相对巨大的规模。

3. PSD模板

PSD模板界面由Daniel De Santis设计,它提供一个很好的高效浮动操作按钮例子。浮动操作按钮带出一个大面板覆盖了整个屏幕。此外,这个功能也可以免费。所以尽情下载来享受吧!

4. 用户体验探索

浮动操作按钮是复杂的,它要在一行中体现一系列操作按钮调用。展示在屏幕的较低部分,这些按钮需要以水平方式从左到右依次放置。

5. 魔法按钮

漂浮魔术按钮由Lee Giles开发,有着极简约的功能。快速访问提供给用户工作小组来创建他们的书籍。这个设计高度兼容材料站和应用聚集。

6. 拇指界面

拇指的用户界面由Jochem Van Der Veer设计,其转向定位在右侧,有一个简单的外观和引人注目且功能强大的设计。它有时放置应用程序标识的迷你版本。

7. Alternacare

Alternacare 由MayurKarodia设计,允许用户在几秒内解决冗余信息并实现目标。浮动操作按钮的大胆外观和鲜艳颜色主题使它区别于其他内容,吸引用户的注意力。

8. 水滴型FAB

Shu Makino设计的浮动操作按钮是一个有着标准工作流程的动画GIF。由一个一致的变调支持,它包含了七个不同的项目,会一个接一个的出现,并静止在屏幕的右侧。

9. 安卓分数

这个浮动操作按钮由Matt Legaspi精心设计,看起来精致且有着复杂的行为召唤。配上诱人的双色调颜色主题,将行动转化为焦点时达到卓越的美学审美。

10. Swipii应用概念

由Sarah Ahmad设计的概念是许多新解决方案的独特制定。它的功能很好,使访问变得更加容易。它静止在应用程序每个页面的右边,显示一个QR(快速响应)代码的弹出页面,帮助快速地收集点。

总结

浮动操作按钮不仅让用户界面高效而有吸引力,还有助于用户体验。他们已经成为应用程序的必须元素,因为他们坚持方便直接的功能,并且使应用程序更加以用户为中心,也更富有成效。

PS: 关于移动开发,这些产品你可以关注>>
关于UI用户界面,这些产品你可以关注>>
关于移动用户界面设计的最新产品和资讯,请咨询在线客服>!

慧都科技,十三年行业经验,专注提供软件技术整体解决方案,致力打造全球最大的软件技术一站式服务平台。

慧都控件|帮助企业打造成功软件

慧都提供全球优质控件产品/控件培训/项目定制开发/方案咨询/现场实施/项目外包/专业测试

微信ID:EVGET_Huidu

企业QQ:800018081|电话:023-66090381

扫码关注微信

相关推荐

自学Python,写一个挨打的游戏代码来初识While循环

自学Python的第11天。旋转~跳跃~,我~闭着眼!学完循环,沐浴着while的光芒,闲来无事和同事一起扯皮,我说:“编程语言好神奇,一个小小的循环,竟然在生活中也可以找到原理和例子”,同事也...

常用的 Python 工具与资源,你知道几个?

最近几年你会发现,越来越多的人开始学习Python,工欲善其事必先利其器,今天纬软小编就跟大家分享一些常用的Python工具与资源,记得收藏哦!不然下次就找不到我了。1、PycharmPychar...

一张思维导图概括Python的基本语法, 一周的学习成果都在里面了

一周总结不知不觉已经自学Python一周的时间了,这一周,从认识Python到安装Python,再到基本语法和基本数据类型,对于小白的我来说无比艰辛的,充满坎坷。最主要的是每天学习时间有限。只...

三日速成python?打工人,小心钱包,别当韭菜

随着人工智能的热度越来越高,许多非计算机专业的同学们也都纷纷投入到学习编程的道路上来。而Python,作为一种相对比较容易上手的语言,也越来越受欢迎。网络上各类网课层出不穷,各式广告令人眼花缭乱。某些...

Python自动化软件测试怎么学?路线和方法都在这里了

Python自动化测试是指使用Python编程语言和相关工具,对软件系统进行自动化测试的过程。学习Python自动化测试需要掌握以下技术:Python编程语言:学习Python自动化测试需要先掌握Py...

Python从放弃到入门:公众号历史文章爬取为例谈快速学习技能

这篇文章不谈江流所专研的营销与运营,而聊一聊技能学习之路,聊一聊Python这门最简单的编程语言该如何学习,我完成的第一个Python项目,将任意公众号的所有历史文章导出成PDF电子书。或许我这个Py...

【黑客必会】python学习计划

阅读Python文档从Python官方网站上下载并阅读Python最新版本的文档(中文版),这是学习Python的最好方式。对于每个新概念和想法,请尝试运行一些代码片段,并检查生成的输出。这将帮助您更...

公布了!2025CDA考试安排

CDA数据分析师报考流程数据分析师是指在不同行业中专门从事行业数据搜集、整理、分析依据数据作出行业研究评估的专业人员CDA证书分为1-3级,中英文双证就业面广,含金量高!!?报考条件:满18...

一文搞懂全排列、组合、子集问题(经典回溯递归)

原创公众号:【bigsai】头条号:程序员bigsai前言Hello,大家好,我是bigsai,longtimenosee!在刷题和面试过程中,我们经常遇到一些排列组合类的问题,而全排列、组合...

「西法带你学算法」一次搞定前缀和

我花了几天时间,从力扣中精选了五道相同思想的题目,来帮助大家解套,如果觉得文章对你有用,记得点赞分享,让我看到你的认可,有动力继续做下去。467.环绕字符串中唯一的子字符串[1](中等)795.区...

平均数的5种方法,你用过几种方法?

平均数,看似很简单的东西,其实里面包含着很多学问。今天,分享5种经常会用到的平均数方法。1.算术平均法用到最多的莫过于算术平均法,考试平均分、平均工资等等,都是用到这个。=AVERAGE(B2:B11...

【干货收藏】如何最简单、通俗地理解决策树分类算法?

决策树(Decisiontree)是基于已知各种情况(特征取值)的基础上,通过构建树型决策结构来进行分析的一种方式,是常用的有监督的分类算法。决策树算法是机器学习中的一种经典算法,它通过一系列的规则...

面试必备:回溯算法详解

我们刷leetcode的时候,经常会遇到回溯算法类型题目。回溯算法是五大基本算法之一,一般大厂也喜欢问。今天跟大家一起来学习回溯算法的套路,文章如果有不正确的地方,欢迎大家指出哈,感谢感谢~什么是回溯...

「机器学习」决策树——ID3、C4.5、CART(非常详细)

决策树是一个非常常见并且优秀的机器学习算法,它易于理解、可解释性强,其可作为分类算法,也可用于回归模型。本文将分三篇介绍决策树,第一篇介绍基本树(包括ID3、C4.5、CART),第二篇介绍Ran...

大话AI算法: 决策树

所谓的决策树算法,通俗的说就是建立一个树形的结构,通过这个结构去一层一层的筛选判断问题是否好坏的算法。比如判断一个西瓜是否好瓜,有20条西瓜的样本提供给你,让你根据这20条(通过机器学习)建立起...