Photoshop绘制可爱风圆形ICO图标

  • 操作系统:
  • 适用软件:
  • 素材格式:
  • 素材大小:
  • 版权信息:©学习参考,请勿商用! (免责声明)
  • 使用帮助:遇到问题? (查看帮助)

本教程主要使用Photoshop制作可爱卡通风格的联系人图标,作者把之前参加过比赛的几套风格各异的主题图标拿制作过程出来讲解一下,图标的绘制方法有很多种,主要看你适合哪种,用得方便不,注意技巧跟细节,不懂的朋友一起来学习吧。

一、卡通风格,联系人图标

先看看效果图

Photoshop绘制可爱风圆形ICO图标

下面是教程

Photoshop绘制可爱风圆形ICO图标

Step01:点击 &mc u \ t z s 1 b 7dash; 【文件】— 【新建】(快捷键Ctrl+N)新建一个新的图像,命名k C b ? r Y |好并把宽度设置为800px,高4 Q } t j & a I度为600px,分辨率为72dpi,然后点击确定,记得顺手保存(快捷键Ctrl+S),以免做一半PS崩溃或者其他原因被关闭了那就悲催了~

Photoshop绘制可爱风圆形ICO图标

S[ A q ~ |tep02:先填充背景,色值为#282828e I = A , F I 7 |(PS:这步主要是为了方便图标观看,背景色值不定,看着舒服,不影J - L ^ # %响图标外观即可);

然后选择【椭圆工具】(快捷键U,可按] I L = 4 lShift+U切换),在画布点击【创建椭圆】弹出层,设置宽度q m K k + K @ z为172px,高度为170px~ k E ; ~ N Y Y,并勾选【从中心】,然后点击确定;/ \ _ M ]

Photoshop绘制可爱风圆形ICO图标

Step03:选中椭圆图层,命名为yuan,右键选择【混合选项】m Z K G : n J &,选择【渐变叠加】,线性渐变,色值从上到下为 #feb5d0 — #ff7fae,角度为90°;E ) $ $ v

再选择【椭圆工具】创建宽度跟高度都为172px的圆,填充颜色为#c74a. T z U 7 _78;命名为yuan_di,对齐于yuan图层并放在其下面;

Photoshop绘制可爱风圆形ICO图标

Step04:复制yuan图层(快捷键Ctrl+J)命名为yuan_b- i b ?an,选择右键清除v A )图层样式,填充颜色为#FFFFFF;不透明度改为30%;

选择【椭圆选框工具】(快捷键M,可按Shift+M切换),按住Shift键,画一个正圆选区(大小自己把握),可对3 K 8齐图层,然后点击【图Q c N { P层】窗口的【添加图层蒙版】;

再复制yuan图层命名为yuan_bian01,选择右键清除图层样式m J b ?,填充颜色改为# ffadcb;按住Ctrl键点击图层载入选区,按方向键向上和向左移动一像素,再反向选区(快捷键Shift+Ctrl+I),再点击【图层】窗口的【添加图层蒙版】;4 m K f ` a

同理复制yuA h P L z !an图层命名为yuan_bian02,填充颜色为#fff2f7,载入选区向下移动两像素,反向选区后添加图层蒙版;

Photoshop绘制可爱风圆形ICO图标

Step05:复制yuan图层命名为neiA = Y U c | !_yuan,点击【编辑】—【自由变换路径】(快捷键Ctrl+T),缩小80%(记得点击【保持长宽比】),右键清除图层样式,选择【混合选项】设置:

【描边】:大小3px,内部,颜色# d85082,

【内阴影】:颜色# c33c6d,F j p不透明度70%,角度120°,距离5,阻塞2,大小8,

【渐变叠加】:线性渐变,色值从上到下为 # feb8d2 — # ff80af,角度为90&d* { ? [ V ~ w %eg;;

Photoshop绘制可爱风圆形ICO图标

Step06:复9 T j M制nei_yuan图层命名为nei_yuan_bA / 7 ] g l ,an,清除图层样式,自由变换路! [ = d !径缩小94%(记得点击【保持长宽比】),颜色# FFFFFF,不透明度改为10%;再载入yuan_ban的蒙版选区,点击【图层】窗口的【添加图层蒙版】;

再复制nei_yuan图层命名为nei_yuan_bian,清除图层样式,填充颜色改为# ffb9d3;x 0 s ?载入选区向上移动两像素,反向选区,再点击【图层】窗口的【添加图层蒙版】,再把nei_yu^ 9 : J E - 1an_bian图层向下, $ m V 4 6移动一像素;

再复制nei_yuan图层命名为nei_yuan2,清除图层样式,自由变换路径缩小90%(记得点击【R % 9 Z保持长宽比】),颜色# FFFFFF,不透明度改为5%;

Photoshop绘制可爱风圆形ICO图标

Step07:绘= v \ o ; 9制LYNN Rabbit头部部分,用【椭圆工具】创建一个椭圆,设置图层混合选项,再绘制耳朵部分,注意描边细节跟阴影,脸部一一拆分,大多数用是用钢笔工具k B 1、椭圆工具、图层蒙版、设置图层混合选项等完成,在这就不一一详细说明,最后加上耳朵阴影和高光,拉个椭圆白色透明渐变,设置不透明度为50%,完成图标的绘D e 2 c h q 5 ]制。

