adv banner
Photoshop  Home Photoshop Web Layout Tech Preload Interface
rss

Tech Preload Interface

Author: PhotoshopStar More by this author


1. First of all you need to learn how to make the metal interface pieces, I've written a tutorial on how to make them before on TheDesignWorld, view the original here, view my version here.

If those aren't too much good to you, you can download the PSD for my interface in this tutorial here.

2. When you've made your interface, or if you're going to use mine, merge all the layers together (CTRL+E) and press CTRL+T, now you're in transform mode, re-size the selection to about 12% by 10%.

image 1

You'll probably need to sharpen it once, Filter > Sharpen > Sharpen.

image 2

Duplicate the layer and flip it vertically Edit > Transform > Flip Vertical, move the layer downwards and merge them together.

image 3

Duplicate the newly merged layer and flip it horizontally Edit > Transform > Flip Horizontal, move the layer as much to the right as you think you should.

image 4

3. I sharpened the layer slightly and put a basic black Outer Glow on the main interface layer.

image 5

Set your foreground color to #157bca. Now make a rounded rectangle in the middle of the interface like so:

image 6

Apply the following layer styles to the blue shape layer:

image 7

image 8

image 9

image 10

image 11

(Pattern: .pat - .gif)

You should now have something like this:

image 12

4. Select the blue rectangular layer (CTRL+Click the layer thumbnail.)

image 13

Contract the selection by 2 pixels by going to Select > Modify > Contract in the photoshop menu.

image 14

Use either the Gradient Tool or Brush Tool to make some soft white gradients at the top and bottom of the selection (I used the Gradient Tool.)

image 15

Set the Layer Mode to Overlay.

image 16

Add pixel text and dots with the pencil tool. I also added 1px solid Drop Shadow to the text and dots layers.

Tech Preload Interface Tutorial: Final Result

Download the complete PSD here.



Author's URL: www.photoshopstar.com

Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Add comments to "Tech Preload Interface"