火星网校
终极图标设计指南——理论篇优化版
发布时间：2024-08-28 11:32:30 浏览量：200次
如今的用户界面中，图标绝对是不可或缺的元素。虽然绝大多数的图标都很小，甚至不被人注意到，但是它们帮助设计和用户解决了许多问题。
图标是可用性和导航的关键，用户能够感知到图标的功用，但是只有设计师才会明白，想要让图标简约、可用还富有表现力，要耗费多少时间和精力。
我们每天接收到各种信息，美的丑的，很多时候我们看的都是别人家谁做的高端的，拔高自己的同时，基础不能落下。
扎实的基础是拔高的前提。乔布斯曾经说过：“细节至关重要，花费时间仔细打磨是值得的”。
图标是现如今UI界面中可用性和导航体系的核心组件。所以，这篇文章分为上篇、中篇、下篇三部分，仔细总结图标的基础知识。
一、什么是图标
图标是用户界面不可缺少的元素，具有高度浓缩并且可以快捷传达信息、便于以及的特性。
二、图标的意义
随着人们工作越来越忙，图标已成为了生活中的一部分。帮助我们快速定位，帮助我们快速的做出决定和行为，以及帮助我们找到需要的东西。
三、图标的优势
图标设计是界面设计中很重要的元素之一，一套高质量的图标对产品的品牌形象和用户的体验影响是巨大的。不仅能提升界面美观度、降低用户理解成本，还能塑造品牌形象、提升用户的安全感和转化率。
1. 图标传达信息快
本身对图形的理解和接收能力就比单纯的文字要快。图形能更简单清晰且很直观的展示。
2. 图标传达信息准
通用图形能跨语言、跨地区、跨文化群体表达出同样含义，不易发生混淆。
3. 品牌塑造稳定
同一个品牌、同一个平台保持同样的风格图标，会让人感到很专业。
4. 减少用户辨识时间
通过简单快速的查看就可以知道图标中携带的复杂信息。
四、图标的类型及设计属性
图标根据具体实际用途大体可以分为三大类：工具图标、装饰图标、启动图标。
五、如何选择线性还是面性
线性图标顾名思义用线条来表现绘制。面性图标也就是一个物体的剪影，用块来表现语义。
六、如何准确运用图标
1. 面性图标的运用
面性图标视觉表现力强，有效的强调页面的视觉重心。
2. 面性与异形图标的运用
面性图标的第一视觉是一个色块，异形图标第一视觉是个形状，所以面性图标视觉表现力强。
3. 用图标区别视觉层级、业务板块
图标有主有次，有视觉层级，强化用户常用的或者产品主推的业务。
七、图标的用色原则
图标的颜色应保持合理性，保持视觉舒适。
八、图标的大小规范
iOS的网格大小要求是4的倍数，安卓的设计规范要求网格大小是8的倍数。
九、图标常用尺寸
@2x格式使用机型：iPhone 4，4s，5，5s，5s，s，6，6s，7，8，XR；
十、如何统一图标
1. 创建凝聚力的图标集
保持集合中每个图标的大小相同，使它们保持一致。
2. 为什么图标应该具有凝聚力
在整个集合中使用相同的元素会使图标看起来更具凝聚力。
十一、B端、C端图标的差异
1. 图标内容差异化
C端产品的图标设计更具备独特的视觉风格。
2. 不同的设计难点
C端产品图标更多偏向趣味性，B端产品图标更讲究延展性。
十二、小结
整个图标设计分为三篇来讲述的。
- 《理论篇》主要讲述图标设计的概念以及设计原则等理论内容；
- 《工作篇》主要讲述工作中图标设计过程以及图标落地；
- 《分享篇》主要分享图标设计的工具、图标网站、图标设计团队或者设计师。
© 火星时代教育，电脑给他们参加自适应绘制，三星的长宽比是三比一。
热门课程推荐
热门资讯
-
想要了解iPhone6界面设计的尺寸规范吗？这里为您详细介绍iPhone6的UI设计尺寸规范，包括界面尺寸、图标尺寸、可点击高度规范、搜索栏高度规范以及界面元素之间的距离规范。
-
将为大家介绍12个绝佳的UI设计网站,这些网站不仅可以为你提供灵感,还可以帮助你学习新的技巧,助力你的创意之旅!dribbbleDribbble 是一个面向设计师的...
-
3. 移动端UI设计中常见的5种APP界面类型，你get到了吗？
通过介绍移动端UI设计中的闪屏页、引导页、浮层引导页、空白页和首页等5种APP界面类型，帮助大家更好地了解UI设计的基本知识
-
在移动端设计中,列表页和表单页是不可或缺的部分。一个好的列表页和表单页设计能够让用户轻松地获取信息并产生点击欲望,从而提高点击率。本文将为你...
-
怎样可以提升你的UI设计能力!第一个:站酷站酷想必是设计师都知道的一个网站,里面不止有UI设计的资源,还有其他设计的,不如:平面设计、网页设计、字体...
-
对于想要提高自己的设计能力和创造力的小白和UI设计师来说,这本书是一个很好的选择。4.《设计的觉醒》(IKKO TANAKA)推荐理由: 这本书是日本现代平面...
-
探索零基础UI设计培训的时长与薪资前景。了解数字艺术教育领域的专业课程，以及培训后的职业发展机会。
-
ui设计应该让用户一目了然,能够快速找到所需的信息和功能。在设计过程中,应尽量使用简洁的图标、文字和色彩,避免过多的视觉干扰。符合用户习惯:ui设...
-
9. 设计中的色彩心理学:浅析中西方色彩的历史演变与设计应用
摘要:本文探讨了色彩的历史演变和设计应用。通过对色彩在早期文明社会中的实用运用、不同文化背景下色彩观念的差异、色彩在设计中的重要性以及新兴技...
-
大家今天走运了,我就把自己总结出来的学习UI设计的一些经验与大家一起分享吧。想做一个好的UI设计师除了应该具有一定的审美能力,还要了解整个产品的...
