图标设计是界面设计中不可或缺的模块,同样是体现设计师视觉水平非常重要的部分。那么大家在设计图标时能够运用的风格有哪些?面对不同的应用场景又应该如何选择呢?下面小编梳理了关于图标的风格分类,让大家对图标有整体认识的同时,更好地运用到实际设计当中。
1. 对图标的风格类型分类有清晰的了解;用到匹配的应用场景中;
3. 图标如何设计及交付;
4. 小众实用的图标下载网站推荐。
简单聊下为什么用图标而不是文字?
首先,是否所有的设计场景都需要用到图标呢,答案是不一定。如果图标的语义不明、风格混乱那还不如用文字表示更为直接。
文字和图标作用的本质都是有效传递信息,与其说图标是一个图形,还不如说图标其实是一种符号,百度百科的定义是:「符号首先是一种象征物,用来指称和代表其他事物。其次符号是一种载体,它承载着交流双方发出的信息。
因此,图标相较于文字来说,显然更为通用,不受国家语言的限制;且在形式的表达上简单易懂,人的大脑对图形敏感度高,视觉化的图标能够帮助用户快速的定位准确信息,同时还能起到突出重点、增加页面的丰富度、强化品牌等作用。
接下来我们看看图标的应用场景如何分类?
为了对图标有个整体概念的了解,先从大的功能上划分,图标分为应用图标和功能图标。
应用图标也叫做启动图标,相当于LOGO在品牌设计当中的位置,代表着每款应用的视觉形象,所以一般具有高度的品牌识别度。
功能图标可以叫做操作图标,它的作用是在界面中辅助用户操作功能,功能图标的风格有很多种,也是本篇文章的主要内容。功能图标还可以从功能场景上细分为:操作指引、功能导航、状态图标、装饰图标、情感化设计图标。
功能图标的风格有哪些类型,如何应用?
在风格上,功能图标主要分为四大类:线性、面性、线面结合以及其他风格,不同的风格可以应用到不同的应用场景。
1. 线性风格
线性风格指的是,用线条描边勾勒出来的、偏简洁风格的图标。它不仅可以做单色设计,还能通过色彩、不透明度、描边变幻出各种丰富的延伸风格。
风格:简洁、轻量
主要应用场景:操作指引、功能导航、状态图标
1)单色
2)双色
3)多色
4)断点
2. 面性风格
面性风格指的是,用色块组成的的图标。它相比于线性图标更加有重量感,表现形式也更加丰富。
风格:丰富、重量
主要应用场景:操作指引、功能导航、装饰图标、情感化设计
1)单色
2)双色
3)渐变
4)质感
5)统一外形
3. 线面结合
线面结合风格指的是,用线条和色块组成的的图标。它相比于线性、面性图标更加有设计感。
风格:设计感、个性
主要应用场景:装饰图标、情感化设计
4.其他风格
其他风格指的是一些相对不常出现的风格。应用于装饰作用,也是表达设计师创新多用的设计形式。
风格:创新、有趣
主要应用场景:装饰图标、情感化设计
1)2.5D风格
2)轻拟物风格
3)像素风格
4)插画风格
图标设计流程
设计图标其实包含在整体设计之中,在最初的产品风格定义的时候,图标的大致风格也就定下来了。众所周知,定义风格我们需要用到情绪版和关键词,而这个关键词的提取对后期设计图标有很大帮助。因此,若是后期接到设计图标的需求时,先不要着急动手,咨询下前阶段的同事,拿到视觉形象化的关键词,更容易和整体风格匹配。
图标设计规范
图标的设计一定要有规整的设计规范,并且在项目时间允许的情况下,尽量在交付之前做一个设计组内的规范自查表:
1. 粗细一致:首先使用统一的描边、线条粗细
2. 圆角一致:使用一致的圆角数值
3. 透视一致:使用接近的透视角度,不要有的侧视有的正视图
4. 大小一致:视觉的大小保持一致,有均衡的大小感受
5. 风格一致:设计风格保持一致
图标的命名、导出与交付
图标的命名一般用英文或者拼音,如果初学者对于英文命名不好理解,那么推荐下面这个网站,它将常用图标命名汇总非常方便。
优波设计
图标的导出一般有PNG和SVG两种格式,主要看开发小哥哥的需求。导出方式也有几种:
1. 上传蓝湖,自动下载和标注;
2. 上传Iconfont,需要符合上传标准;
3. 手动导出本地图片。
小众实用的图标下载网站推荐
阿里巴巴图标库Iconfont大家已经很熟悉了,如果有更多的个性化需求可以看看下面推荐几个相对小众的图标下载网站。
IconPark
字节跳动旗下的一款图标下载网站,相比Iconfont,图标种类不算太多,但图标的规范非常统一,也可在右侧的操作栏更改图标属性,另外还有免费的插画库可供使用。
Iconduck
Iconduck有两个优势,一个是种类非常丰富,有超过十万个图标资源;第二个是可以满足设计师的创新需求。
Iconfinder
Iconfinder是一款全能的图标下载网站,它最大的特点是可以在线编辑,简化了下载-编辑-再上传的过程。
ikonate
ikonate同样是一款可以在线编辑的图标网站,可直接调节线条粗细,size大小。
图标设计的意义不言而喻,不管对设计初学者还是资深设计师来说都是体现其设计能力的重要部分,图标即符号,而符号连接着这个世界,随着互联网的发展,构建统一的视觉符号势在必行。因此,学习好图标设计也是未来的趋势之一。
- End -
来源:视觉半径公众号
相关文章
多种教程 总有一个适合自己专业问题咨询
你担心的问题,火星帮你解答想成为一名优秀的游戏原画师,选择适合自己的培训课程至关重要,本文将为你介绍游戏原画培训的价位以及如何选择合适的培训课程。
想学习插画但不知道选择哪里的培训班?本文为你提供了找到适合你的插画学习班的几点建议。
哪个ui设计技术培训机构好?选择正规教育机构培养专业UI设计师
想要成为优秀的UI设计师?选择正规的UI设计技术培训机构是关键。本文为您推荐了一家专业的UI设计培训机构。
本文从专业角度分析UI培训机构的优势,指导读者如何选择最适合的培训机构。
想要提升广告平面设计水平?了解高端广告平面设计课程,掌握最新设计趋势,提高创意设计能力。
本文推荐了国内知名的游戏美术培训学校,旨在帮助有志于游戏美术行业的学生选择合适的学习机构。
1. 打开微信扫一扫,扫描左侧二维码
2. 添加老师微信,马上领取免费课程资源
同学您好!