(https://medium.com/@101?source=post_page——-acb6dee36e8a————————————————)
图标是图形用户界面中最常用的元素之一。是什么使一个好的图标？
在本文中，我想共享一个简单的清单，您可以用来确保所使用的图标对用户有用。
1.容易辨认
清晰是一个出色界面的最重要特征。不幸的是，图标经常会打乱清晰度。
图标必须首先传达含义。当不清楚该图标代表什么时，它立即失去其含义，并且只不过是视觉上的噪音。
图标之所以如此出色，是因为无需阅读标签即可理解其含义
一些简单的规则将帮助您避免使用不传达含义的图标。
尝试使用用户熟悉的图标
用户对图标的理解基于先前的经验。这就是为什么最好使用熟悉的图标而不是独特的图标。
- 依靠通用图标。像首页，打印，播放和搜索之类的图标非常普遍，因此不需要任何解释。
具有普遍意义的图标
- 进行研究。检查竞争对手使用的图标。
请勿使用含义冲突的图标
应避免使用可能代表多个事物的图标。例如，“心”和 “星” 图标都可以表示喜欢或将某项放置到收藏夹中。当一起使用时，它们会使用户迷惑。
心和开始图标是具有冲突含义的图标
测试图标含义
不要听 “人们每天都会使用我们的应用；他们将了解我们图标的含义。” 测试您的图标！
5 秒规则是测试图标的有效方法。问人们他们期望图标代表什么。
如果想花 5 秒钟以上的时间来思考一个合适的图标，则该图标不太可能有效传达含义
测试可扩展性
测试您的图标是否仍然可以以 15 x 15 像素的小尺寸识别。
音乐图标可以很好地缩放
将不熟悉的图标与标签配对
如果仍要使用唯一图标，请考虑同时使用文本标签。
图标与文本标签配对
不要重新定义图标的含义
通过更改图标的含义很容易使用户感到困惑。如果图标的功能与预期的不同，则会使用户感到困惑。
不要重新发明轮子！
即使意义上的微小差异也会阻碍用户理解图标的能力。
长期以来，Google 文档使用的图标几乎就像汉堡包一样。大多数界面使用类似的图标表示主导航菜单。但是 Google 重新定义了其含义，并将其用作 “后退” 操作。当用户单击此图标时，他们将被重定向到 Google Docs 主页。
2.视觉上令人愉悦
可以通过插图，颜色和图标传达品牌个性。正确完成后，图标肯定可以增强设计的美学吸引力。
减少图形细节的数量
KISS 原则适用于 UI 的所有元素，包括图标。遵循以下两个规则，使图标尽可能简单，并避免不必要的复杂性：
- 限制使用的颜色数量。使用不超过 3 或 4 种颜色以保持设计清洁。
- 通过关注对象的基本特征来减少图形细节的数量。尝试保持设计原理图，因为原理图设计可以在不同的屏幕和分辨率下很好地转换。
不要太花哨了。避免设计带有过多图形细节的图标。
通过添加动画效果来创造喜悦
动画既可以具有明确的功能目的，也可以使用户满意。对于状态更改之类的情况，可以使用动画来创建更动态的体验。
3.适当大小
图标应该是用户的良好目标。在手机上为图标留出的空间太少是设计师中最常见的错误之一。当设计触摸时，请确保图标的大小足够大，以便可以用手指轻松触摸。触摸屏对象的建议目标大小为7–10mm。另外，请确保在目标之间添加填充以防止错误点击。
实际目标大小 = 视觉目标大小 + 填充。图片：微软
4.一致
一致性是设计中的关键原则。
一致的设计就是直观的设计
当相似的元素以相似的方式具有一致的外观和功能时，可用性和可学习性都将得到改善。
内部一致性
图标集应具有视觉统一性。您决定用于产品的图标应具有相同的样式。理想情况下，它们都应该看起来像是由同一个人设计的。以下是创建团结感所需遵循的一些规则：
- 对所有图标使用相同的颜色或配色方案。
- 对所有图标使用相同的形状和其他样式属性（例如边框的大小）。
凝聚力不足的图标看起来不对
与平台的一致性
确保图标的样式与您所针对的平台一致。它们将是您的用户最容易识别的。
Apple iOS 和 Google Android 图标
与产品系列的一致性
如果您有产品系列，请确保在所有产品中使用相同（或至少相似）的图标样式。
通常，很难为您的项目找到合适的图标。这就是为什么我要共享资源列表，这将使此任务更加容易。我会定期更新列表，因此您会在此处找到更多有用的资源。
计算机与人之间的交互应该像两个人之间的对话一样直观。交互设计基金会将帮助您学习如何设计以提高效率和说服力。
https://uxplanet.org/checklist-for-using-icons-in-ui-acb6dee36e8a
若有收获，就点个赞吧
0 人点赞
