PS创作立体效果的UI开关按钮photoshop教程

PS创作立体效果的UI开关按钮photoshop教程

PS创作立体效果的UI开关按钮-photoshop教程

UI开关按钮,photoshop,PS教程,,教程

 PS创作立体效果的UI开关按钮photoshop教程插图我的爱 · 创-WODEAI.NET|3D打印机创意智造

处理后效果

PS创作立体效果的UI开关按钮photoshop教程插图1我的爱 · 创-WODEAI.NET|3D打印机创意智造

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

PS创作立体效果的UI开关按钮photoshop教程插图2我的爱 · 创-WODEAI.NET|3D打印机创意智造

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

PS创作立体效果的UI开关按钮photoshop教程插图3我的爱 · 创-WODEAI.NET|3D打印机创意智造

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

PS创作立体效果的UI开关按钮photoshop教程插图4我的爱 · 创-WODEAI.NET|3D打印机创意智造

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

PS创作立体效果的UI开关按钮photoshop教程插图5我的爱 · 创-WODEAI.NET|3D打印机创意智造PS创作立体效果的UI开关按钮photoshop教程插图6我的爱 · 创-WODEAI.NET|3D打印机创意智造PS创作立体效果的UI开关按钮photoshop教程插图7我的爱 · 创-WODEAI.NET|3D打印机创意智造PS创作立体效果的UI开关按钮photoshop教程插图8我的爱 · 创-WODEAI.NET|3D打印机创意智造PS创作立体效果的UI开关按钮photoshop教程插图9我的爱 · 创-WODEAI.NET|3D打印机创意智造

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

PS创作立体效果的UI开关按钮photoshop教程插图10我的爱 · 创-WODEAI.NET|3D打印机创意智造PS创作立体效果的UI开关按钮photoshop教程插图11我的爱 · 创-WODEAI.NET|3D打印机创意智造PS创作立体效果的UI开关按钮photoshop教程插图12我的爱 · 创-WODEAI.NET|3D打印机创意智造PS创作立体效果的UI开关按钮photoshop教程插图13我的爱 · 创-WODEAI.NET|3D打印机创意智造PS创作立体效果的UI开关按钮photoshop教程插图14我的爱 · 创-WODEAI.NET|3D打印机创意智造

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

PS创作立体效果的UI开关按钮photoshop教程插图15我的爱 · 创-WODEAI.NET|3D打印机创意智造PS创作立体效果的UI开关按钮photoshop教程插图16我的爱 · 创-WODEAI.NET|3D打印机创意智造PS创作立体效果的UI开关按钮photoshop教程插图17我的爱 · 创-WODEAI.NET|3D打印机创意智造PS创作立体效果的UI开关按钮photoshop教程插图18我的爱 · 创-WODEAI.NET|3D打印机创意智造PS创作立体效果的UI开关按钮photoshop教程插图19我的爱 · 创-WODEAI.NET|3D打印机创意智造

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

PS创作立体效果的UI开关按钮photoshop教程插图20我的爱 · 创-WODEAI.NET|3D打印机创意智造

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

PS创作立体效果的UI开关按钮photoshop教程插图1我的爱 · 创-WODEAI.NET|3D打印机创意智造

常见问题
疑难问题可以发起提问
通过导航菜单中的,创客问答-问题发布,进行提问,让更多的朋友看到并回答你的问题。
分享模型或FDM用机技术
可以通过,创客问答-技术分享,发布你的模型或技术知识,获得更多朋友的支持和点赞。
造机工坊分享机器图纸与固件
想制作同款FDM打印机的朋友,可以通过这个栏目下载机器设计图纸,BOM表单,源码固件等等,自行安装3D打印机了。
分享知识内容不收费!!!
本站始于爱好,止于收费,本站下载内容都不收费,感谢您的访问!
原文链接:https://www.wodeai.net/608396.html,转载请注明出处。如有侵权请联系邮箱:lianzhi0000#163.com (#=@) 删除,谢谢!
0
分享海报

评论0

请先
没有账号?注册  忘记密码?

社交账号快速登录

微信扫一扫关注
如已关注,请回复“登录”二字获取验证码