Photoshop设计立体效果的手机图标教程

星爷最低调

星爷最低调

2016-02-16 03:15

在这个颜值当道,屌丝闪边的时代,拼不过颜值拼内涵,只有知识丰富才能提升一个人的内在气质和修养,所谓人丑就要多学习,今天图老师给大家分享Photoshop设计立体效果的手机图标教程,希望可以对大家能有小小的帮助。

效果图:

Photoshop设计立体效果的手机图标教程,PS教程,图老师教程网

第一步:画一个圆角为45px,宽高为256*256的圆角矩形,添加图层样式:斜面浮雕和渐变叠加。

Photoshop设计立体效果的手机图标教程,PS教程,图老师教程网

第二步:复制刚才的圆角矩形,去掉样式,用直接选择工具将高度调整到226px,左右宽度也分别缩小3-4px。

Photoshop设计立体效果的手机图标教程,PS教程,图老师教程网

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/ps/)

第三步:再次复制改圆角矩形,用直接选择工具将左右下高度分别减少2px,添加图层样式:投影和内阴影。效果都不是很明显,可以仔细观察原图。

Photoshop设计立体效果的手机图标教程,PS教程,图老师教程网

第四步:再画一个222*192px的圆角为45px的圆角矩形,我是直接复制再缩小。添加图层样式:投影、内阴影、内发光和渐变叠加。

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/ps/)

第五步:复制刚才的圆角矩形,去掉所有样式,上边往下缩小20px,左右分别缩小5px,添加投影、内阴影和描边图层样式,内阴影比形状颜色稍深一点点,颜色自已把握,差不多就行。

Photoshop设计立体效果的手机图标教程,PS教程,图老师教程网

第六步:用形状工具画出明暗交界线颜色深的地方,做渐变效果,具体如图,用10px的圆角矩形工具画出中间的白条,注意中间部分比较亮,添加渐变。

Photoshop设计立体效果的手机图标教程,PS教程,图老师教程网

第七步:发光部分用椭圆工具画几个同心圆,做发光效果,以最大的那个圆为例,填充为0,不透明度30%,添加内发光和外发光图层样式。

第八步:垂直或水平方向画出笔的形状,并做好效果,如果斜着画的话不好把握,添加内发光、渐变效果和描边样式。

Photoshop设计立体效果的手机图标教程,PS教程,图老师教程网

最后把笔倾斜约35度角,放在上面,之前做好的笔的渐变也需跟着变为-35度角。

最后效果图,跟原图差别还是蛮大的,多花点时间,注意观察,相信你能做出更好的原创作品。

Photoshop设计立体效果的手机图标教程,PS教程,图老师教程网

展开更多 50%)
分享

猜你喜欢

Photoshop设计立体效果的手机图标教程

PS PS基础
Photoshop设计立体效果的手机图标教程

Photoshop设计立体光感效果的手机图标

PS PS基础
Photoshop设计立体光感效果的手机图标

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

Photoshop设计立体效果的开关APP图标教程

PS PS基础 ps平面设计教程 ps去水印教程
Photoshop设计立体效果的开关APP图标教程

Photoshop设计立体效果的网站推荐图标教程

PS PS基础 ps平面设计教程 ps去水印教程
Photoshop设计立体效果的网站推荐图标教程

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

Photoshop设计银色立体效果的APP图标教程

PS PS基础
Photoshop设计银色立体效果的APP图标教程

Photoshop设计木质立体效果的软件图标教程

PS PS基础 ps平面设计教程 ps去水印教程
Photoshop设计木质立体效果的软件图标教程

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

Photoshop制作简单抽象效果的拼色艺术字教程

Photoshop制作简单抽象效果的拼色艺术字教程

Photoshop制作白色纱布缠绕的艺术字教程

Photoshop制作白色纱布缠绕的艺术字教程
下拉加载更多内容 ↓