PS制作一个时尚网页文件夹图标
来源:未知 作者:admin
原出处:webdesign
转载自:Iconfans
作者:Nico Harather
翻译:S.Shek
In this tutorial you will learn how to create a nice folder for your desktop or a website.
1. First of all create a new document which is 128 x 128 pixels large and has a transparent background.
2. Make a new layer, choose the Pen Tool and draw a shape wich is similar to this one:
在这个教程里你将学会如何为你的桌面或网页制作一个漂亮的文件夹(图标).
1,首先我们需要新建一张大小为128*128像素的画布,选择透明背景.
2,新建图层,然后使用钢笔工具画出一个类似于下图的形状.
3. Now use the following settings:
Gradient Overlay
#FFd27A -> #FFB912
Stroke
Size: 1px
Position: Outside
Color: #C07C33
Inner Glow
Blend Mode: Normal
Color: #FFFFFF
Choke: 100%
Size: 1px
After that it should look something like this:
3,然后将图层样式设置如下:
渐变叠加
渐变:#FFd27A -> #FFB912
描边
大小:1像素
位置:外部.(外描边)
颜色:#C07C33
内发光
混合模式:正常
颜色:#FFFFFF
阻塞:100%
大小:1像素
设置完这些之后你会看到如下图的效果.
4. Then you duplicate the layer with the shape. Now you have to perspectively distort the new layer as shown on the picture:
4,然后复制一层.现在我们需要在新层上进行透视变换.(自由变换 -> 透视)
And now scale it down a little bit, so that it looks like an 3d opened folder:
然后把这里向下缩小一点,让它看起来像3D的打开文件夹.
The result of step 4:
第四步的效果如下:
5. In this step we're going to add a piece of paper. So make a new layer and draw a shape like the one on the picture:
5,这一步我们将制作一张纸.新建图层,画上如图的形状.
6. Now go to the layers palette and use the following settings:
Gradient Overlay:
Opacity: 10%
#000000 -> #FFFFFF
Angle: 50°
Stroke
Size: 1px
Position: Outside
Color: #D6D6D6
It should now look similar to this one:
6,接着将图层样式设置如下:
渐变叠加
不透明度:10%
渐变:#000000 -> #FFFFFF
角度:50°
描边
大小:1像素
位置:外部
颜色:#D6D6D6
现在看起来应该像这样:
7. Next you turn the piece of paper to the left a little bit and put this layer under the layer with the 3D folder thing from step 4.
7,接着把这张纸向左旋转一些,然后把这个图层放在第四步的图层之下.
8. That looks quite nice, but the thing wich makes it look like a really cool icon, is to set the opacity of the 3D folder part to about 50-60%.
8,现在看起来就漂亮多了,但是我们还可以让它更酷一些,只需要把第四步的图层的不透明度设置在50%-60%左右.
That's it. You can add some details and use it for a website or make an .ico file and use it for your desktop.
Thats what I came up with in the end:
就是它了! 你可以再为它增加一些细节,然后用在你的网页上,或者把它制作成.ico格式的图标应用在你的桌面上.
下面就是我最后做出来的:
Two other things wich I made with exactly the same folder parts:
我在相同的文件夹上做出的另外两种效果:
I hope you liked my first tutorial, and I'm looking forward to make another one soon!
Have fun!
全教程完,学完记得交作业。如果本教程对您有所帮助,请推荐给你的朋友。
推荐教程
-
LOGO教程,用PS制作烫金效果的logo
艳阳天的星星 -
ps个性欧洲杯logo标志
佚名 -
用PS制作卷曲的不干胶纸帖图标教程
一起PS吧译 -
ps图标制作教程:碳纤维图标
空来风 -
图标设计,用PS快速给徽标文字排版
零下一度 -
LOGO教程,曲面四分环的画法
y123456 -
LOGO教程,用PS制作烫金效果的logo
艳阳天的星星 -
LOGO教程,教你设计扁平化的谷歌logo图标
y123456 -
logo设计技巧小结
wenwen881218 -
photoshop制作国外彩虹Logo教程
oosodof -
用ps制作Itunes10logo
一起ps吧 -
Photoshop打造圆饼形的质感图标教程
bbs.16xx8.com -
PS制作矢量苹果图标
微风细雨