Photoshop 制作icon

开发工具与关键技术：使用Photoshop 制作icon

作者：成东平

撰写时间：2019年3月27日

首先先来说说icon是什么，icon其实就是我们使用的手机及电脑类可点击的表达类的图形，不如WLAN你可以点击它打开点击关闭，下面来看看我设计的以香蕉为主题的icon

Icon使用了香蕉与一些应用结合。首先我们再ps中建立一个A4纸，再将手绘出来的香蕉导入其中将它临摹出来，然后调整大小完成后把它的视图关掉，然后在使用圆角矩形绘制出一个高4.06厘米宽4.06厘米的圆角矩形外描边使用5px颜色值为#d2860c，填充色为#f7d11e然后复制出9个出来再把9个圆角矩形图层锁定，然后在再第一个圆角矩形内的中间绘制一个圆和一个三角形两个图形的最宽距离要一样，完成后将圆移动的三角形的边上慢慢调整直到两个图形像手机上的位置图形位置，调整完后将两个图形的图层合并，然后在再想定位的图标下方绘制一个椭圆颜色值为#8f970d再将香蕉复制两份出来大小调整好放制在位置图标的点上，第一个icon就完成了。

接下来就是第二个icon”信息”，在复制出来的第二个圆角矩形上绘制一个比icon框的圆角矩形的圆角度大15的圆角矩形出来矩形，矩形的高与宽的比例是2：4，然后在自定义工具中找到圆角三角形出来放制在矩形的正下方位置然后在放上三个香蕉图标，三个香蕉图标则是表达信息大小调整好第二个icon也完成了。

接下来第三个icon”邮箱一样在第三个圆角矩形上绘制出一个比背景圆角度大15的圆角矩形出来然后用矩形工具绘制出宽度6像素高度从圆角矩形的最左上角到最右下角对齐然后转化为蚂蚁线就是#8f970d的颜色值之后复制一份出来，选择复制出来的一份ctrl+t点击鼠标左健会有一个功能栏选择倒数第二个功能“平水翻转”完成后就是这样如果不是就说明操作有误需要进行调整。然后在图形的居中部分放制一个香蕉图标。完成。


第四个icon“录影”在图形中绘制一个高1.29厘米宽1.81厘米的圆角矩形，在再自定义工具中找到圆角三角形放制在圆角矩形的右方加上两个椭圆放制好加上香蕉图标第四个icon也就完成了。

第五个icon“回收站”回收站圆角矩形绘制一个矩形然后转化为蚂蚁线添加#FFFFFF颜色值然后ctrl+t然后摁住鼠标左键+ctrl改变它的选择大体为桶的形状,然后再绘制出一个比桶形圆角矩形上面宽15px，高为40px的圆角矩形然后转化为蚂蚁线加上#8f970d颜色第五个icon就完成了。

完成第五个icon后就是第六个了“购物商城“与第五个icon的步骤一样绘制圆角矩形然后ctr+t鼠标左键进行形状修改，修改完成后在形状的下方绘制两个圆放制在形状的下方位置上转化为蚂蚁线加上#8f970d颜色大小调整好后用圆角矩形绘制出把手的形状放制好，然后在放上3根香蕉调整好大小，之后把3根香蕉的图层放在推车图层的下方。

然后在推车图形上放制一个香蕉图标第六个icon也完成了。

第七个icon“电话“根据电话的特征结合香蕉设计出来的，第一步绘制圆角矩形ctrl+t鼠标左键+ctrl更改形状然后转化为蚂蚁线添加#8f970d颜色加上颜色后在该形状上绘制出一个圆出来转化蚂蚁线加上#FFFFFF颜色然后在再圆形状是绘制出高14px宽14px的圆根据钟的时间点来摆放，先摆放在12点的位置上然后复制一份出来放制在1点的位置上然后ctrl+shift+alt+t摁下就会如下图

然后在再中间放制一份香蕉图标之后绘制两个长方形出来如下图位置摆放

完成后放制一个香蕉图标大小位置为现实中座机电话，之后调整好方向完成.，

第八个icon”日历”在图形中绘制圆角矩形,然后用矩形工具在矩形上方的4分之1处描绘出来如图然后转化为蚂蚁线加上#8f970d颜色，

之后在加上颜色图形的图层上鼠标左键点击一下该图层会有一个功能栏，功能栏里有个“创
建剪贴蒙板如上图3。在再白色图形上用字体工具打上日期字体样式需要符合主题颜色使用#8f970d，完成后加上两个香蕉图标放制在现实在日历的挂孔位置再加上一个大的香蕉图标摆放好位置即可。

第九个icon“主题“先在图形中绘制一个涂墙漆的工具的把手下图
之后在再最下边部分绘制一个长方形转化蚂蚁线加上#8f970d颜色, 最后放制一个香蕉图标方向位置摆放好即可。