UI设计中，“小元素”有大用处！

悬浮按钮最开始属于安卓规范当中，之后在iOS产品中也被保留了下来。虽然在官方规范中并没有此类按钮，但因为他使用起来非常方便，并且国内很多软件安卓端和iOS端都是使用一套页面。因此，包括悬浮按钮等一些共性设计就都被保留了下来，在两个平台均可得到使用。

马蜂窝

荔枝fm

马蜂窝

悬浮按钮不仅仅可以完成点击等常规操作，还可以作为收藏容器将更多地功能结合在一起。而且位于屏幕右下角，方便用户使用。

3. 顶部扩展内容

扩展区域是我个人对它的命名，这部分区域在页面的顶部。因为空间足够大，所以许多产品可以添加更多的设计想法在里面。比如添加日期或者天气等。

像一些特定的产品会在顶部的区域放置一些特有的功能。比如蚂蚁金服的智能助手等。

蚂蚁财富

UC浏览器

看理想

4. 功能性按钮

此类按钮也是非常多见的。比如，导航栏右侧或标题栏右侧的更多按钮，它的形式多以三点为主，也有文字、阵列点灯样式。

三道杠icon多是抽屉导航代表图形；箭头基本都是下一页或返回的固定图标形式。以上图标均被广泛使用，已经成为了用户的一种固有认识。

因此，我们在设计时可以在此基础上进行升级或创意性优化。切不可过分颠覆他们，不然会增加用户的学习成本。

5. 下拉/上划

①下拉刷新功能已经成为了一种默认操作。根据产品的属性定位，我们会见到各种不同风格或是设计元素的下拉动效。设计师可以根据品牌延展元素，融入更多的想法，让页面变得更有趣。

土豆视频

②拿点融投资来举例，上划到页面底部会出现宝箱图案。随着我们上划的幅度，宝箱会打开出现宝物和品牌形象。上划到底则直接跳转到另一页面。这种设计让我对页面底部的空间有了更多的想法。

点融投资

6. 视频进度条

视频进度条放置在视频底部，是视频类产品不可或缺的重要控件。当视频播放时会自动隐藏。除此之外，进度条位置上还可以集成其他功能。比如全屏、点赞、收藏、弹幕开关等。

哔哩哔哩的视频进度条：当拖拽控制按钮时，小电视icon会随着我们拖拽的方向而改变。虽然看似是很不起眼的设计，但在视频区域也可以左右滑动调整进度时，进度条的小icon就能很好的展示出来，充分体现其趣味性。

哔哩哔哩

三、视觉类

虽然说是视觉类的设计，但还是要尽量避免加入过多无用元素，不能为了装饰而设计。要结合自身产品，满足视觉平衡，要达到情感化设计的目的。

1. 缺省页

通常状态是，当前页面没有内容或无网络状态下出现的页面。由于此页面没有内容，设计师发挥的空间就变得很大。根据产品属性和品牌延展图形，结合动效或插画等情感化设计，可以很好的丰富页面内容。

点融投资

我想应该没有人喜欢看到缺少内容的页面，这会给用户心理造成很大的落差。非常影响体验。因此，缺省页就变得格外重要。如果设计得当，非但不会影响体验，反而会让用户喜欢上它。

除了视觉方面的设计，缺省页也可以添加刷新按钮，在功能层面进行完善。

（编辑：核心网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!