• 思缘论坛首页
  • 论坛搜索
  • 设计软件,PS下载
  • 平面设计
  • 精品套图素材
  • 高端国外素材
  • 缘分币充值
发新话题
打印

[PS绘画] Photoshop创建一个超酷的黄色钢盔图标

Photoshop创建一个超酷的黄色钢盔图标

Photoshop创建一个超酷的黄色钢盔图标

作者:kitty-z  出自:Iconfans

先看看效果图:



Step 1

As a base, we will use this photograph I took. It's not the greatest photo, but we can use it to define the basic shapes. The advantage of this photo is the fact that it was taken with wide-lens camera, and the perspective is nicely visible. When we talk about icons, perspective is very often VERY excessive, so this is perfect.

第一步

我们将用我找到的这张图作为基础。这张图不一定是最好的,但是我们可以用它来界定我们要做的头盔的形状。这张图好在它是用广角相机拍摄,而且透视图非常清晰,当我们谈到图标时,透视图是非常重要的,所以这张图非常完美。



Step 2

So firstly, cut the helmet out of its background. You can do this using the Pen Tool, or your favorite way of extracting images. Then copy this photo into a new Photoshop document and resize the image to fit the icons dimension — probably 128x128 px. You can use, for example, a new layer sized 128x128, which will help you to be more accurate. Or you can, of course, use document sized 128x128 px, but I like to have more space for drawing.

第二步

首先,将头盔从背景中抠出来,你可以用钢笔工具来完成,或者任何你喜欢的抠图的方法。然后拷贝这张图到一个新的PS文档,调整大小以适合图标的尺寸——一般是128×128像素。

比如你可以将其新建一个图层并将图像调整为128×128像素,或者调整画布大小为128×128像素,但是我比较喜欢更大的空间来绘制。



Step 3

Select the Pen Tool and step-by-step trace each part of the helmet. We begin with the visor area. Don´t worry about the color, it's the shape that's important. For better accuracy, it's good to decrease the layer´s visibility (Opacity). Simply press the numlock key corresponding to the percentage opacity you want &mdash for example, 5 for 50% Opacity. When tracing, be sure to draw as a Shape Layer (first icon on the Options bar), so you can modify this layer in the future.

Note that because we're just tracing the visor, it doesn't matter that the rest isn't accurate around the helmet shape (we'll do that in the next steps).

第三步

选择钢笔工具一步一步的描出头盔的每个部分。我们从帽舌开始,不要担心颜色,形状最重要。为了能更加精确,最好调整一下图层透明度,你可以用小键盘来控制,举例来说,5就是50%透明度,当你开始描的时候,确保你画的是形状图层,这样你在后面才能修改它。记住因为我们只是描的帽舌部分,所以被帽子挡住的那部分不必描那么精确。(我们在后面不会用到那部分的)



Step 4

Create the second part of the peak by copying the previous layer (Ctrl + J) and move the selected points upward with the Direct Selection Tool (A).

第四步

通过复制图层(Ctrl+J)以及使用直接选择工具上移选择的点来创建尖尖的第二部分。



Step 5

Then trace the main part of the helmet as shown below.

第五步

然后照下面的描出钢盔的主体部分。



Step 6

Don´t forget the embossed part in the middle (magnified on the next screenshot). You can make it purposely bigger, because the middle streak will nicely help you to define the 3D shape of the helmet.

第六步

不要忘记中间的突起部分(旁边的图是放大以后的)。你可以把它做的尽可能大点,因为中间的尖尖能更好的帮你界定钢盔的3D阴影。



Step 7

That is why you can draw this streak as a new layer too. First, start with the right part - which is in the shadow.

第七步

这就是为什么你也能像一个新图层一样来画这个尖尖。首先,从右边的部分开始——就是阴影那部分。



Step 8

Then duplicate this layer (Ctrl + J) and with Direct Selection Tool, move the point on the right to the left. This way, the right side of this shape will perfectly fit the left part of the previous layer.

第八步

然后复制这个图层并用直接选择工具,移动右边的点到左边去。这样,形状的右边部分就能完美的贴合之前图层的左边部分。



Step 9

You are ready to go to the next level. Hide the photograph (or move it to the side), and as you can see, the basic shape of our icon is done. You should now have five layers of shapes ready for the next stage. I'll refer to them by numbering in order of how we drew them (1-5)

第九步

你准备开始进入下一阶段了。隐藏原始图片(或者把它移到旁边去),就像你看到的那样,我们图标的基本形状已经完成了。你现在应该有5个形状图层来准备进入下个阶段。我将按照我们绘制的顺序来把它命名为1-5.



Step 10

