当前位置:首页>ps实例教程>ps网页设计>按钮图标>教程内容

描边图标,教你设计奋斗的小鸟图标(4)

来源:站酷 作者:带你离开 学习:7224人次

MBE风格图标有着颜色清爽鲜,高饱和度,外形可爱有趣,线条粗旷等特点,特别深受女孩子欢迎,本篇教程就跟大家讲解一下这种风格图标是如何用CC2015设计出来的,分享一起学习了。

先看看效果:

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

我用的是Mac电脑cc2015版本的ps,这个软件钢笔部分很好用,我会发一份安装包需要安装包可以下载哦!

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com
<点图片看大图>www.16xx8.com

首先用形状绘制一个圆运用直接选择工具进行变形

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

绘制椭圆右键变形调整

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

调整结束同下圆合并形状图层选中所合并图层cmd+e或(ctrl+e)

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

直接选择工具或路径选择工具快捷键A情况下合并形状组件,就会形成一个路径

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com
<点图片看大图>

复制形状图层选择形状工具更改描边填充

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com
<点图片看大图>

直接选择工具选择秒边路径钢笔工具添加锚点(想在哪减在哪家锚点)直接选择工具选中添加的锚点中间线段delete删除

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

减完线段直接自由变换路径cmd+t(ctrl+t)或者直接向右移动留出空隙部分(空隙部分一定要留这样可以给人透气感不呆板更活泼)

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

接下来绘制脸部内容,嘴部绘制个三角形

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

同身体圆形变形同理,利用钢笔和直接选择工具调整圆滑度

钢笔工具情况下按住alt调整上边圆滑度

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

复制一个图层右键垂直翻转放置下层调整大小嘴部就ok了!

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

眼睛部分直接绘制椭圆更改填充和描边大小

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

眉毛部分绘制矩形右键变形

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

调整眉毛样式

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

复制图层右键水平翻转

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

移动图层合并进行合并图层组件

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com
<点图片看大图>

接下来作鸟内部装饰部分就是绘制圆(颜色重些)进行图层剪切蒙板,有多种方法

下部加重地方必须作,这样会使整个物体有重量感,不漂浮,下面图片有个不加的,可以对比下,个明显有飘感给人不稳重多感觉,就像画画一样必须家重部!

鼠标放置两个图层中间按住alt出现向下箭头点击鼠标左键完成

选择图层alt+cmd+g(alt+ctrl+g)

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com
<点图片看大图>
描边图标,教你设计奋斗的小鸟图标_www.16xx8.com
<点图片看大图>

接下来基本就没有什么难的了加上尾巴,绘制点缀

尾巴形状调整做法与眉毛一样

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com
<点图片看大图>

点缀亮点可以自己做也可以下载素材添加上

点缀物就是直接形状工具绘制

点缀物的位置摆放要有紧有松,大小不一,才有层次感,选择颜色要鲜亮,不要添加黑色,会显脏!

描边图标,教你设计奋斗的小鸟图标_www.16xx8.com

学习 · 提示

  • 一定要打开PS,跟着教程做一遍,做完的图到这交作业:提交作业
  • 建议练习时,大家自己找素材,尽量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到论坛发帖提问:新手求助
  • 加官方微信,随时随地,想学就能学:ps_bbs,或扫右侧二维码!
  • 关注我们学更多,每天都有新教程:新浪微博 抖音视频 微信小程序
- 发评论 | 交作业 -
最新评论
User_9pzOKZdCTI2018-09-03 03:27
好好看啊
板砖少爷2017-05-28 01:04
支持,支持
魔之泪复活2017-05-27 09:14
学习学习!!!
可靠的阿飞1232017-05-27 02:21
想仔细了解一下
俄素桑桑2017-05-27 10:30
谢谢老师 多多学习
咻冬咚2017-05-27 03:22
大神
2016-10-28 05:04
用钢笔工具添加锚点,然后在用选择工具,选中刚添加的锚点,一删除,就有了缺口
2016-10-28 05:10
同求,缺口部分不会Hakuna 的原帖:用钢笔工具添加锚点,然后在用选择工具,选中刚添加的锚点,一删除,就有了缺口
Hakuna2016-10-25 05:21
同求,缺口部分不会
Hakuna2016-10-25 05:10
同求,缺口部分不会
mk2016-09-29 10:24
教程一点都不详细
mk2016-09-29 10:09
教程一点都不详细
咏╰☆╮颂2016-08-31 02:31
那个描边缺口能再说说吗。。
咏╰☆╮颂2016-08-31 02:08
那个描边缺口能再说说吗。。
橙子2016-08-27 02:36
好萌,会不会难啊。看着

关注大神微博加入>>

网友求助,请回答!