接触UI这个词是我高考后填写专业时遇到的一个词。我真正开始尝试是在大二的第二个学期。那个时候，我对UI的理解还很肤浅，仅限于手机主题图标。图标只是 UI 设计的一小部分。这个技能在很多公司的工作中可能不需要掌握，因为与公司产品图标或者LOGO修改相关的工作比较少，但是我认为图标的绘制是每一个从事者必须掌握和理解的技能在用户界面中。
UI 是用户界面的缩写。一般是指用户的操作界面，而UI设计主要是指界面的风格和美学。在使用方面，软件的人机交互、操作逻辑、界面美观的整体设计是另一个同样重要的做法。一个好的UI不仅要让软件有个性和品味，更要让软件的操作舒适、简单、自由，充分体现软件的定位和特点。 ICON的发展历程
1981 年，施乐推出了世界上第一个带有图标的系统
1983 年，Apple 推出 Apple Lisa
1985，Windows1.0
1985 年，Amiga 工作台
1990游戏图标制作教程，Windows3.0
1995，Windows95
以上时代的UI图标大多是辅助功能
1997年，MAC OS 8（从这个系统开始，UI开始变得重要，它是成功应用图形用户界面的操作系统）
2001 年，MAC OS X（苹果成为 UI 行业的风向标）
2001年，Windows XP（人类历史上使用时间最长的操作系统，历时12年零6个月）
2006，Windows vista（从 XP 到 win7 的过渡）
2008，MAC OS X 雪豹
接下来是 Windows 7 等等，我们这一代人都知道。
从最初的像素化到超写实到现在的扁平化，从会用到能看懂再到好用好看，UI行业的发展越来越完善。
ICON的基本练习
我个人用的两个软件是Photoshop和Illustrator
Photoshop其实可以完全胜任任何风格的图标绘制，Illustrator我主要用来绘制线性图标，实现起来比较方便。
1：关于线性图标
我们来说说在 Illustrator 中绘制线性图标的好处：
我以新浪微博客户端的个人中心为例：
Illustrator绘图完成后，可以扩展成可编辑的图形，通过复制粘贴的方式导入PS，更加灵活方便后期修改和维护。
您也可以直接在PS中绘图。有两种方法。一是用笔画。在 Illustrator 中绘制后导入 PS 稍微麻烦一些，最终输出的效果是一样的，灵活性也是一样的。
2：关于绘制超写实、拟物和半相似
绘制这样的图标需要耐心。如果没有足够的耐心和细心，根本无法胜任这样的绘画作品。
我最初的学习是从观看教程开始的。这些教程详细教你如何打开PS，如何新建画布，如何使用布尔运算。当我第一次开始学习时，我很困惑。天哪，我怎么记得这么多颜色值？其实，我不需要记住这些东西。观看此类教程的要点是如何进行布尔运算以及如何使用形状工具。如何使用剪贴蒙版，以及非常重要的图层样式面板！ （最新版PS cc的图层样式非常好用，很多样式可以叠加使用，省去了绘制多个图层的麻烦，但是在低版本PS完成后无法打开）
在YouDesign网、学习UI网、小课堂等这些教程中可以找到大量案例。但是有很多教程不是图标原作者写的，所以图标绘制的精致可能不如原版，只能作为理解参考如何使用软件。
熟悉了软件的几个常用面板后，就可以开始抄袭了。尽量复制原作，复制品的相似度必须达到90%以上才算合格。
这些是我过去复制的一些图标。那个时候我基本没有分辨好坏图标的能力，所以你会看到我抄了这么丑的游泳圈和这么丑的肥皂。投影的处理也很简单粗暴。虽然我的静物素描还不错，对光影的运用也略知一二，但是知道了这些东西，我还是过不好自己的生活，哦不，我还是画不出这个图标。
复印时注意不要吸收颜色！直接挑原色对你没有任何好处。
我在这里推荐一个同学的临摹作品。我在 LOFTER 上跟着她。那个时候，她每天练一分，练了3个月，还不是100%抄。她会尝试改变很多作品的颜色，比我好很多。
强烈推荐：全屏图标看起来很棒！地址：#Dailyicon#End~-Claire.J
那就尽量不要复制，开始独立画画
这是我大二的作业，做一个音乐播放器界面，是不是很丑。 . .
这是我看了邵老师的视频教程后第一次画了类似的镜头，然后第一次发到UI中国。其实画的也很一般，就是不知道为什么推荐到首页。开心（后来才知道这个平台是为了鼓励大神和新人一起成长，所以只要菜鸟认真的，也会给你一些展示和鼓励的机会）
然后我抽出一把枪来锻炼耐心。我个人当时将其定义为超现实主义。如果是在众神眼中，在现实主义上肯定有很多不足。 ，我懵了，还以为我挂了！所以我埋下了一年后被专家扇耳光的机会），以及一个非常烦人的相机：
理论上，有了首页的鼓励，我应该认真起来，但我没有。你可以看看我的地址（过去一年，因为发现太多不足，不敢随便发）：永电的设计作品-UI中国
现阶段，工具的使用非常灵活，但我仍然无法做出漂亮的图标，因为我还没有认真到仔细抠出颜色、高光和环境色的细节。
让我分享一下我最近画的图标。我打算重新开始练习。这个供参考（我收集了很多图标作品，当我需要画东西的时候，我通常会去自己的收藏，看看素材库里这些优秀的图标，学习学习）：
我自己总结了几点：
1、绘制的形状大小需要为偶数，否则不对齐。另外，设置对齐像素，注意虚拟边缘。在我的理解中，UI 是要美观且非常理性的。
2、画完基本形状后，我们就开始堆叠颜色和添加各种样式，记得先从物体的自然色开始。当我第一次尝试绘制图标时，我曾经陷入误解。我先画了光，然后画了黑暗。正确的顺序应该是从深到浅的颜色堆叠。永远记住光源的位置，即使是高光，也要注意颜色可能会有变化。
另外，不要着急配色。您可以仔细考虑将图标视为手工制品。你可以看看我上面画的透明纹理珠子。它的主色是绿色，但是你可以仔细看看暗部的反光，或者是亮部的高光，有两三个颜色变化，还有小高光，上半部分是黄色的，下半部分是绿色的，上半部分肯定会比反光亮。 （我画了512px*512px，这个截图放大了2倍）
3、像素描一样的一面！这个像素有时非常重要。在两个图形的亮度和色相饱和度相近的情况下，如果没有按下一个像素的笔画，你想表达的可能就跳不出来了。这是在 UI 中。很多同学应该都知道它在界面绘制中的重要性，很多人可能没有注意图标。比如我上面画的不管是珠子的边缘还是叶子的边缘，包括最需要笔画的木纹，圆角矩形的边缘，都有一个像素的笔画，笔画需要选择内笔画。颜色不应该是纯黑色和纯白色。需要根据绘制内容的颜色进行调整游戏图标制作教程，一般颜色较深。
4、渐变色。眼尖的同学可能会注意到，我们在使用渐变的时候，经常会出现颜色渐变不均匀的情况，这是因为没有勾选“仿”。另外，我们要注意渐变色的选择。我曾经改变亮度或纯度。完成后，它看起来毫无生气。其实我们可以在渐变的另一端稍微改变一下色调，不要太多，刚刚好，会更鲜艳。
5、投影。投影必须是矢量！请注意，它是矢量！后期可以调整！不能是像素图的高斯模糊。
投影非常重要。投影的质量会对我们的渲染产生很大的影响。之前没注意，比较懒。这一切都是通过单层阴影样式完成的。最后的效果是如果和大神们画的图相比，你会觉得自己LOW。我自己还没有这样做。
绘制投影有两种方式，一种是直接用形状工具绘制形状，然后通过调整属性面板的羽化值来控制模糊；另一种是关闭形状图层的填充值，然后使用图层来调整样式中的投影，需要勾选图层挖空投影。我一般是做三层投影叠加，一层是最接近图标和最暗的部分，会有四五个像素的投影，然后是一个过渡，最后是最大范围和最亮的颜色。这样可以观察现实世界中的投影，投影也可以有轻微的颜色变化，避免了纯黑色的气密性。
最后，如果你有事要做，那就多练习。除了以上练习，还可以重绘一些图标进行练习。现在它们基本上是平的，我们可以把它们变成半物体！ （下：前几天重绘的映客图标）
还有一个平面图标的绘制技巧，因为我没有画过很多这样的图标，也没有笔记分享。但我认为此类图标对彩色图形的要求应该是主要部分！
以上观点纯属个人经验，欢迎朋友与我交流，我是一个还没有真正踏入这个行业的新手：
我最新的投资组合地址：永电
最后，我推荐几个必看的网站。观看这些网站的主要目的是提高个人审美情趣。审美情趣只能多年积累。没有捷径可走。
1、运球
2、行为
3、ArtStation主要是CG，但既然我们是做设计的，我们应该覆盖更广的领域。
4、Awwwards，网页设计
5、UI 中国，UI 设计
6、网站酷，全面
7、各大知名公司的设计博客~比如腾讯的设计导航~阿里巴巴的UED等，还有一些前辈的设计博客，比如Yoyo的笔记，JJ Ying的兔月之。
