UI图标的风格,常见的有色块风、鼠绘风等

作者:王秋霜

UI图标的风格有色块风、鼠绘风、线性风、强质感风、微质感风。

色块风:背景为圆形或方形,并且一般会使用与图标相应的色系,但颜色相对较浅,主要用于衬托图标颜色。

鼠绘风:更加接近现实里的鼠标感觉,扁平中带有一些光影的感觉。

线性风:线性风格粗细在视觉上一定要一致,可选取部分更换成主色调。

UI图标的风格,常见的有色块风、鼠绘风等

一、UI图标的风格

1、色块风

这种风格有一个圆形或者是方形的背景。然后通常都会使用与图标相应的色系,但是颜色会淡非常多,主要是为了衬托图标颜色的,图标使用大的色块,纯色或者是渐变色,可能还会有一个弥散投影。

2、鼠绘风

这种风格接近于现实里的鼠标感觉,比如说一些水果类图标,就会用一个西瓜来代替。但是呢,这又是通过鼠标绘制的风格,所以在扁平中带有一些光影的感觉。

3、线性风

线性风格粗细在视觉上一定要一致,我们可以选取一部分换成主色调,这样显得线性图标没那么单调,这种图标运用也很广泛。

UI图标的风格,常见的有色块风、鼠绘风等

4、强质感风

这种风格质特别明显,给人感觉像是塑料的风格,高光也非常明显,这种风格要慎用。

5、微质感风

这种风格和鼠绘很像,通常也是使用PS的画笔工具画出来的,或者用形状渐变画出来的。微质感的深入可以让图标风格凸出,质感和层次感强化了图标的立体空间感,在整个界面中可以形成视觉差异,可以体现出模块的重要性。

UI图标的风格,常见的有色块风、鼠绘风等

二、UI设计中的图标类型

1、表意图标

(1)表意图标是解释特定的功能或标记出内容类别的视觉标记。

(2)有些时候它们并不是直接交互的布局元素,而是经常和符合其意义的文案结合在一起使用。

(3)配合文案与图标一起使用,可以降低人们错误识别理解的风险,更直白容易的理解想要表达的意思。

2、互动图标

(1)互动图标可以直接参与到交互过程中,是导航的核心支撑者。

(2)用户可以通过点击互动图标进行体验,可以有效的吸引用户停留在此页面中。

(3)它们的主要目标是告知用户关于按钮、控件和其他交互元素背后的功能或特性。

UI图标的风格,常见的有色块风、鼠绘风等

3、装饰性和娱乐性图标

(1)这些图标更多的作用在于美化页面,而不是功能性。

(2)同时装饰性和娱乐性的图标也是非常重要的,好看的风格和外观同样可以吸引用户。

(3)如果可以非常好的运用这些图标不仅能吸引用户,还能激发用户留下查看的兴趣。

4、应用图标

应用图标是指在不同平台上展示应用的交互式品牌标志,支持数字产品的原始身份。

5、Favicon

(1)Favicon又称URL图标或书签图标,是一种特殊的符号类型。它在浏览器的URL行和书签选项卡中代表产品或品牌。

(2)Favicon可以和用户快速建立视觉联系,具有良好的视觉识别性。

本文由作者上传并发布(或网友转载),本站仅提供信息发布平台,文章仅代表作者个人观点。