Photoshop绘制可爱风圆形ICO图标

完成图标后加C A V f个华丽丽的背景,再用同样的方法就绘制出一套主题图标啦。

二、微扁平/ O } D化,短信图标

先看看效果图

Photoshop绘制可爱风圆形ICO图标

下面是教7 ! H

Photoshop绘制可爱风圆形ICO图标

Step01:选择【圆角矩形工具】(快捷键U,可按Shift+? E $ 7 _ . t A XU切换),在画布点击【创建圆角矩形】弹出层,设置宽度为120px,高度为120p) \ Wx,半径20px,并勾选【从中心】,然后点击确定;

Photoshop绘制可爱风圆形ICO图标

Step02:把圆角矩形图层命名为di,然后右键选择【混合选项】,设置:

【描边】:大小1pS F 3 c = Zx,内部,渐变90°,# 1a ~ E s 857acf — #78bbff,

【渐变叠加】:线性渐变,色值从上到下为 # 1479cf — # 3a9bff,角度为90&J W S e B mdeg;;

Photoshop绘制可爱风圆形ICO图标

Step03:选择【椭圆工具】,按住Shift键,画一个正圆,填充颜色为# 9eceff,图层命名为message,再选【钢笔工具】(快捷键P,可按Shv = ! ^iftO * J % ; Z \ n V+P切换),在选项栏里【路径操作】选择【合并形状】,并选中路径,画一个三角形;右键选择【混合选项】,设置:

【投影@ c I l % v】:颜色#789bc0;角度120&dp d o 9 + )eg;,距离1px,扩展0,大小1px;

复制图层message命名为message_ceng,填充颜色为# 4da2f9,载入图层选区向上移动三像素,反向选区,再点击【图层】窗口的【添加图层蒙版】;

再复制图层message命名为w Y D @message_e 1 9 : I F _ d qbian,填充颜色为# c7e3ff,载入图层选区向上移动一像素,反向选区,再点击【图层】窗口的【添加图层蒙版】;

Photoshop绘制可爱风圆形ICO图标

Step04i f h @ G:载入mj $ ^ ; E R + Vessage图层选区,填充颜色#134573,取消选区(快捷键Ctrl+D),点击【滤镜9 J [ u o】 — 【模糊】 — 【动感模糊】和【高斯模糊】,

【动感模糊】:角度90°,距离7;

( ~ Q X q x高斯模糊】:半径3;

把图层不透明度设置为50%,并把图层向下移动五像素;

Photoshop绘制可爱风圆形ICO图标

Step05:绘制短信图标上笑脸部分,选择【椭圆工具】,按住Shift键,画一个正圆,填充颜色为# 0675d59 j & g @ C$ v { q M大小适中即可,并复制图层(快捷键Ctrl+J或者选择【移动工具】CA K Utrl+V,` 3 Z K按住Alt键拖动),再选择【文字工具】(快捷键T,可按Shift+P [ S 2 & ^ t 8 nT切换),输入字符“)”,文字z r U H { $ T颜色为# 0675d5,大小适中,这里的文字b = } y \ Z U大小为30px,组合成为一个笑脸字符:) 完成图标的绘制。

Photoshop绘制可爱风圆形ICO图标

温馨提示:

1.本站大部分内容均收集于网络!若内容若侵犯到您的权益,请联系站长处理!

2.如果您喜欢我们,可开通终身会员,享受全站资源免费下载!

3.本站所有内容只做学习和交流使用。 版权归原作者所有。

0 条回复 A文章作者 M管理员
表情包
  • AC01
  • AC02
  • AC03
    暂无讨论,说说你的看法吧
购物车
优惠劵
搜索