必备型|标签规范设计方法探索( 二 )

文章插图
为了获得更丰富的色彩和保持页面统一性，基于12个主颜色，在其中增加白色和黑色，改变明度和饱和度，形成同色系的调色板，在色彩系统里称为Tints and Shades系统，通过此算法可以获得更多色阶满足设计需要。
Tints and Shades系统
我们在skctch里根据tint和shade系统的算法，将其可视化，方便每个颜色都在统一的的规则里形成衍生色，形成基础色板。

文章插图
根据上图我们可以发现：
【亮度区域】：S值以S/5结果值为增量递减，B值以（100-B)/5结果值为增量递增；
【饱和度区域】：S值以（100-S)/5结果值为增量递增，B值以B/5结果值为增量递减;
以我司品牌色，H（29）、S（88）、B（98）为例：
【亮度色阶】HSB参数：（29，88，98）、（29，、70，98）、（29，52，98）、（29，34，98）、（29，16，98）
【饱和度色阶】HSB参数：（29，88，98）、（29，、90，78）、（29，92，58）、（29，94，38）、（29，96，18）
其中运算结果数值出现小数点时四舍五入，根据此算法由此得到12色的基础色板如下：

文章插图
2.1.3 颜色情绪
不同的颜色带给我们不同的色彩情绪，比如一说到蓝、蓝紫、蓝绿、紫、淡蓝等色，则容易联想到太空、冰雪、海洋等物像，就会产生寒冷、理智、平静、稀薄的、淡的、远的、轻的、等感觉。暖色有大红、桔黄、玫红、黄橙、红紫等着色，就联想到太阳、火焰、热血等物像，产生温暖、热烈、危险等感觉，使人产生冲动情绪….，所以标签的色彩应用要与业务的行业属性契合，不只是简单的色彩堆砌，对色彩情绪的了解会我们做标签设计起到事半功倍的效果。

红色：热情、活泼、张扬、激动、警告……
橙色：成功、积极、活力、勇敢、自由….
黄色：年轻、温暖、鼓舞、柔和…..
绿色：自然、健康、新鲜，安全、平静、品质、生命、希望…..
蓝色：理智、安全、科技、宁静、平和….
紫色：高贵、优雅、神秘、权利…..
粉色：温馨、浪漫、明快、真诚…..
…….

文章插图
2.2 形状形状是标签信息的一个外化直观传递，应符合产品的品牌调性（比如直角、圆角、其它隐喻造型…..)，根据我司业务属性将标签大致分为：
基本型：4px圆角矩形，高度以28px为主；
异型：高度以32px为主，具体根据业务场景需要设计

文章插图
在标签组合使用中，同属性的标签造型组合应统一和谐，规避不规则的造型应用如下：

文章插图
三、标签信息层级定义日常项目需求中，最棘手的莫过于，产品业务侧在功能模块里堆加一大堆标签，并且都强调是最重要的，在这种情况下对于设计侧而言就不只是设计好看的问题了，这需要对标签的优先级作出分类，有序的设计表达。对用户而言我们的标签不能即是疗效又是脚镣。
从用户层面与产品层面分别去分析需求对用户与产品的重要程度，配合着KANO模型对需求分析，确定标签的优先层级排序：
产品的角度：产品需要用户能快速筛选信息，促使用户快速抉择转化
用户的角度：用户需要目标信息与自身相匹配，能快速找到需要的信息
3.1 KANO 模型KANO 模型是东京理工大学教授狩野纪昭(Noriaki Kano)提出的通过分析用户对产品功能的满意程度，对用户需求分类和优先排序，从而确定产品实现过程中的优先级可将影响用户满意度的因素分为五类：基本型需求、期望型需求、兴奋型需求、无差异需求、反向型需求。
必备型：如果不满足该需求，用户满意度会大幅降低
期望型：如果提供该功能，用户满意度提高，如果不提供该功能，用户满意度会随之下降
兴奋型：如果不提供此功能，不会降低用户的满意度，一旦提供此功能，用户满意度会大幅提升
无差异型：无论提供或不提供此功能，用户满意度不会发生改变，用户根本不在意有没有这个功能
反向性型：用户根本都没有此需求，提供后用户满意度反而下降