Posted on April 7, 2008 - by Khaled
Photoshop Metal Interface Tutorial
Another old Adobe Photoshop tutorial from Kyscorp old archives. I’ll be reposting most of those. This is not a text effect tutorial but it is a simple Photoshop tutorial for beginners that will show you how to use the dodge and burn tools in Photoshop to create a metal-like interface. Quite easy to learn with good results at the end. It is an old tutorial that was created for Adobe Photoshop 7 but you can of course use Photoshop CS, CS2 or CS3. More old tutorials will be posted soon…
In this quick Adobe Photoshop tutorial I will try to show you how
to use Dodge tool (and also burn tool) to
- create new file i chose 175X150
- make a new layer
- with the rectangular marquee tool make a selection and fill it with a dark
shade of gray; I chose #333333
- grab your dodge tool and set the options as it follows: brush: 65, range:
highlights and exposure: 50%
- drag your dodge tool onthe middle of the rectangle to lighten it as if it is
exposed to light also lighten the top and
bottom sides, your shape is no longer plane
- grab your burn tool and set its options to: brush:65 range: highlights and
exposure: 50%
- drag your tool through the dark zones in order to darken them more
- with the magic wand select the white background (working on the layer that
contains your shape)
- hit ctrl + shift + alt + I to reverse selection
- go to: Select >> Modify >> Smooth… and set the sample radius as 10 px
- hit ctrl + shift + alt + I to reverse selection
- hit the delete button to clear it
- this could have been done since the beginning with the first selection but the
point here is to have the final shape
after using the dodge and burn tool to make it look more realistic, also now we
have to learn how to anti-alias the
edges of our shape.
- hit ctrl button and then click on the layer containing your shape (selection)
- go to the channels palette (Window >> Channels) and click on “save selection
as channel” on the bottom of the
channels palette
- go to Filter >> Blur >> Gaussian Blur. Set the radius to 5 pixels or so.
- hit ctrl+shift+L to apply auto levels
- use the dodge tool with the same settings and with a smaller brush (17 px for
instance) to lighten the edges and
the mid section
- now fill your background with black color
- add some more stuff to it in order to obtain what you want 
- Or use as an element of a larger template or interface…
13 Comments
We'd love to hear yours!
Leave a Comment
Here's your chance to speak.
Visit My Website
January 16, 2009
Permalink
[...] overlay or you can rasterize the type layer and work on it with burn/dodge tool. You can check out this tutorial to see how to use Dodge/Burn tools. You should be able to end up with a final aspect that looks like [...]
Visit My Website
May 7, 2011
Permalink
I never knew Adobe could be so much fun. Thanks for sharing the steps, following them and trying out such amazing things is easy for a new bee like me. Thanks again!
Visit My Website
June 2, 2011
Permalink
bvlgari sunglasses its tradition of providing luxurious and elegant accessories
with their eyewear collection. Bvlgari Sunglasses are embellished with semi-precious rhinestones, Swarovski crystals and small diamantes for that dash of
glamour and sophistication.
bvlgari eyewear are the favorite of the rich and famous
due to its timeless designs and intricate detailings.
Bvsunlgari glasses are like nothing you have ever seen before. When you look at the
authentic Bvlgari sunglasses offered to you here, at Sunglassesitaly.com, you will
be amazed by the luxury that is delicately presented in each pair. They are like
nothing you have seen before. If you want to be original in your choice of eyewear
and want to be alone in your exclusivity of elegant design, then
Bvlgari sunglasses is the right decision for you.
Visit My Website
June 3, 2011
Permalink
I had no idea that it was that simple to use Adobe Photoshop to create such a nice modern design. I just tried it on my computer and it works like a charm. Thanks for such a tutorial. You explained the process in a few words and very easy to understand.
Visit My Website
June 3, 2011
Permalink
For some time now I have been suffering from frequent lockups of my computer when trying to run Photoshop CS3 and or Bridge CS3. I have traced the problem to my antivirus program. If I disable the Resident Shield component of this software, I am able to run Photoshop. However the software (and Windows) nags me that I should no be doing this. I am worried about using my computer without antivirus protection.
Visit My Website
June 7, 2011
Permalink
I have Photoshop CS5 extended. The Content Aware option with the spot removal tool stopped working. Also, under Edit->Fill->contents->, content aware is greyed out. It acts as if I somehow inadvertantly turned off the content aware feature, but I can't imagine how.I have Windows Vista.
Visit My Website
June 16, 2011
Permalink
I work for a printing company and had some problems with Photoshop. Your tutorial here managed to help me exactly with the problem I was having. Thanks. I see that you have an entire website that offers Photoshop advice. Great job sir. Lots of people are probably very happy about this website.
Visit My Website
June 22, 2011
Permalink
Your tutorial is the best I have seen on the web. Not too technical unlike my other sources. Very understandable. Amazing job! I think I might be ready to take my photoshop editing experience to a higher level! Very nice job!
Visit My Website
June 29, 2011
Permalink
I got to admit working for a web marketing agency,Adobe Photoshop isn't my favorite piece of work,but this tutorial makes it easier.Could you make a beginner-level web design tutorial, to show how to construct a portfolio web layout that has a fixed background with Photoshop?
Visit My Website
July 22, 2011
Permalink
Adobe Photoshop tutorial are very important to learn differnt things. such type of tutorials are required to get familiar with different softwares. Thanks for providing this informative and cool stuff.
Visit My Website
September 9, 2011
Permalink
Longchamp
Visit My Website
January 9, 2012
Permalink
Good and best information post. Thanks for sharing this post.
Visit My Website
January 12, 2012
Permalink
Good and nice information post. Thanks for sharing this post.