社区首页 › 教程资源 › 用PS制作奶油质感手机主题图标的图标设计教程

psschool 发表于 2019-11-13 00:00:00

用PS制作奶油质感手机主题图标的图标设计教程

想要制作一组手机主题图标，首先呢要去寻找相应的参考作品，然后按照自己的想法和思路把草稿画出来，把自己确定好的想要做的图标草图画出来，接着用软件进行相应的制作。前期在肥子老师的指导下进行了很多次修改，对于图标的光影配色体积，最终完成一组奶油状图标。
修改前后对比

http://www.06ps.com/d/file/2019/1113/1573635937231.jpg

制作步骤
电话
步骤 01 建立文档并制作背景
1.1 新建文档，大小为3600*2800px]分辨率为72。前景色填充为383e4b。

http://www.06ps.com/d/file/2019/1113/1573635939182.jpg

1.2 为背景添加斜面浮雕和纹理效果，参数如图。

http://www.06ps.com/d/file/2019/1113/1573635941551.jpg

http://www.06ps.com/d/file/2019/1113/1573635942330.jpg

1.3 用形状工具画出四个圆形，与背景图层建立剪贴蒙版，如图。

http://www.06ps.com/d/file/2019/1113/1573635943845.jpg

步骤 02 制作底座
2.1 新建490*490的圆角矩形，圆角半径为220，填充颜色为faaf98，并添加图层样式来制造体积感。

http://www.06ps.com/d/file/2019/1113/1573635945100.jpg

http://www.06ps.com/d/file/2019/1113/1573635946824.jpg

步骤 03 制作电话的基本形状
3.1 用钢笔勾出圆润的电话形状，如图。接着给电话添加图层样式，参数如图。

http://www.06ps.com/d/file/2019/1113/1573635947790.jpg

http://www.06ps.com/d/file/2019/1113/1573635949533.jpg

http://www.06ps.com/d/file/2019/1113/1573635950485.jpg


               
               
信息
步骤01 制作底座
1.1 新建490*490的圆角矩形，圆角半径为220，填充颜色为f6dea5, 并添加图层样式来制造体积感。

http://www.06ps.com/d/file/2019/1113/1573635951262.jpg

http://www.06ps.com/d/file/2019/1113/1573635953201.jpg

步骤 02 制作信息的基本形状
2.1 新建一个椭圆再用钢笔工具勾出一个圆角三角形，为他们做布尔运算合并形状组件。

http://www.06ps.com/d/file/2019/1113/1573635954295.jpg

http://www.06ps.com/d/file/2019/1113/1573635956821.jpg

2.2 接着为信息内底添加图层效果，参数如图所示。

http://www.06ps.com/d/file/2019/1113/1573635958108.jpg

http://www.06ps.com/d/file/2019/1113/1573635959254.jpg

2.3 新建50*50椭圆，填充色为ffeec6，接着复制两个椭圆出来。

http://www.06ps.com/d/file/2019/1113/1573635960887.jpg

2.4 为椭圆添加图层效果，参数如图。

http://www.06ps.com/d/file/2019/1113/1573635962769.jpg

http://www.06ps.com/d/file/2019/1113/1573635963321.jpg

http://www.06ps.com/d/file/2019/1113/1573635964916.jpg


               
               
浏览器
步骤01 制作底座
1.1 新建490*490的圆角矩形，圆角半径为220，填充颜色为d2f5a6。

http://www.06ps.com/d/file/2019/1113/1573635966970.jpg

http://www.06ps.com/d/file/2019/1113/1573635968158.jpg

步骤 02 制作浏览器的基本形状
2.1 新建300*300的椭圆，选中椭圆，运用布尔运算减去顶层，在中心剪掉一个150*150的椭圆。
2.2 颜色填充为ffffff。效果如图所示。

http://www.06ps.com/d/file/2019/1113/1573635969647.jpg

2.3 为其添加图层效果，参数如图。

http://www.06ps.com/d/file/2019/1113/1573635971332.jpg

步骤 03 制作浏览器的云朵
3.1 新建113*45的矩形，再按住shift新建三个椭圆形状，大小分别为97*97，87*87，125*125。
3.2 按住shift，用路径选择工具同时选中矩形和两个较小的圆形，在属性栏的对齐中选择底对齐。
3.3 调整矩形和圆形的位置，并注意矩形的两条较短边，要正好通过两个较小圆形的圆心，使形状平滑。

http://www.06ps.com/d/file/2019/1113/1573635972643.jpg

3.4 制作云上的明暗光影。参数如图。

http://www.06ps.com/d/file/2019/1113/1573635974807.jpg

http://www.06ps.com/d/file/2019/1113/1573635975174.jpg

http://www.06ps.com/d/file/2019/1113/1573635977505.jpg


               
               
