UI设计细节篇，4步搞定“角标”设计

2.文字+色块

文字和色块的组合是最常见的一种样式，文字的表达简洁清楚又准确直接，一般不会产生歧义。所以抽象的概念，或是本身用图形很难区分的东西，都会选择文字来表达，这种形式经常用于表示分类、属性等。

比如视频网站的独播、首播、自制，这样的情况用文字来表达直接准确不会造成误解，可以降低用户的理解成本。

同时文字还能承载一些文化上的只能意会的隐喻，比如下图的"狠优惠"就准确的表达了信息，"狠"字这种同音字的流行说法具备了两层含义，只有用文字才能体现出来。

试想一下这里如果换成图标图形来表达，就不那么容易了。一是这个概念比较抽象复杂，简单的图形不容易把意思表达清楚；二是即使画出了这个图形，也会因为缺乏普遍共识造成理解上的偏差，所以这种情况直接使用文字是最合理的选择。

另外，文字里还有一种情况是数字，这种样式一般出现在各类榜单、排行的展示中，用来凸显排名，帮助运营推广。

3.图标+文字+色块

这种样式包括图标、文字和色块，面积也比较大，使用场景一般是节日和活动，或者是特殊专题。有活动专属的图标加上文字信息，是一个比较强烈的视觉符号，就像这个活动的LOGO一样，突出活动推出的内容，吸引用户的注意力。

比如喜马拉雅"123狂欢节"和天猫的"618狂欢节"，两个都是节日的图标加文字信息，在活动期间人们浏览产品的时候，帮助更好的突出和区分活动商品。

在选择角标样式的时候，我们可以根据表达内容和使用场景来选择：

·具体的、有普遍共识的内容可以选择icon来展现，不仅美观也容易理解。

·抽象或者是图形相近的内容，可以选择文字直接准确的表达。

·特殊活动可以选择icon+文字一起，组成强视觉符号突出活动商品。

二.色彩

角标色彩的使用其实没有特别严格的限制，不过也需要注意两点：一个是要与背景区别，选择能突出适用于不同背景的色彩；二是要选择和整个产品风格调性相符的色彩，一般可以从：醒目颜色、品牌色和内容相关颜色，三个方面考虑色彩的选用。