设计师必须看图标指南。
色彩色彩、字体、图标、图形形状、图像和空间是平面设计中非常重要的六大要素。对于UI设计来说，图标可以说是整个产品的点睛之笔，甚至可以直接影响到一个产品的形象和气质。
很明显，图标不是界面设计师发明的。作为交流的对象，它们有着悠久而多样的历史，植根于古代。它们出现在地图、标志、程序、手册和许多其他信息来源中。然而，随着新技术和图形用户界面的出现，图标经历了一个新的转折点。
历史上，在20世纪70年代初，施乐公司提到了第一个图形用户界面的图标:图标是在一台名为施乐Alto的机器上实现的，价格非常昂贵，并没有真正普及到广大用户。然而，这仅仅是一个漫长故事的开始:1981年，施乐之星发布，被称为第一台将图标作为界面一部分的消费电脑。特别是应用了目前为止文件夹和垃圾桶的图标。这些是20世纪80年代的图标。
表意图标(也称为解释性图标)
表意符号是指原本不存在的符号，是在发展过程中创造出来的符号，用来表达某种特定的意义或操作行为。而且这些符号在发展过程中，逐渐继承了一些象形符号的特点，把符号本身当作“实物”，不断进化。例如，“箭”已经从最初的“弓箭”逐渐衍生成一种特定的表意符号。
交互式图标
具有双向信息传递的能力，既可以向用户传递一些信息，指导用户进行特定的操作，又可以让用户向程序传递控制信息，这在功能重要性上是最重要的。比如登录注册按钮，切换按钮，数量按钮，喜欢，转发，分享都是交互图标。
装饰和娱乐图标
通常用于提升整个界面的美感，深化个性化的设计风格，不具备明显的功能性。这种图标迎合了目标受众的喜好和期望，具有特定的外观风格，提升了用户的在线体验，迎合了受众的喜好，增强了设计的亲和力。装饰图标通常显示季节性和周期性特征。如在线活动、用户评分、空页面等。
应用程序图标
各种操作系统平台上不同数码产品的入口和品牌展示的logo，就是这个数码产品的身份象征。在大多数情况下，它会将品牌标志和品牌颜色融入图标设计中。一些图标也将使用吉祥物和公司视觉识别颜色的组合。真正优秀的应用图标设计，其实是市场调研和品牌设计的结合，其目标是创造出用户在屏幕上无法快速找到的醒目设计。
象形图标
Ios在相当长的一段时间内流行“Skeumorphic设计理念”，属于超写实设计。相信只要能在应用上增加实用和物理的纬度，越是与现实相似，越是与操作相同，用户就越容易理解操作方式，接受度也就越高。比如日本富士山这个著名的图标，说明好的设计不仅仅是美观，更是功能性的，尤其是与旅游相关的设计，需要人们跨越语言的障碍。
隐喻图标
icon中的隐喻元素很重要，可以让我们一看到这个图标就知道它的意思。例如，房子代表主页，叉代表错误或关闭。当我缩小一个图标时，我总是保留隐喻的元素，以确保图标仍然能够准确地传达信息。
工具图标
主要按行业类别分类，应用广泛，公众或业内人士认可度高，使用时间长。比如:建筑行业，医疗行业，化工行业等等。
混合图标
也就是说，前三者的结合是为了达到不同的视觉效果和应用结构。前段时间流行的MBE粗笔画风格图标，是综合图标的产物，多表现设计者的个人设计风格，或者适用于某种设计感很强的软件。
字符图标
“字形”一词来源于排版领域，如今随着数码设计的发展，它也逐渐在数码设计领域生根发芽。它来自希腊语，意思是“雕塑”。在排版领域，符号图标通常是一种具有特定意义和功能的书写系统，可以表意和书写。它可以是字母、图形，有时甚至是两者的组合。
在这种图标设计中，天气图标是比较典型的一种。从单一图标到组合图标，都能充分体现。
平面图标
平面图标包括直线、平面、直线+平面和平面+平面。多样化、可扩展、更个性化、更年轻化的图标，在设计风格相同的情况下，改变颜色后可以反映和传达不同的信息。
拟物化图标
拟物化图标是平面图标的对立面，就像拟物化图标的设计者常说的，它是“复制现实”，试图将现实世界中的形状、纹理、光影融入到整个图标的设计中，这是它的特点。准物化图标的设计趋势几乎是伴随着Macintosh的诞生和演变一步步走过来的，然后从UI设计领域被扁平化设计所取代。但是，准物化图标仍然广泛应用于不同领域，尤其是游戏设计和游戏产品的图标设计。2.5D图标和桌面应用程序图标。
Windows、iOS等。，中文版，英文版甚至各种语言版，打开菜单之前基本都是一样的。很多图标很快被大多数用户认可，甚至成为国际图标。比如Windows UI。
当一个图标可以清晰地表达其含义时，只需要占据一个字符的位置就可以向用户传递操作信息。比如邮件扫描后发送成功，用副本表示需要3-4个字，英文或其他语言可能更长，但用图标代替只需要一个字符位置。
支付宝右上角的+表示更多功能，此时一个字符位置说明其含义清晰；微信下一个类似的声波图标代表语音，直观易懂。
进入碎片化时代，读图几乎是同一个节奏。图片内容可以在短时间内产生较大的影响力。研究表明，大脑处理图片内容的速度比处理文本内容的速度快60000倍，人脑对图形和图像的记忆远远好于文本。所以在推广品牌的时候，图片内容可以说是一张图胜过千言万语。使用图标通过视觉引导帮助用户快速识别信息。
没有任何关于Tik Tok和ins的书面解释，我们知道第五个标签是个人中心。
科学证明，大脑中与视觉信息处理相关的脑区相对于其他感官是占优势的，人脑对图像的记忆远高于对文字的记忆。图标大多使用几何图形，并以对称和一致的设计目标进行设计。由于其高度集中的特点，图标更加简洁，更容易记忆。
图标的最底层逻辑:线性图标、平面图标、线+平面图标、平面+平面图标、2.5D图标、准物体图标。网上的各种图标都是在这些基础上进行视觉区分的，设计图标时需要思考。
1，产品视觉风格定位(行业领域)
2、图标特定的应用界面
3.产品的用户人群是什么？
先看一组风格不同的图标。从上面不同的APP图标可以看出，不同的行业，不同的场景，不同的用户，图标的设计和表达是不一样的，所以你在设计之前需要思考，你需要表达的设计思路，产品的定位。
1，反汇编关键字和关键字关联
把需求信息中的关键词拆解分散，变成生活中常见的东西，释放它所代表的内在意义。同义词、近义词、具有相关形状的对象或关键字的相关关联。
比如说到荣誉，你马上就能想到奖杯、证书、金牌、皇冠等等。然后通过这些词的联想，找一些气质相同的图片做一个情感版，通过它你可以感受到产品的调性，然后提取一些形状和颜色作为产品图标的主要形状。
2、根据关键字关联输出图形。
根据上一步拆解的文字或物体，通过简单的基本形状，转化为生活中常见的图形。常用的2合2方法是用AI钢笔工具(草图贝塞尔工具)或者布尔运算来画。
3、根据场景输出
这里的场景可能是实际应用场景，比如大众点评标签栏、功能区(分类区)、操作图标等等，需要引导用户点击，所以视觉上更丰富；而个人中心、分类区、详情页更注重功能引导，相对简单，属于二次使用场景，线状图标较多。
常见图标文章分析要注意十点，但是这些没有规律和逻辑很难记住，而且一旦记住就容易忘记。这些总结实际上来源于材料设计或iOS规范。如果你仔细研究这些细节，制作图标并不难。
图标端点分为直角和圆角。我们应该统一图标端点，在设计过程中保持一致的设计语言。
角落
与其他图形相比，人眼更容易识别圆角矩形而不是直角矩形，因为中央凹是人眼生理结构中视网膜最敏感的区域，处理矩形的边缘需要大脑中更多的“神经成像工具”。因此，人眼更容易处理圆角，因为它们看起来比普通的矩形更接近圆形。
鱼片本身的圆润会给人一种圆润、可爱、更安全、更贴心的感觉。所以社交、娱乐、直播、美食等图标都会使用圆角图标。
直角会给人一种犀利逼人的感觉，图标整体细节较多，通常出现在金融等商务属性较强的产品中。比如:36Kr，金融产品等等。
均匀倾斜角
内部空间比例的不一致很容易导致图标视觉焦点的不一致。如下图，左边第二个图标略低，第四个图标重心较高。右边是早期PP助手的标签栏图标。图标内部镂空面积百分比相同，整体视觉和谐统一。
画笔画图标时，要时刻注意图标的笔画粗细是否均匀。在@1x的设计模式下，如果以24px作为网格基准，常用的图标粗细有:1px、1.5px、2px、3px、1.5，这就需要更高的显示屏(半个单位的路径会导致图标最终显示时边缘模糊不清)。
细笔画给人更精致的视觉感，粗笔画相对粗糙。由于当前流行趋势的发展，经常会出现粗笔画和细笔画相结合的设计风格。
除了保持相同的视觉重量外，图标的笔画宽度也应保持一致，以实现像素级的统一。元素之间的最小间距应大于或等于笔画宽度。
苹果、谷歌、IBM、国内阿里蚂蚁设计都发布了相关的图标网格规范。这里用谷歌的物质系统图标网格来说明。在24*24px的图标尺寸中，上、下、左、右安全余量为2px，关键形状的四种基本形状为圆形20*20px，正方形18*18px，垂直矩形和水平矩形20*16px。通过关键形状的规则统一图标的大小和位置，达到视觉平衡。
对齐像素点
锐度(完美的像素对齐)为了避免图标扭曲，可以通过将X轴和Y轴坐标设置为整数来定位图标在像素上的位置。使用软件AI或素描时，画基本图形时不要有小数点和奇数，要用偶数。
我们知道了icon的基本知识，如何判断我们的icon是否合适，是否适合整个产品？我们需要知道什么是好的图标。检验标准也是基于我们得出的标准，即:可识别性、规范性、整体风格、品牌感。
判断事物的价值在于它是用来做什么的，图标的目的是帮助用户理解信息。所以准确的表意表达(清晰准确的信息传递)是图标最重要也是价值最低的。如果设计出用户看不懂的图标，即使视觉很美，也没有任何价值可言。
意义识别:视觉语言是否取代书面语言，简而言之，就是让你的图标让用户看得懂，又不会造成歧义。普通标签条指南针表示发现，房子表示主页。
视觉识别:是图标的大小、颜色、线条粗细，影响视觉识别，在特定风格下提高视觉识别。
要保证图标在视觉尺寸上的一致性，图标的丰满度(正反形状)，遵循同一规律和细节的统一性。这里的四点在之前的绘图过程中已经写的很详细了。
整体风格是要注意图标所传达的性格是否与app的基调一致。因为每个产品的定位，整个app的基调对于不同的人是不一样的。比如腾讯动漫就是喜欢漫画的类型，所以图标设计也要体现这种性格，尽量用漫画圆角的方式来设计。一句口号:在复杂的世界里，一个就够了。整个APP从启动图标到整体调性都很简洁干净，克制的使用色彩传递出产品的调性。
品牌感就是要和上面说的品牌理念保持一致，传达给用户同样的感受。通过吸收品牌色彩，提取品牌元素，利用品牌吉祥物和品牌图形提取品牌基因。我们应该尝试从品牌设计的角度去理解，找到自己产品独特的品牌气质，选择合适的手法。然后将这些元素可视化，整合到界面设计中。以下产品从产品名称到启动图标设计都高度集成。
图标可用性测试是基本规则，来源于图标验证。
认可程度:
1.用户能理解图标的含义吗？
2.是用户熟悉的图标吗？
3.和其他图标有冲突吗？
4.你能通过5秒原则吗？
5.图标的可扩展性如何？
6.需要添加文字标签吗？
设计统一吗？
1.视觉语言统一吗？
2.图标的设计复杂度是否统一？
3.整体设计在视觉系统上是否协调、统一、高度集中？
4.图标整体配色是否统一？
品牌信息:
图标是否独特，能否传达品牌信息？
一般来说，有四种交付格式:JPG，PNG，GIF和SVG。其中JPG、PNG、GIF都是位图，受限于图片本身的分辨率，无法灵活修改。SVG是一种矢量格式，支持无损缩放。
在SVG之前，需要切割各种倍数的图标，以适应高清设备。但是现在的开发软件和插件都有自己的切割多张图片的功能，比如蓝色泻湖。
JPG:兼容性强，自带背景，不支持缩放。
PNG:支持透明格式，但不支持缩放。注意图标周围透明区域的大小。
GIF:使用了简单的动态图标。背景透明的时候边缘会有锯齿，所以没有办法支持丰富的颜色。
SVG:无损缩放矢量图形，体积小，支持单色模式下颜色的开发和自修改，可以修改样式参数。
另一种投放方式是将SVG格式的图标上传到类似iconfont的网站，然后完成图标的投放。应该指出的是:
1，SVG不支持渐变颜色填充。
2.SVG不支持笔画，所以笔画需要转换成封闭的图像。
3.当图标大小相同时，需要在图标下方添加一个大小相同的透明方块，并与图标一起导出上传。
而Iconfont对图标制作的要求比较严格，上传时需要注意检查自己的图标是否符合要求。互连
数据源
UI设计师想做好图标设计？你知道图标的历史吗？
图像学简史
《图标设计指南》
《偶像乌托邦》
《界面图标集终极指南》
Svg徽标库以及与图标字体的比较