Tài liệu 2D Artwork and 3D Modeling for Game Artists- P8 doc

324 Inorganic Texture Tutorials with Photoshop 14 Apply an inner bevel to the cross to complete the effect (see Figure 8.194) Bevel and Emboss Inner Bevel Smooth 510% Down 16 pixels TE Style: Style: Technique: Depth: Direction: Size: Soften: AM FL Y Figure 8.194 Add a dark cross on a new layer, and apply an inner bevel to turn the rivet into a Phillips-head screw The rivets and screws will look much better once you’ve scaled them down to size In the image shown in Figure 8.195, I added a bunch of them, then applied the dripping-rust effect that we did earlier Figure 8.195 Scaling down the rivets and screws will make them look very real Add dripping-rust effects to crown it all off ® Team-Fly to remove this watermark Please purchase PDF Split-Merge on www.verypdf.com And the Rest 325 And the Rest There’s only a handful of stuff left that I want to show you, so I didn’t bother to try to sort everything into separate main categories Wood I know, wood is technically an organic texture But this chapter focuses on textures that make up all types of building materials for a scene, so I decided to squeak it in here As with other textures, you can create wood one of two ways: by taking a picture of the real thing, or by making it from scratch via filters I’ve tried to re-create wood from scratch, but the best I’ve come up with is something that looks like those snap-together, faux-finish plastic pieces kids get for G.I Joe karate boards NOTE (see the Crate tutorial in Chapter 9) I’ll show you a couple filtering techniques for creating wood, but only for fun (using pictures of wood is by far the best way to go): If you did any of my Photoshop tutorials, the sampler.psd file had a piece of fake wood I made Start a new 512×512-pixel RGB image (Dimensions aren’t critical here, since most of the time you’re only interested in slivers of wood for boards.) Press D to reset your swatches Choose Filter, Render, Clouds Start a new layer and fill it with the foreground color (black) Choose Filter, Sketch, Graphic Pen Use a Vertical setting; this will be the wood grain (see Figure 8.196) Figure 8.196 Apply the Graphic Pen filter for wood grain Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark 326 Inorganic Texture Tutorials with Photoshop Filter: Stroke Length: Light/Dark Balance: Stroke Direction: Sketch, Graphic Pen 15 50 Vertical Select the Magic Wand tool and make sure you uncheck Contiguous in the tool’s Options panel Click a portion of the grain layer that’s black to select all the black parts of the layer Right-click on the selection, and choose Layer Via Cut Delete the middle layer that has the white stuff that got cut out 10 The grain is now isolated on a transparent layer above the background layer Apply a slight outer bevel to the grain layer to raise its surface (see Figure 8.197) Figure 8.197 Apply an outer bevel to the grain layer Style: Style: Technique: Depth: Direction: Size: Soften: Bevel and Emboss Outer Bevel Smooth 100% Up pixels Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark And the Rest 327 You can now flatten this image and take long rectangular selections as boards Kind of sucks, doesn’t it? Your best bet is to play around with colors, or even try the Liquify command (Ctrl+Shift+X) on the grain layer to produce knots and the like Like I said, though, the absolute best way to make anything out of wood is from an image Let’s go ahead and make a wooden sign based on wood from a picture: Start a new 512×512-pixel RGB image Fill the background layer with black Open the woodpic.jpg file in the Chapter Data section on the CD-ROM (see Figure 8.198) Figure 8.198 The woodpic.jpg image from which you’ll extract some wood Using the Polygonal Lasso tool, select a board from the image, copy it, and paste it into a new layer Repeat for a second board (pasting it into a new layer as well), as shown in Figure 8.199 Scale each board so it fits in the image TIP You don’t have to a perfect job with the selection In fact, it’s better to keep your selection boundary within the border of the wood so you don’t have to clean up the edges Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark 328 Inorganic Texture Tutorials with Photoshop Figure 8.199 Copy and paste two boards from the picture into your new image (I’m using the two vertical boards on top.) Rotate the two boards horizontally and align them so they are parallel to each other with just a slight gap in between (This is going to be a rustic old sign, so don’t be too finicky.) Merge the two board layers when finished (see Figure 8.200) Figure 8.200 Rotate and align the boards with a slight gap Let’s tear up and then apply a 3D effect to the left and right edges of the boards to give it some depth Using the Lasso tool, make a jagged selection along the left edge and choose Layer Via Cut As shown in Figure 8.201, my selection is only slightly inside of the edge of the wood Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark And the Rest 329 Figure 8.201 Make a jagged cut at the end of the boards onto a new layer Position the layer between the other two Small jagged selection Move selection layer below the top boards Move the new cut layer from the top of the layer stack to the middle Apply a drop shadow to the top layer (the one with the boards) 10 In the jagged cut layer, use the Lasso tool to make another jagged cut to its outside border to match the inner jagged cut Now the board’s overall edge looks three-dimensional and chopped up (see Figure 8.202) Figure 8.202 Apply a drop shadow to the top boards, and cut up the edge to complete the 3D effect Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark 330 Inorganic Texture Tutorials with Photoshop Style: Blend Mode: Opacity: Angle: Distance: Spread: Size: Drop Shadow Multiply 75% degrees 45 11 Repeat the jagged look for the right side of the board TIP Later on, you can use the Burn tool to further darken areas that stand out, particularly the sharp edges at the ends of the boards 12 Link all layers except for the background layer, and choose Layer, Merge Linked 13 Let’s bind the two boards with a rusty iron, er, binder First, create a new layer 14 On the new layer, use the Rectangular Marquee tool to create a selection near the left end that’s slightly thicker than the two boards combined 15 Fill the selection with the Rusted Metal texture 16 Apply a drop shadow to the binder with the same settings as before (see Figure 8.203) Figure 8.203 Make a rectangular selection on a new layer and fill it with Rusted Metal This will be the metal that binds the two boards together Binder slightly thicker than both boards 17 On a new layer above the binder, add two rusty rivets using the Rivet procedure outlined earlier in this chapter Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark And the Rest 331 18 Link and merge the rivet layer with the binder layer, then copy it to the right side of the boards (see Figure 8.204) Figure 8.204 Add rivets to the binder, and copy the binder to the right side 19 Add and scale some dark text to the wood with a font of your choice I masked and spattered my text selection before filling it, as demonstrated earlier in this chapter, to give it a weathered look 20 Apply a contoured outer bevel to recess the text into the wood 21 Rasterize the type and cut out a selection where the gap between the boards exists (see Figure 8.205) Figure 8.205 Add text to the wood and apply a contoured outer bevel Split the text where the gap exists between the boards Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark 332 Inorganic Texture Tutorials with Photoshop Now just add some finishing touches to your work In the image shown in Figure 8.206, I put the sign on the stone wall we made a while ago, then added some dripping-rust effects from the iron binders Also, add a drop shadow for the entire sign on a wall to give it depth, and use the Burn tool to burn out those annoying highlights everywhere Figure 8.206 The completed wood sign on the stone wall Glass Doing the actual texturing for glass is very simple if you think of glass in terms of alpha transparency, dealing strictly with a grayscale range Pure black represents 100% transparency, whereas pure white is 100% opaque For instance, Figure 8.207 shows a texture with a linear grayscale gradient applied, and how it would look when rendered in the game’s engine Notice that behind the window you can see objects, but things get more opaque towards the bottom Figure 8.207 A grayscale gradient texture applied to a window Notice that the window becomes more transparent towards the darker end Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark And the Rest 333 A typical window, for example, would be completely transparent (all black), featuring very light gray streaks to represent the reflection of light Let me show you a quick one: Start a new 512×512-pixel RGB image Fill the background with pure black (hex# 000000) Create a new layer Use the Rectangular Marquee tool to make a small rectangular selection Fill the selection with pure white (hex# FFFFFF) To skew the area for that “glass” look, choose Edit, Transform, Skew, and skew the white area up about 45 degrees or so (see Figure 8.208) Figure 8.208 Make a rectangular selection and fill it with white Skew it for that “glass” look Here’s where the transparency comes into effect Adjust the opacity of the layer to 10% This opacity will correlate almost directly to the game engine’s translation of transparency Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark ... when finished (see Figure 8.200) Figure 8.200 Rotate and align the boards with a slight gap Let’s tear up and then apply a 3D effect to the left and right edges of the boards to give it some depth... skew the area for that “glass” look, choose Edit, Transform, Skew, and skew the white area up about 45 degrees or so (see Figure 8.208) Figure 8.208 Make a rectangular selection and fill it with... in a game If you’ve ever blown something away that was near a wall, for instance, and seen blood or slime splatter all over the place, those images were decals overlaid dynamically by the game? ??s