收藏本站腾讯微博新浪微博

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 网站开通淘帖功能 - 蓝色理想插件 论坛内容导读一页看论坛 - 给官方提建议

论坛活动及任务 地图和邮件任务 请多用悬赏提问 热夏来袭,选一款蓝色理想的个性T恤吧!

手机上论坛,使用APP获得更好体验 急需前端攻城狮,获得内部推荐机会 论坛开通淘帖功能,收藏终于可以分类了!

搜索
查看: 2347|回复: 0

[探讨] 超强创意,PS游戏场景制作过程。

[复制链接]
发表于 2013-4-3 15:06:47 | 显示全部楼层 |阅读模式
本帖最后由 evan23cai 于 2013-4-3 15:13 编辑

Final Product What You'll Be Creating
Photoshop is a fantastic application because it allows you to create just about anything your imagination can dream up. In this tutorial, we will show you how to create a science fiction environment using digital painting and illustration techniques. While working on this piece, you will learn how to set up your color scheme, set your perspective, and even how tocreate a monster robot. Let’s get started.


Tutorial AssetsThe following assets were used during the production of this tutorial.

Step 1Let’s get started. Create a new document in Photoshop with following settings, then import the “Base photo” asset and place it as shown below. You can delete the Background layer. I called that first layer “Import”.



Step 2Duplicate the “Import” layer, call the new one “Extend” and hide the “Import” one. We keep it at the bottom to be sure to have an untouched photo somewhere in our layers. Do a very thin selection, transform it, and fill the empty area as below.


Paint few strokes to break that stretching such as shown below.


Step 3Create a new Group called "Persp". Add a new layer called "Point 1", and draw the perspective lines. Do the same on a different layer for the second point. Set the group’s Opacity to 40%. Feel free to hide and unhide this group whenever you need to check the perspective of your draw. Have a nice hierarchy in your layers, "as always."




Step 4Above the “Extend” layer, create a new “Tweaks” one and add some light and smooth colors at the perspective point. Start to refine a bit the rough part of the sky.

On a new "BG Overlay" layer, start refining the background with very basic shapes just as below. Pick colors you find on the "Import" layer, at the same level in perspective. Tweak them a bit, as I did on the right side. Variations in colors bring a realistic impression, even small value changes.


Step 5Now add a new “FG” group and draw the foreground buildings on a new “FG” layer with darker tones you directly find on the canvas. Keep in mind that the shapes must stay very sketchy at this step and don’t spend any time into small details. You can use custom brushes to have some nice effects very quickly, as speed painters do for example.




