Photoshop制作立体效果的UI开关按钮

扛着MM逛超市

扛着MM逛超市

2016-04-05 14:13

每个人都希望每天都是开心的,不要因为一些琐事扰乱了心情,闲暇的时间怎么打发,关注图老师可以让你学习更多的好东西,下面为大家推荐Photoshop制作立体效果的UI开关按钮,赶紧看过来吧!

Photoshop制作立体效果的UI开关按钮

   最终效果

Photoshop制作立体效果的UI开关按钮 图老师

  1、先建立一个1136 * 640的Tulaoshi.Com画布。

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

  2、在这个画布上,用椭圆工具勾绘出一个圆形,作为按钮侧面,命名图层为按钮-下。

  3、建立一个新图层,画一个同样大小的同心圆,再选中底边锚点,向上拖到锚点位置如图,作为按钮正面,命名图层为按钮-上。

  4、编辑按钮-上,绘制开关按钮正面的形状和质感,图层样式如下图。

  5、接着我们编辑按钮-上,绘制开关按钮侧下方的形状和质感,图层样式如下。

  6、接着我们画用来按钮按钮的凹槽位。同样的方法我们画一个稍大一些的同心圆,图层名凹槽,然后添加下图所示的样式。

  7、至此,我们已经完成了70%了,需要再加上阴影。阴影层,我使用了一个稍微瘦一些的椭圆形状,这样形成的阴影看起来更加真实。

  8、最后我们再打上OFF,ON的字样,再增加一点泛红光的效果,完成最终效果。

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com)
展开更多 50%)
分享

猜你喜欢

Photoshop制作立体效果的UI开关按钮

电脑网络
Photoshop制作立体效果的UI开关按钮

Photoshop绘制白色立体效果的开关按钮

电脑网络
Photoshop绘制白色立体效果的开关按钮

s8lol主宰符文怎么配

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

Photoshop设计白色立体效果的开关按钮

PS PS基础
Photoshop设计白色立体效果的开关按钮

Photoshop设计白色立体效果的开关按钮教程

PS PS基础 ps平面设计教程 ps去水印教程
Photoshop设计白色立体效果的开关按钮教程

lol偷钱流符文搭配推荐

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

Photoshop绘制立体质感的网页开关按钮

PS PS基础
Photoshop绘制立体质感的网页开关按钮

Photoshop鼠绘超强立体质感的开关按钮

PS PS基础
Photoshop鼠绘超强立体质感的开关按钮

lolAD刺客新符文搭配推荐

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

photoshop打造火焰字效果教程

photoshop打造火焰字效果教程

PS制作直角描边效果文字

PS制作直角描边效果文字
下拉加载更多内容 ↓