To start, hide all layers except the first one (1) and fill this layer with yellow color (#FFDF14). Then create new layer (Ctrl + Shift + Alt + N), and group it with previous (Ctrl + Alt + G). On this screenshot, it´s layer (2). Into this layer, draw with big soft brush with darker color (#D59D00) so the layer will be darker on the right side. Next, load the selection of layer (4), invert the selection (Ctrl + Shift + I), create new layer (3) and again use big soft brush to draw a shadow on the right side ( #3B1C02).

第十步

作为开始,隐藏除了第一个(1)意外的所有图层并将图层填充为黄色(#FFDF14),然后创建一个新的图层(Ctrl+Shift+Alt+N),并将它与前者编组(Ctrl+Alt+G),在这个截图中,它是图层(2),在这个图层中,用大的软的黑色(#D59D00)笔刷来画出让图层右边暗一些的效果,接着,选取图层(4)的选区,反选(Ctrl+Shift+I),创建新图层(3)并再次用大的软的笔刷来画出右边的阴影(#3B1C02)。



Step 11

So that you don´t have to do it all again for layer (4), show this layer with decreased opacity to 50%. This way, you can still see the shadow from the previous layer — how easy. For now, the peak is done and you can continue with the main part of the helmet.

第十一步

这样你不用为图层(4)都再做一遍,将此图层的透明度调整为50%。这样,你仍然可以从之前的图层中看到阴影——多么简单啊。现在为止,尖尖已经完成了并且你可以继续头盔的主体部分了。



Step 12

So, unhide the shape of main part and recolor it to the yellow (#FDDB13). Again, create a new layer, group it with previous (Ctrl + Alt + G), and in the marked areas, use big soft brush with darker color. It´s not necessary to make a very big shadow...

第十二步

主体形状部分取消隐藏并重新着色(#FDDB13),再一次,创建新的图层,与前者编组,并在标记的区域用大的软的更黑的笔刷来绘制。这里没必要做出一个很大的阴影….



Step 13

For a better result, you can use the middle streak. Unhide this layer, recolor it to the dark yellow (#AA6F00), and add a layer mask. Into this mask, draw in the middle with a big soft black brush (as shown below), and the layer will be visible only on the sides, not in the middle.

第十三步

为了一个更好的效果,你可以用一个中间蒙版,取消隐藏这个图层,用暗黄色(#AA6F00)重新着色,并添加一个图层蒙版,在这个蒙版中,在中间用大的软的黑色(就像下图这样)笔刷绘制,这样图层将只有边缘可见,中间不可见。



Step 14

Next, unhide the last layer, the main part of the streak. Recolor it to yellow (#FBD500). In this step, you can also darken the main part of the helmet to match the peak.

第十四步

接着,取消隐藏最后的图层,条纹的主体部分。用黄色重新着色(#FBD500)。在这一步,你依然可以调暗钢盔的主体部分来配合条纹。



Step 15

To make the shape of the helmet more accentuated, use this simple method: draw a one-pixel outline around every shape where the light shines.

Start with second peak layer. Load the selection (Ctrl-click on the layer), create new layer, and from the Edit menu select the Stroke function. Set the Width to 1px, color white.

第十五步

为了让头盔的阴影更突出,用这个简单的工具:在每个形状的边缘被光照到的地方画一个1像素的白线。从第二个尖图层开始,读取选取(Ctrl+点击图层),创建新图层,从编辑菜单中选择描边功能,设置宽为1像素,白色。



Step 16

Add a layer mask to this layer and fill it with black color. This way nothing is visible. Then select a big soft white brush and draw into the mask where the light should shine. The outline will be visible only where the white area is in the mask.

第十六步

添加一个图层蒙版并填充为黑色。这样任何东西都不可见。然后选择一个大的软的白色笔刷在光线会照到的地方对应的蒙版位置绘制一小片白色。只有蒙版上的白色区域会让轮廓可见。



Step 17

Use the same method for the other shapes. The icon is really starting to take shape now!

第十七步

用同样的方法来对付其他的部分,图标开始真的出现立体感了!



Step 18

Continue with another darkening in selected areas (shown) where the contrast between the helmet parts is too low.

第十八步

在下面标记的对比度太低的头盔部分继续调整。



Step 19

To make the icon even better, you can add backlight with another color. This will help a lot because icons with only one color tend to look a little dull.

Firstly, load the selection of all shape layers (Ctrl + Shift – click on the layers), create new layer, contract the selection of 1 pixel (Select > Modify > Contract), and use a big soft brush to draw the backlight, as the arrow shows. Use whatever color you like, light blue or violet work well.

第十九步

为了让图标更好看,你可以用另外一个颜色添加一个背光。这将很有效果因为图标只有一个颜色将看起来比较不鲜明。

首先,选择所有形状图层的选区(Ctrl+Shift+点击所有图层),创建新图层,缩小选区1像素(选择>修改>收缩),并用大软笔刷来画背光,就像箭头所示,用任何你喜欢的颜色,亮蓝或紫罗兰效果很好。



Step 20

The last thing you will be adding is the very big highlight. As in the tutorial iMouse — Creating an Apple Mouse (which I also wrote!), start with Pen Tool and draw the window shapes:

第二十步

最后的事情就是添加大型高光。照图做吧,用钢笔画出窗户的形状开始。(原作者说的是他之前在另外一个教程讲过方法,所以这里大家各自发挥想象力,或者照着图里面的做,依葫芦画勺吧)



Step 21

Copy this layer (Ctrl + J) and blur it with Gaussian Blur filter (set the Radius to some low number).

第二十一步

复制图层并高斯模糊(数值低一点)



Step 22

Now draw with big soft white Brush over the highlights, to make it even more shiny. Don´t worry about the window shapes, it´s not necessary to see them completely.

第二十二步

现在用大软白笔刷来覆盖高光,这样看起来会更反光。不要担心窗户的形状,不可能看的那么完整。



Step 23

And that´s it!

第二十三步

完成!!!



As you can see in this picture, the helmet is more outstanding on the dark background, so don´t be afraid to experiment and try to create icons from different photographs. Good luck with your work!


教程中需要的素材请访问:优秀的PS素材和图片素材

TOP

这是国外的吧,看起来就很不错哦

TOP

发新话题

关于本站 广告服务 联系我们 版权隐私 合作站点 网站地图 免责申明 管理团队

Powered by Discuz Copyright © 2005-2019 www.MissYuan.com All rights reserved.站长QQ8713688 邮箱8713688@qq.com