Step 6On a new “BG Buildings” layer under the “BG” group, create some basic shapes of buildings. Refer as below (main color I used for this is #332f36). And this is it, we already have the environment setup for this tutorial. Let’s move on.



Step 7Create a new Adjustment Curves Layer above the “BG Overlay” with following settings. We don’t want that Adjustment Layer to change the bottom of the sky. Therefore, with the grade tool, create a black/white ramp in the Layer Mask of the “Curves 1″ layer such as below.


Then, by pressing Command/Ctrl+L (Image > Adjustments > Levels…) on the “BG Buildings” layer, do some changes as below to match the new sky.

The result of this step is a background more detached from the foreground. This is very important, since we don’t want the viewers to be distracted due to the amount of information we will try drawing.


Step 8Now you can start refining a bit the edges and adding details. Don’t be too precise, refer to below.

I darkened and changed the colors of those areas from the foreground.

Here is our result.


Step 9On a new "Battle scene" group, create two layers called "Robot" and "Robot lasers". Start drawing a robot, which is going to be the "bad guy" of this illustration. I place it over one perspective point. This is an easy way to lead the viewers’ eyes to this Robot.


Step 10Let’s refine part of the "BG Buildings" we created before. Hide the "Battle scene" group. Basically, just paint some more precise and defined shapes with hard brushes and/or custom brushes.

Do the same with “FG” and refer as shown below. This step is a bit long, but necessary.


And here is the result of this refining step.


Step 11Refine the Robot now.

Quickly create some soldiers and the lights of the guns on 2 new layers.




Step 12Add more light to the ground and refine the shadows in the “FG” layer.

Do some refining on the buildings as well, as you can see below.

Change a bit the brightness (Image > Adjustments > Brightness/Contrast) of selected parts of the “BG Buildings” layer, to add some more depth in the draw.


Import the “Soil” from the asset and transform it to match the perspective and the ground. Set is as a Clipping Mask to the “FG” Layer, set his Blending Mode to “Overlay”, and erase the parts that aren’t over the ground in a Layer Mask.

Here is the result of this step.


Step 13Now it is time to add some fine details. Let’s start with the Robot.

Add more Contrast (100) and Brightness (10) on the “BG Buildings” layer (Image > Adjustments > Brightness/Contrast…), remove some saturation (set Saturation to -20 in Image > Adjustments > Hue/Saturation) and refine even more, such as shown below. Don’t worry about hidden parts.

And again, refine the foreground. The whole process is about refining everything step by step. This is a bit dangerous since we tend to focus refining only on one main point. A good tip to avoid this is to constantly flip the canvas horizontally. But trust me, I can’t even count the number of times that I failed because I started focusing only on one point or side. I wasn’t anymore able to tell what was wrong with my illustrations in every case, so I left them.

Now, between the “FG” and the soil layer, as a clipping mask, add a new “Building Noise” layer. With black and white as selected color, create clouds (Filter > Render > Clouds). Set this layer’s Opacity to 30% and his blending mode to Overlay. Move it a bit at the top of the canvas to have it active only for the building part of the “FG” layer.

Create a new layer above the soil one, but without being set as Clipping Mask. Rename it to “Fog”. Select such a color : #644e60, and with a soft brush and a very low opacity, create a fog overlay effect, such as shown below.


Step 14Time to do the first Color Balance. Create that new Adjustment Layer and set as below.


By painting in the Layer Mask, hide the background parts of that Color Balance Adjustment Layer. It doesn’t need to be very precise, refer as below, as always.



Create a new "Lights" layer above the "Color Balance 1" one, fill it with black, set his blending mode to "Linear Dodge (Add), and with a color at full saturation and brightness set at 50% (for example #007d8c), with a soft low opacity brush set to Screen, create those beautiful light effects.

Refine the “Robot Laser” layer, add a small explosion effect with a grunge brush. Add some small pieces being ejected away from the explosion on a different layer I called “Explosion”. Resize the soldiers and tweak them as below, since they were too big for the general scale.

Here is the result of this step.


Step 15Above the “Curves 1″ layer of the “BG” group, add a new Level Adjustment Layer. Set it as below to darken the sky.


Now with the Brightness/Contrast tool, change the Brightness of the “BG Buildings” layer to -67 to darken them as well.

Do the same to the “FG” layer, with Brightness set to -40 and Contrast to 60. We really need heavy contrast on the foreground. Then, on a new “Shadows” layer above the “Lights” one, with a black color, paint some shadows. You have a preview of how I painted them below, in red. Use the Eraser tool with a soft brush if needed, to create some nice shadows. Then, set the blending mode to “Multiply”, and the Opacity to 50%.


On a new "Final FX" group right below the "Persp" one, create a new "SciFi Lightning" layer that is similar to the "Lights" one. Create a global sci-fi cyan lightning. Here is a preview about how your layer must look like if you set his blending mode to normal. Once you have the same, reset is to Linear Dodge and set his Opacity to about 60%.

It changes a lot the mood of the draw, and bring it to something more cold and futuristic.

Here is a small overview of our layers.


Step 16Let’s refine the “BG Buildings” for the last time. I added some lights on a separated layer, “Final lights”.




Step 17Let’s refine the "FG" for the last time. Adding such small details as wires, antennas, and barriers comes only at the end of the process. It adds lots of realism and details, but if you focus on adding this kind of stuff when the draw is still not well defined, you’ll have some serious problems with the illustration looking good. I simplified a lot the ground as well, since we’ll redraw the shadows nicely. You probably noticed that we had a double shadow effect until now. I disabled the layers above the "FG" one and his clipping mask layers, to help you compare what I have without those overlay layers and what you should have.

Right above the “FG” layer (and as clipping mask of course), create a new "Brushes" layer. Then draw some small effects with some specials “speed painting” brushes, to add fine details.


I reactivated the layers of the “FG” group. Then, above the “Color Balance 1″, I created a new “Ground Noise” layer, blending mode set to Overlay and Opacity to 65%. Then, with a grunge brush, I added those kind of nice variations to the ground.

Here is the picture with the redefined “Lights” layer.

…And with the redefined “Shadows” one.

Here is the look of this step. The draw starts to be really similar to the final one.


Step 18At the top of the “FG” group, create a new “FGG Add” one and draw those 2 structures. I had the feeling it was needed to have some kind of very near structures there.



Then, refine few layers. Here, “Soldiers”.

“Soldiers lasers”, “Robot” and “Robot laser”. We’ll create the explosion in the next step.




Step 19At the top of the “Battle scene” group, create a new one called “Explosion”. Then, with a grunge brush, create such an explosion. The idea is to start from the exterior with some dark very saturated reds, and to go inside step by step with colors going to something like very light low saturated yellows, at the center of the explosion.

On a new “EXP Details 1″, draw some small mini-explosions going outside of the main one.

On a new “EXP Details 2″, draw some metal pieces as shown below.

Then, by using the same process you did to create the lightning effects, add some glow to the explosion on a new layer, “EXP glow”.

Here is the look.


Step 20Let’s move to the “Final FX” Group. Create a new Level Adjustment Layer, set it as below, and add some black at the background on the layer mask. The idea is to add some more contrast in the foreground.



Create another Level Adjustment Layer with following settings and layer mask. Goal here is to create a vignetting effect, and to darken few parts of the foreground.




Step 21Now create a new “Hard Edges” Layer, apply an image on it (Image > Apply Image, then press OK without changing the settings). Add a Filter > Sharpen > Sharpen More. Create a layer mask, and draw in black the background: we don’t want it to be sharpened. Refer as below.


With black and white as selected colors, create clouds (Filter > Render > Clouds) on a new and last “Global noise” layer.. Then, add some noise to those clouds. (Filter > Noise > Add Noise). Set it as below. Change the blending mode to Multiply, and the Opacity to 4%. And here we are, that’s our final draw..



DetailsZoom in and take a look at some of the details.






Final Image

转自云下载博客
您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|Archiver|手机版|blueidea.com ( 湘ICP备12001430号 )  

GMT+8, 2020-7-13 14:01 , Processed in 0.109102 second(s), 7 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表