PS绘制按钮为主要元素的APP图标photoshop教程

PS绘制按钮为主要元素的APP图标photoshop教程

PS绘制按钮为主要元素的APP图标-photoshop教程

Photoshop,绘制,按钮APP图标,PS教程,,教程

小豪设计集

先看下最终的效果图:

PS绘制按钮为主要元素的APP图标photoshop教程插图我的爱 · 创-WODEAI.NET|3D打印机创意智造

1、建立画布800x600pi,填充颜色为#a846ff。

PS绘制按钮为主要元素的APP图标photoshop教程插图1我的爱 · 创-WODEAI.NET|3D打印机创意智造

复制一层做一个渐变叠加

PS绘制按钮为主要元素的APP图标photoshop教程插图2我的爱 · 创-WODEAI.NET|3D打印机创意智造

得到画板效果

PS绘制按钮为主要元素的APP图标photoshop教程插图3我的爱 · 创-WODEAI.NET|3D打印机创意智造

2、接下来我们做按钮,建立一个圆角矩形308x308pi,半径为68

PS绘制按钮为主要元素的APP图标photoshop教程插图4我的爱 · 创-WODEAI.NET|3D打印机创意智造

3、给椭圆矩形做效果,混合模式:斜面浮雕——颜色叠加——投影

PS绘制按钮为主要元素的APP图标photoshop教程插图5我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图6我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图7我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图8我的爱 · 创-WODEAI.NET|3D打印机创意智造

看过前面课程的同学应该知道,我们做完底部后,要一步步做投影。复制一层,填充黑色,下移20,高斯模糊15,图层不透明度25%。

PS绘制按钮为主要元素的APP图标photoshop教程插图9我的爱 · 创-WODEAI.NET|3D打印机创意智造

在复制一层,高斯模糊为20,不透明度15建立剪切蒙版,因为图标是一个椭圆矩形,阴影也要擦出来图标轮廓。

PS绘制按钮为主要元素的APP图标photoshop教程插图10我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图11我的爱 · 创-WODEAI.NET|3D打印机创意智造

4、建立一个225×225的圆形,颜色渐变

PS绘制按钮为主要元素的APP图标photoshop教程插图12我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图13我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图14我的爱 · 创-WODEAI.NET|3D打印机创意智造

5、在建立一个226×226的大圆在外面我们只是做外面的轮廓,留下边缘部分

PS绘制按钮为主要元素的APP图标photoshop教程插图15我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图16我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图17我的爱 · 创-WODEAI.NET|3D打印机创意智造

6、建立112×112,的中心按钮

PS绘制按钮为主要元素的APP图标photoshop教程插图18我的爱 · 创-WODEAI.NET|3D打印机创意智造

混合模式做图标效果

PS绘制按钮为主要元素的APP图标photoshop教程插图19我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图20我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图21我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图22我的爱 · 创-WODEAI.NET|3D打印机创意智造

给按钮在做一个阴影,复制一个置于按钮下方。高斯模糊

PS绘制按钮为主要元素的APP图标photoshop教程插图23我的爱 · 创-WODEAI.NET|3D打印机创意智造

大家看到我给这个圆左右压缩一点,光源从上方打过来,为了过渡自然,我们可以根据情况改变做阴影的形状,做完后图层透明度改为75%。

PS绘制按钮为主要元素的APP图标photoshop教程插图24我的爱 · 创-WODEAI.NET|3D打印机创意智造

7、做一个96×96的中心圆

PS绘制按钮为主要元素的APP图标photoshop教程插图25我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图26我的爱 · 创-WODEAI.NET|3D打印机创意智造

颜色填充采用叠加效果

PS绘制按钮为主要元素的APP图标photoshop教程插图27我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS绘制按钮为主要元素的APP图标photoshop教程插图28我的爱 · 创-WODEAI.NET|3D打印机创意智造

做渐变叠加最后就是两个旁边显示状态按钮,大小为15x15pi。右边颜色填充为#6fe2fb,左边为描边

PS绘制按钮为主要元素的APP图标photoshop教程插图29我的爱 · 创-WODEAI.NET|3D打印机创意智造

8、到这里就搞定了以上就是今天分享的教学全部了

PS绘制按钮为主要元素的APP图标photoshop教程插图30我的爱 · 创-WODEAI.NET|3D打印机创意智造

喜欢请给我点点赞,更多案例设计分享敬请关注,第一时间观看学习哦!

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

评论0

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

社交账号快速登录

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