Photoshop制作UI小图标绿色箭头教程

2016-02-16 07:49 52 1 收藏

关注图老师电脑网络栏目可以让大家能更好的了解电脑,知道有关于电脑的更多有趣教程,今天给大家分享Photoshop制作UI小图标绿色箭头教程教程,希望对大家能有一点小小的帮助。

【 tulaoshi.com - PS 】

最终效果

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

1、先用钢笔勾出一个箭头的路径。

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

2、按Ctrl + Enter把路径转为选区,切换到通道面板,新建一个通道,然后填充白色,按Ctrl + D取消选区,执行:滤镜  模糊  高斯模糊,数值为4.3左右,按Ctrl + L调色阶把左右两个黑色三角形箭头想中间靠拢,使得轮廓变清晰,圆角完成。

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

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

3、按Ctrl点击通道载入选区,回到图层面板,新建一个图层,填充颜色:#02A600。

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

4、复制该层,并锁定复制层,然后选择渐变工具颜色设置为从:#CCFF2F到#25CA00的渐变,然后拉出径向渐变,并把图层向上移动4个像素。

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

5、用钢笔工具勾出高光路径。

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

6、新建一个图层,用3像素的硬画笔执行路径描边,然后用橡皮工具擦掉两端部分。

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

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

7、勾出一个三角形选区,新建一个图层,选择渐变工具颜色设置为从白色到透明,然后由左向右拉出线性渐变。

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

8、复制上面的不做的渐变图层,把图层的不透明度改为:68%,并把下面那个渐变层的图层混合模式改为柔光。

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

9、按Ctrl点图标主体载入选区,新建一个图层,执行2像素的描边颜色为:#037B02。

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

10、在尾部拉出一个2像素高的选区,新建一个图层,用渐变拉出白色到透明的径向渐变,作出尾部高光细节。

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

11、新建一个图层,并放到最下层,做一个黑色到透明的径向渐变,然后按Ctrl + T压扁并拉长。

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

12、放到箭头下面的位置,把图层的不透明度改为:30%,完成最终效果。

Photoshop制作UI小图标绿色箭头教程,PS教程,图老师教程网

来源:https://www.tulaoshi.com/n/20160216/1569890.html

延伸阅读
新建文档1280x1024像素,背景白色,建新层,用钢笔勾出下图所示形状,填充黑色。 复制一层,填充任意颜色,我填充的是蓝色,用直线套索做如下选区,反选添加蒙版 添加图层样式 效果如下 建新层,用钢笔做如下选区,填充白色 添加蒙版,用黑色柔角笔刷涂抹尾部tulaoshi.c...
本教程介绍绿色环保图标的制作方法。整个制作过程比较简单,大部分的工序都是用钢笔工具来勾图,然后把勾好的图形填充渐变色。再适当调整好整体的光感和细节即可。 最终效果 1、新建一个600 * 600 像素文件,背景填充白色,也可以适当加点渐变色。新建一个图层用钢笔工具勾出屋顶的路径如图1,转为选区后填充颜色:#2C6B03,效果如图2,...
标签: PS PS教程
最终效果图 (友情提示:文章最后页提供PSD源文件下载): 效果图 1、打开ps,新建一个文档,300px*400px,填充黑色背景,依照下图打好参考线。 图1 2、新建一个图层,沿参考线做一个选区,填充上灰色,然后缩选1px,删除多余的色块,创建出边框;也可以用描边的方式来完成。 图2 [next] 3、复制边框图层,选择边框内的...
标签: PS PS基础
先看效果图 新建文档1280x1024像素,背景白色,建新层填充黑色,添加图层样式。 效果如下。 建新层,用钢笔画出下图形状,填充黑色。 添加图层样式。 效果如下。 建新层,用钢笔画出箭头尾部形状,填充黑色。 添加图层样式。 方法同上,用钢笔画出箭头的侧边,填充黑色。 添加图层样式。 效果如下。...

经验教程

537

收藏

40
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部