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

反诈示警:如遇到文章内跳转至别的网站或产生需要交钱,交易等行为,均为诈骗行为,请谨慎对待。对于网上兼职、刷单、刷信誉的就是诈骗,请勿相信!需要提供身份证明、短信验证和短信链接点击都是诈骗, 请不要提供!同时请下载“国家反诈中心”App能自查自检,规避诈骗电话,免遭损失。

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

修改前后对比

用PS制作奶油质感手机主题图标的图标设计教程,插图,来源:资源仓库www.zycang.com

制作步骤

电话

步骤 01 建立文档并制作背景

1.1 新建文档,大小为3600*2800px,分辨率为72。前景色填充为383e4b。

用PS制作奶油质感手机主题图标的图标设计教程,插图1,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图2,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图3,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图4,来源:资源仓库www.zycang.com

步骤 02 制作底座

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

用PS制作奶油质感手机主题图标的图标设计教程,插图5,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图6,来源:资源仓库www.zycang.com

步骤 03 制作电话的基本形状

3.1 用钢笔勾出圆润的电话形状,如图。接着给电话添加图层样式,参数如图。

用PS制作奶油质感手机主题图标的图标设计教程,插图7,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图8,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图9,来源:资源仓库www.zycang.com

信息

步骤01 制作底座

1.1 新建490*490的圆角矩形,圆角半径为220,填充颜色为f6dea5, 并添加图层样式来制造体积感。

用PS制作奶油质感手机主题图标的图标设计教程,插图10,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图11,来源:资源仓库www.zycang.com

步骤 02 制作信息的基本形状

2.1 新建一个椭圆再用钢笔工具勾出一个圆角三角形,为他们做布尔运算合并形状组件。

用PS制作奶油质感手机主题图标的图标设计教程,插图12,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图13,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图14,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图15,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图16,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图17,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图18,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图19,来源:资源仓库www.zycang.com

浏览器

步骤01 制作底座

1.1 新建490*490的圆角矩形,圆角半径为220,填充颜色为d2f5a6。

用PS制作奶油质感手机主题图标的图标设计教程,插图20,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图21,来源:资源仓库www.zycang.com

步骤 02 制作浏览器的基本形状

2.1 新建300*300的椭圆,选中椭圆,运用布尔运算减去顶层,在中心剪掉一个150*150的椭圆。

2.2 颜色填充为ffffff。效果如图所示。

用PS制作奶油质感手机主题图标的图标设计教程,插图22,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图23,来源:资源仓库www.zycang.com

步骤 03 制作浏览器的云朵

3.1 新建113*45的矩形,再按住shift新建三个椭圆形状,大小分别为97*97,87*87,125*125。

3.2 按住shift,用路径选择工具同时选中矩形和两个较小的圆形,在属性栏的对齐中选择底对齐。

3.3 调整矩形和圆形的位置,并注意矩形的两条较短边,要正好通过两个较小圆形的圆心,使形状平滑。

用PS制作奶油质感手机主题图标的图标设计教程,插图24,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图25,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图26,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图27,来源:资源仓库www.zycang.com

联系人

步骤01 制作底座

1.1 新建490*490的圆角矩形,圆角半径为220,填充颜色为f3dfa9, 并添加图层样式来制造体积。

用PS制作奶油质感手机主题图标的图标设计教程,插图28,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图29,来源:资源仓库www.zycang.com

步骤 02 制作联系人的基本形状

1.1 新建椭圆161*158,填充色为ffffff。

用PS制作奶油质感手机主题图标的图标设计教程,插图30,来源:资源仓库www.zycang.com

1.2 为其添加明暗光影。

用PS制作奶油质感手机主题图标的图标设计教程,插图31,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图32,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图33,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图34,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图35,来源:资源仓库www.zycang.com

天气

步骤 01 制作底座

1.1 新建490*490的圆角矩形,圆角半径为220,填充颜色为9ae7eb, 并添加图层样式来制造体积。

用PS制作奶油质感手机主题图标的图标设计教程,插图36,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图37,来源:资源仓库www.zycang.com

步骤 02 制作天气的基本形状

2.1 新建174*83的矩形,再按住shift新建三个椭圆形状,大小分别为177*177,136*136,166*166。

2.2 按住shift,用路径选择工具同时选中矩形和两个较小的圆形形,在属性栏的对齐中选择底对齐。

2.3 调整矩形和圆形的位置,并注意矩形的两条较短边,要正好通过两个较小圆形的圆心,使形状平滑。

用PS制作奶油质感手机主题图标的图标设计教程,插图38,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图39,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图40,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图41,来源:资源仓库www.zycang.com

播放器

步骤 01 制作底座

1.1 新建490*490的圆角矩形,圆角半径为220,填充颜色为fec8b1, 并添加图层样式来制造体积。

用PS制作奶油质感手机主题图标的图标设计教程,插图42,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图43,来源:资源仓库www.zycang.com

步骤 02 制作播放器的基本形状

2.1 用钢笔勾出圆润的三角形状,注意圆角弧度拉大一点。

用PS制作奶油质感手机主题图标的图标设计教程,插图44,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图45,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图46,来源:资源仓库www.zycang.com

音乐

步骤 01 制作底座

1.1 新建490*490的圆角矩形,圆角半径为220,填充颜色为91b1e4, 并添加图层样式来制造体积。

用PS制作奶油质感手机主题图标的图标设计教程,插图47,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图48,来源:资源仓库www.zycang.com

步骤 02:制作计算机的基本形状

2.1 钢笔勾出乐府形状。填充颜色为ffffff。

用PS制作奶油质感手机主题图标的图标设计教程,插图49,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图50,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图51,来源:资源仓库www.zycang.com

最终效果

用PS制作奶油质感手机主题图标的图标设计教程,插图52,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图53,来源:资源仓库www.zycang.com

播放器

步骤 01 制作底座

1.1 新建490*490的圆角矩形,圆角半径为220,填充颜色为b3e4be, 并添加图层样式来制造体积。

用PS制作奶油质感手机主题图标的图标设计教程,插图54,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图55,来源:资源仓库www.zycang.com

步骤 02 制作计算机的基本形状

2.1 选取圆润的字体输入“+ – × =”,或者使用钢笔和形状工具相结合调节出圆润的字体。

用PS制作奶油质感手机主题图标的图标设计教程,插图56,来源:资源仓库www.zycang.com

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

用PS制作奶油质感手机主题图标的图标设计教程,插图57,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图58,来源:资源仓库www.zycang.com

用PS制作奶油质感手机主题图标的图标设计教程,插图59,来源:资源仓库www.zycang.com

如需 WordPress 优化加速、二次开发、网站维护、企业网站建设托管等服务,点此联系我 | 近期站内热门福利推荐:
文章版权及转载声明

本文地址:https://www.zycang.com/13775.html
文章转载或复制请以超链接形式并注明来源出处。 本文最后更新于:2022-07-20 07:01:05
声明:某些文章或资源具有时效性,若有 错误 或 所需下载资源 已失效,请联系客服QQ:11210980

喜欢就支持一下吧
点赞219赞赏 分享
评论 抢沙发

请登录后发表评论