联系人
步骤01 制作底座
1.1 新建490*490的圆角矩形，圆角半径为220，填充颜色为f3dfa9， 并添加图层样式来制造体积。

http://www.06ps.com/d/file/2019/1113/1573635978351.jpg

http://www.06ps.com/d/file/2019/1113/1573635979925.jpg

步骤 02 制作联系人的基本形状
1.1 新建椭圆161*158，填充色为ffffff。

http://www.06ps.com/d/file/2019/1113/1573635981726.jpg

1.2 为其添加明暗光影。

http://www.06ps.com/d/file/2019/1113/1573635985482.jpg

http://www.06ps.com/d/file/2019/1113/1573635986108.jpg

1.3 新建形状，用钢笔勾出联系人的身子。

http://www.06ps.com/d/file/2019/1113/1573635987277.jpg

1.4 为其添加光影效果，参数如图。

http://www.06ps.com/d/file/2019/1113/1573635988713.jpg

http://www.06ps.com/d/file/2019/1113/1573635989853.jpg


               
               
天气
步骤 01 制作底座
1.1 新建490*490的圆角矩形，圆角半径为220，填充颜色为9ae7eb， 并添加图层样式来制造体积。

http://www.06ps.com/d/file/2019/1113/1573635992278.jpg

http://www.06ps.com/d/file/2019/1113/1573635993538.jpg

步骤 02 制作天气的基本形状
2.1 新建174*83的矩形，再按住shift新建三个椭圆形状，大小分别为177*177，136*136，166*166。
2.2 按住shift，用路径选择工具同时选中矩形和两个较小的圆形形，在属性栏的对齐中选择底对齐。
2.3 调整矩形和圆形的位置，并注意矩形的两条较短边，要正好通过两个较小圆形的圆心，使形状平滑。

http://www.06ps.com/d/file/2019/1113/1573635995643.jpg

2.4 为其添加明暗光影，参数如图。

http://www.06ps.com/d/file/2019/1113/1573635996711.jpg

http://www.06ps.com/d/file/2019/1113/1573635997924.jpg

http://www.06ps.com/d/file/2019/1113/1573635999805.jpg


               
               
播放器
步骤 01 制作底座
1.1 新建490*490的圆角矩形，圆角半径为220，填充颜色为fec8b1， 并添加图层样式来制造体积。

http://www.06ps.com/d/file/2019/1113/1573636000813.jpg

http://www.06ps.com/d/file/2019/1113/1573636002219.jpg

步骤 02 制作播放器的基本形状
2.1 用钢笔勾出圆润的三角形状，注意圆角弧度拉大一点。

http://www.06ps.com/d/file/2019/1113/1573636003627.jpg

2.2 为其添加光影明暗效果。

http://www.06ps.com/d/file/2019/1113/1573636004821.jpg

http://www.06ps.com/d/file/2019/1113/1573636005374.jpg


               
               
音乐
步骤 01 制作底座
1.1 新建490*490的圆角矩形，圆角半径为220，填充颜色为91b1e4， 并添加图层样式来制造体积。

http://www.06ps.com/d/file/2019/1113/1573636016979.jpg

http://www.06ps.com/d/file/2019/1113/1573636017793.jpg

步骤 02：制作计算机的基本形状
2.1 钢笔勾出乐府形状。填充颜色为ffffff。

http://www.06ps.com/d/file/2019/1113/1573636018297.jpg

2.2 为其添加明暗光影效果。

http://www.06ps.com/d/file/2019/1113/1573636020787.jpg

http://www.06ps.com/d/file/2019/1113/1573636021867.jpg

最终效果

http://www.06ps.com/d/file/2019/1113/1573636023702.jpg

http://www.06ps.com/d/file/2019/1113/1573636025138.jpg

               
               
播放器
步骤 01 制作底座
1.1 新建490*490的圆角矩形，圆角半径为220，填充颜色为b3e4be， 并添加图层样式来制造体积。

http://www.06ps.com/d/file/2019/1113/1573636007514.jpg

http://www.06ps.com/d/file/2019/1113/1573636009590.jpg

步骤 02 制作计算机的基本形状
2.1 选取圆润的字体输入“+ – × =”，或者使用钢笔和形状工具相结合调节出圆润的字体。

http://www.06ps.com/d/file/2019/1113/1573636011595.jpg

2.2 为其添加光影明暗效果。四个符号效果一样，依次复制粘贴。

http://www.06ps.com/d/file/2019/1113/1573636012431.jpg

http://www.06ps.com/d/file/2019/1113/1573636013561.jpg

http://www.06ps.com/d/file/2019/1113/1573636014653.jpg

查看完整版本: 用PS制作奶油质感手机主题图标的图标设计教程