导言:
有时,我们在制作图标时需要尝试许多不同的风格,通过对质感的把握,来达到突变在不同环境下的用途。这套浏览器图标皱纸版是通过官方山寨版处理而来。下面就是以制作Opera图标为例,来介绍如何用Photoshop制作这类图标。在制作的过程中,需要不断对比官方原版。希望对你有所帮助,让我们开始吧!
新建一个250px×250px的文档。再新建一图层,命名为128px。用于确定图标的尺寸。保存该PSD文件,命名为Opera。(图01)
图01
在工具栏选择矩形工具,画出一正方形。按住shift绘制一个正方形,再选择编辑→自由变换路径,来调整正方形为128px×128px。(图02)
图02
再把该正方形填充为任一种颜色。接下来新建一图层,命名为icon,准备画图标。(图03)
图03
选择椭圆工具,在正方形区域内画出外椭圆。参照官方图标来确定长宽。(图04)
图04#p#e#
按住Alt键,用相同的工具画出内椭圆,添加两个锚点,用直接选择工具拖动各个锚点,调整内椭圆。(图05)
图05
用路径选择工具,同时选中两椭圆,右键→填充路径,使用颜色,色值#b21618。然后,删除路径。(图06)
图06
新建一图层,命名为shadow,准备画阴影。(图07)
图07
用相同的方法画出阴影轮廓,并填充为黑色,设置图层不透明度为50%,调整图标位置和大小,使其完全位于128px图层内部,且饱满。然后可隐藏128px图层。(图08)
图08#p#e#
双击icon图层,调出图层样式面板,设置斜面和浮雕。(图09)
图09
设置参数如图。(图10)
图10
新建一层,命名为glarel,准备画出左边的高光,选择渐变工具。(图11)
图11
调出渐变编辑器,设置滑块的不透明度和色值。从左到右不透明度和色值分别为:(图12)
0% #eab239
25% #ea8c39
100% #fddad7
25% #ea8c39
0% #eab239
图12#p#e#
按住Ctrl键,点击icon图层,调出其选区,再选中glarel图层。从右上往左下拖动渐变条,画出渐变高光。然后删除右侧的高光。(图13)
图13
新建一图层,命名为glare2,用同样的方法,画出其右侧的高光。再用橡皮擦工具稍微擦除下两高光的边缘。(图14)
图14
复制icon和shadow图层,并把复制出来的两个图层合并,生成icon副本。隐藏icon和shadow图层。(图15)
图15
选中icon副本图层,选择滤镜→扭曲→波纹,设置参数如图。(图16)
图16#p#e#
选择滤镜→液化,使用向前变形工具,对图标进行略微的变形。(图17)
图17
选择滤镜→画笔描边→喷色描边。(图18)
图18
新建一层,命名为texture,找一张褶皱纹理的图将其定义为图案。再选择油漆桶工具,并选择图案和那张褶皱纹理贴图。(图19)
图19
按住Ctrl键,点击icon副本图层调出选区,填充texture图层,并将图层设置为线性减淡(添加)。(图20)
图20#p#e#
新建一图层,命名为texture2,用同样的方法用另一淡色褶皱纹理贴图。(图21)
图21
设置图层为正片叠底,不透明度90%。这个皱纸版的图标就大致完成了。显示128px×128px的图像。隐藏所有背景,导出Png图片,这样我们就完成了。(图22、23)
图22
图23
上一篇 创建优雅的3D玻璃质感文字
热门课程
专业讲师指导 快速摆脱技能困惑相关文章
多种教程 总有一个适合自己专业问题咨询
你担心的问题,火星帮你解答本文是关于Unreal Engine基础学习的全面指南,适合初学者以及想要提升技能的开发者。
一个深度解析无基础UE5短期培训的文章,了解短期培训的重要性,以及火星时代教育如何帮助零基础学员快速掌握UE5。
对比各类视频剪辑软件,分析并推荐专业而质量上乘的视频剪辑软件培训机构
C++编程学习中心致力于为学子提供深度和广度的C++编程知识,火星时代教育则为学习者提供威谛教学环境。
了解虚拟现实技术的价值和应用,并探索专业的VR技术培训班,提升你的技能和知识
为寻求高质量室内培训方案的人提供一些指引,并介绍火星时代教育的专业服务。
1. 打开微信扫一扫,扫描左侧二维码
2. 添加老师微信,马上领取免费课程资源
同学您好!