UI设计中的提示类小元素
“提示类”顾名思义,对于我们有提示作用的或是有引导帮助作用的都可以归为此类。那么我较先想到的,应该就是让人又爱又恨的“小红点”了。
1.徽标
徽标通俗的叫法就是“小红点”,一般固定在图标或是标签等右上角的位置。它具有非常强的提示作用。强大到有时不想让它出现。
说起小红点就不得不提“红点强迫症”这个词。它是现代人的社交网络依赖症之一,表现为看到它就不自觉的或是强迫性地点击它,让它消失。
2.标签
标签的出现几率也非常高,常出现在电商、金融、生活娱乐类等产品中。它的主要作用是进行分类或突出重点。比如界面中需要我们区分开商品的属性;或是对重点商品、新品进行着重提示等,都需要用到标签。
标签的样式非常丰富——底色、边框、图标组合;矩形、圆角矩形、异形、标题样式等等。
同时,标签可以出现在任何地方——首页、我的页面、商品详情页、搜索页、客服咨询页等等。我们打开淘宝、美团等APP,就可以发现多种样式的标签。
3.图标
这里我会提到四种主要图标类型:
“首页”或“我的页面”标题前的提示性icon
新闻或公示模块左侧的标题图标
页面加载图标
动态提示icon

4.气泡弹窗
气泡出现的场景大致有两种:
一种是新用户次登录或是更新完毕时。主要起到引导和教学的作用。
第二种是新功能、新产品或新话题推出时,主要作用是提醒和宣传。
5.页面指示器
页面指示器就是在banner下方排布的小圆点,会随着banner进行同步轮播,轮播到当前页面时,对应的小圆点会有特殊显示。
6.导航栏
安卓导航栏较原本属于安卓规范当中。目前,很多iOS产品当中也开始使用这种导航栏样式来进行设计,而原本属于iOS规范当中的分段选择器变得不那么常见了。
这种导航栏的优点是除了点击外,还可以左右滑动进行切换,而且并没有对导航栏中的选项有过多的数量限制。
导航栏常见的样式包括文字加线条、底色或品牌图形等,样式丰富。
7.音量条
目前很多产品都将原本弹窗形式的音量显示,改为固定在顶部的条状形式。目的是为了不影响用户的使用体验,能够更沉浸的使用产品。
8.按钮
这里的按钮以uber为例:
在登录时,输入完成手机号下一步的时候,按钮会变成等待状态。按钮与等待演示动效相结合,用流畅的动画消除了用户等待时产生的负面情绪,让整体简洁的页面变得充满活力。
因此,我们在设计按钮的时候,结合场景,可以添加创意,让死板的按钮变得有趣起来。
9.提示性文字
我们常可以看到在产品中的“我的”页面中,标题右侧会有一行文字提示。有些是单纯的提示性文字,而有些则会显示重要的数据,方便用户在不点开二级页面的情况下进行查看。
不仅如此,设计师还可以对这类字体进行设计,或是添加图标来丰富它的设计样式。