&&从2月26日开始的两周时间内，为了赶上iconfans作品征集的投稿，最终完成了两个icon，算是得到了一些成果。以下是过程中收获的经验体会，分享出来和大家一起交流。&
作为一个初学者，在被要求或者想要做一个icon之前，看到那些大牛们的icon总是惊讶不已，热血沸腾地要立即开始。但是&不已&过后确不知道如何下手，导致时间在各种无意义的杂乱思考和&寻找素材&中被消耗掉。结合大牛指导和自己的经历，总结一套流程和大家讨论分享：初学者怎么完成一个icon设计。
设计一个icon的过程大致区分需要三个阶段：
1.确定icon的题材，就是表现内容。
2.确定表现风格，写实？单一物体？还是小场景？&
3.再构思具体怎么实现，突出亮点。
这时要从大的方面来考虑icon的制作，可以先想想一些必要问题的答案：为什么要设计这个icon？这个设计的需求是什么？什么题材可以满足这些需求？这个题材能做到很好的表达么？...... 问题可能一时半会儿没有答案，没关系，带着问题去看作品，看最好的作品，就会在别人的成果中得到启示，随手画草图也是激发灵感的好方法。
想过之后在脑海中确定要画什么，最后限定一些客观条件（比如做一套图标时间是不是允许，某个题材细节是不是太复杂导致无法完成...），选择几个题材作为备选方案。如果并不是商业需求，那么可以从感兴趣的题材入手，这更能激发自己的创作欲望。
确定表现风格
用一些主观客观的条件来挑选表现风格，比如根据现在icon设计的流行趋势来选择写实风格；根据所要表达的主题选择材质等等。物体的展现形式是什么？单个物体还是物体组合？色彩搭配怎么用才能突出主题？趣味性怎么样展现？......
以上确定题材和确定风格的过程绝对不是独立存在的，他们会互相影响，交织着进行。伴随这个两个过程的是大量地看好的icon设计作品和打草稿，从他人的设计中吸收什么是好的作品，了解好的作品是怎么组成的。
可能在某些情况下根本不需要问问题，直接上手开始做icon就可以。但是我相信前期的思考和权衡是完成一个优质icon设计必经的过程。
插播推荐的icon设计网站：
当然要善用google，他可以帮助你找到最广泛素材。
之后就进入了实战操作部分了，具体怎么实现题材和风格是现在所要思考的问题，要去选择技巧工具和方法。再具体一点说，像我一样的初学者也许并不知道怎么实现某种材质，怎么制作某种高光，但是有几
个快速上手方案供大家尝试：
1.临摹&这是性价比很高的的一条路，但是要记住要选择最好作品之一来临摹，虽然开始可能有些难度，但是坚持临摹好作品出来的效果要比临摹水平一般的作品好很多。临摹之前要仔细观察分析，观察光源的位置，观察颜色分布，观察icon的层次。想好了再动手要比直接上手效率高得多。
2.找到PSD学习&分析大牛的PSD文件，看他们怎么用图层样式来实现金属质感或者制作高光
3.优秀教程
矢量图制作教程
4.耐心的堆叠细节
补充制作icon过程中需要注意的细节
1.越是精细的图标就越是要注意路径对像素的影响
2.icon因为相对来说尺寸较小，就要求色彩饱满，突出对比度，有丰富的色阶层次。
3.注意缩放图标时的相应调整
PS2：最后提交到iconfans的icon成品
提示本站所有资源仅供学习与参考，请勿用于商业用途。转载请注明来自：
您可能也喜欢
请自觉遵守互联网相关的政策法规，严禁发布色情、暴力、反动的言论。手机号/邮箱:?
使用第三方登录：?
还可以输入 300 字符
请输入举报理由
选择收藏分类：
默认收藏夹
添加收藏分类：
原创作品：【UIZOO】一个游戏图标竟然会有这么多的讲究
系统分类：
个人归类：
作品版权由
解释，禁止匿名转载；禁止商业使用；禁止个人使用。 临摹作品，同人作品原型版权归原作者所有。
福州 / GUI设计师1年前发布
图片也需要穿衣服，因此外框的大小一般都是正方形的变形，端游在32-64像素之间，手游在90-200像素之间，尺寸决定了细节的呈现。图标最终呈现都是在这里面，因此不能画的太大也不能太小。
2构图既然知道了大小，那我们现在来研究构图，因为最近正好看了琅琊榜，那为什么他能那么的火爆，很多人对这部剧评价太高，因为他真的很美，很讲究，小金狮来和大家一起分享下影视美学上的构图，1：对称法则
对角线构图
黄金分割线三分法则
下面这个类似三分法则的网格线，又不是很准确的三分线，交点位置不是1:1:1，而是1：0.618：1.并且采用了多种三角视觉构图，让茫茫人海中依旧能找到景睿，和他的妹妹。
下面是黄金三角形切割
黄金螺旋线，也称斐波那契螺旋线，根据斐波那契数列画出来的螺旋曲线，自然界中存在许多斐波那契螺旋线的图案。
福州 / GUI设计师1年前发布
同时推荐此作品
还可以输入2000 个字符
所有，禁止匿名转载；禁止商业使用；禁止个人使用。图片来自国际知名设计师平台
很多同学不知道UI是什么，以为画个ICON图标就是做UI了，导致很多人都忙着画各种各样的图标。这样很容易让那些新人们走错路，最后我想说的是icon不是全部，不要沉迷其中，要学的还有很多。
下边我们先说说UI到底是什么？
User Interface（用户界面)，简称UI，是指对软件的人机交互、操作逻辑、界面美观的整体设计。
UI设计分三个分支：
1、研究界面—-图形设计师Graphic UI designer，简称GUI,国内目前大部分UI工作者都是从事这个行业。包括（网页设计，软件界面，移动端界面设计），每天工作做着各种界面设计。
2、交互设计师，做整个项目的交互流程。
3、用户体验研究师，主要是通过各种方法去了解用户现在需要什么样的体验什么样的界面，从而对这个项目的总体性体验做决策的。
用户界面设计是屏幕产品的重要组成部分。界面设计是一个复杂的有不同学科参与的工程，认知心理学、设计学、语言学等在此都扮演着重要的角色。用户界面设计的三大原则是：置界面于用户的控制之下；减少用户的记忆负担；保持界面的一致性；即要符合用户的心智模型。
所以一个优秀的UI设计师，从技能上讲，不仅能画图标，还能做好界面，会很多交互知识。
好的UI设计不仅是让软件变得有个性有品味，还要让软件的操作变得舒适、简单、自由、充分体现软件的定位和特点。
图标，界面，交互知识都是需要长期的经验积累，所以UI这条路很长，要学的技能很多，大家加油吧！！
UI设计师工作中都做些什么事？
在日常工作中，UI设计师一般要做的事情还挺多的（手机端UI和网页UI大多数情况由同一人完成，大公司分工比较细，会分开）
界面设计并标注尺寸（手机端或是网页平台或软件）
图片导出给程序员（手机端）
启动图标设计
提交到各大平台的推广图（活很多，各种尺寸，横竖屏）
产品的网页设计
展会海报，易拉宝，等平面
UI设计师要学很多，才能独当一面。一般的公司都只会招一个又做网页又做手机端的UI设计师，未来也手机端和网页UI
合二为一，必然！！
下面是一些优秀的UI设计新人的作品（），大家可以欣赏下。
也祝愿看到这里的小伙伴(基本上都是小白），在接下来漫长的学习过程中，也能做出这样的作品。面试带着这种作品就可以很容易转行UI设计师啦!
转载请注明： &
学UI就上学UI网！越努力，越幸运！
“学UI网 ”最值得关注的UI学习平台！ 每天发布高质量的设计教程和分享设计经验，服务于20万UI设计师,帮助初学者快速转型。每周六晚上免费YY公开课（），给大家提供更多免费学习的机会。想成为设计师的你快来关注吧！
【特色推荐】
海量APP截图，让你灵感爆发！国内最好的APP截图站。
“” 专为UI设计学习者打造的资源＋学习，双用途的网址导航站。亲爱的，你收藏了吗？
【学UI网 原创文章 投稿邮箱：，也可以找各个群的管理】
你可能喜欢的：UI知识，制作icon到底是用AI还是用PS？
来源：站酷
作者：HHTHH
所有设计师在接触到设计师遇到最基本的问题就是icon的制作，icon也是UI设计师遇到是最基础的训练。
网上的各种icon设计都制作的相当精美，把控好风格和样式我相信每一个有点PS或者AI基础的人都能临摹出一模一样的作品。
但是，现在问题来了...
这些东西大小如何界定?各自如何切图？各自保存成什么格式？这些图标用PS制作好还是用AI制作更好?
大小的界定、软件的选用对实际工作有什么样的影响？（懂的人都知道这是需要切图的）
结合实际工作我们需要最高效率的输出应该选用哪一种？（在AI里做，回头还要输入到PS里面做效果，源文件稍微一调整怎么办，想想都觉得麻烦，真是想想都麻烦）
这是入门级别的icon设计就需要考虑的问题。当然目前大部分入门的人都会忽略的，因为这些疑惑只有在实践一段时间以后才会出现的。
有这些疑惑的设计师，祝贺你，你是一个喜欢思考的的UI设计师，因为很多设计师一般会简单粗暴的回答:当然是PS简单直接也可以切图，一键走天涯。
我个人工作过一个公司，期间一直用PS制作图标，切图，主管也一直这么做的，确实没有什么问题。在PS里面直接制作出效果图，然后切图出来，马克鳗软件标注尺寸，有些小的项目甚至都没有输出过@2X@3X。所以入门的设计师不用怕不懂这些就做不了UI。依然可以做好工作，但是不能不懂这些东西，经过我一天时间跟不同公司的人沟通交流我梳理了一下，让大家理解更清晰，虽然用不到，但是还是可以提升理解的。
第一种：直接用PS因为PS里面有形状工具还可以描边，再加上强大的结合PSCC最新的版本，完全可以胜任所有icon的制作，效果一点也不比AI制作差，尤其是转换为智能对象直接解决了圆角弧度的等比变化问题。关键它也是矢量形状，不惧放大缩小，确实是UI设计师的福音。
第二种：用AI还有CRD他们才是真正的矢量图形，圆角弧形的表现无它能敌（PA里面再强也是有锯齿的（无限放大放大看））矢量就是任性。
其实大家最关心的还是工作效率的问题，能用一个搞定我们就少操作一个软件，我也是这么想的，以前在公司，我也不愿意打开AI，能用PS就用PS，但是经过我一天的咨询，我发现虽然我的公司是这样，但不代表UI设计行业都这样，我不能坐井观天。我相信大家纠结的关键因素是因为切图，切图的@2X@3x，会不会受到影响。
如果公司要求不严格，或者公司自己开发一款用户范围很小的APP一般不会要求那么细致，在PS里面随便做一套icon然后切出来适配某几个分辨率就行了。这样的公司设计师比较舒服，不用过多考虑切图问题。
第二种公司就是类似于QQ百度微信这种级别的应用或者要求更高的专业公司，他们的APP绝不可能只切几个分辨率进行适配，因为受众群体太多，考虑的手机平台更多。举个栗子：在PS中我们做出icon切图后输出不同尺寸的切图，PS是不能保证每一个尺寸的切图都是没有变形或者虚边的。（仔细想想是有道理的）
但是AI等矢量软件输出什么样的尺寸都无所谓，所以我肯定类似BAT这样的公司是绝不可能用PS制作或者直接切图重要位置图标的。基本要保证重要图标的矢量效果适应各种尺寸规范。
这时候大家觉得看来专业的还是得用AI啊，但是AI和PS交换使用做设计时候会不会麻烦啊。
通过跟这位设计师对话我明白了一个道理：我们在PS里面只是演示一个界面设计，如果很完美那么就直接保存PNG然后用马克鳗标注，但是前端那边最好是接到AI矢量图标再按照我们效果图标注的大小进行切图（这公司UI设计师都不切图的，太闲了吧）结合大众那就是我们设计师效果图标注，用AI切图。因此省去了我们一个非常重要的步骤：AI里面的图标不必每次调整都要放到PS效果图里面展示，只需要用PS里面的形状工具画出一个效果即可。（因为AI没有像素概念AI里面的图标拖到PS里面有可能会出现很多半像素，所以拖过来制作效果没有必要）。
综上所诉：我个人理解就是PS做效果，AI绘图标。涉及到切图在PS里面制作大小效果，在AI里面大小自定义（因为矢量）也就是说对切图要求严格的公司里面的UI设计师是肯定用AI制作icon的并进行切图，但是PS里面的icon效果就不一定是从AI那边拖过来的了毕竟来回拖拽太麻烦。
以上只是我一个初级设计师的浅显理解，不作为任何设计的的参考建议，本文最终目的也只是想抛砖引玉，希望有人能指点错误，我会及时改正，并标注出来，感谢大家。如果有大神指导AI切图方法，也请不吝赐教。
&全教程完,学完记得交作业。如果本教程对您有所帮助，请推荐给你的朋友。
打开ps，跟着教程做一遍，做完的图要到这里交作业：
教程有看不懂的地方，可以到论坛发帖提问：
加官方微信，随时随地，想学就能学：ps_bbs，或扫右侧二维码！
关注我们微博：
想学更多的同学，可以订阅我们邮件，每天都有新教程发给你：
看完教程希望大家来这
欢迎投稿原创或转载教程：
旧一篇： 新一篇：
免责声明：本站文章均由网友原创投稿或由网友转载自第三方，其版权归原作者所有，如出现资料错误或侵权，请通过邮箱联系修正或删除：}