adv banner
Photoshop  Home Photoshop Web Layout Sci-fi Menu
rss

Sci-fi Menu

Author: EmpireDezign More by this author


We'll begin this tutorial, by creating a new canvas at a size of 495 x 121 with 282828 as the background color.

Next, download the Sci-fi Menu Pack" and choose Open. This will install the two custom shapes that I have readied for you to use for this tutorial.

Or, for those of you who are familiar with the "Pen Tool" and it's options you can always pen them out instead.

image 1

Then choose the "Custom Shape Tool" and find the "Menu Frame" shape. Use White as the color and draw the shape as I have done below. Name this layer "Menu Frame" in the Layers palette.

image 2

Now right click on the "Menu Frame" layer and select, "Blending Options...". Now click on "Drop Shadow".

image 3

Do not click "OK" yet. Still more to do.

Now click on "Inner Glow".

image 4

Do not click "OK" yet. Still more to do.

Now click on "Color Overlay".

You may now click OK.

image 5

You should now have the below image.

image 6

Next, find the "Menu Window" shape. Use 009cff as the color and draw the shape as I have done below. Name this layer "Menu Window" in the Layers palette. Now drag the "Menu Window" layer so it is beneath the "Menu Frame" also in the Layers Palette.

image 7

Now right click on the "Menu Window" layer and select, "Blending Options...". Now click on "Inner Shadow".

image 8

Do not click "OK" yet. Still more to do.

Now click on "Inner Glow".

image 9

Do not click "OK" yet. Still more to do.

Now click on "Color Overlay".

image 10

Do not click "OK" yet. Still more to do.

Now click on "Gradient Overlay".

image 11

You may now click OK.

You should now have the below image.

image 12

Select the "Text Tool" and use the below settings. Download the typeface here.

image 13

Now type your preferred menu items.

image 14

Next, grab the "Rectangle Tool" and draw a rectangle using White as the color. Name this layer "Gloss" make certain that it is above the "Menu Window" layer in the Layers Palette. Then turn the Fill down to 10%.

image 15

Now create a new layer and place above all other layers in the Layers Palette and fill with Black. Name this layer "Noise" in the Layers Palette.

image 16

Next go to the main menu and choose "Filter" then "Noise" and lastly "Add Noise" using the below settings.

image 17

You should now have the below image.

image 18

Now change the Blending Mode to Screen to get the following.

image 19

Now "Ctrl" click the "Menu Frame" layer to create a selection. Make certain that you are on the "Noise" layer in the Layers Palette then go to "Select" then "Invert" and lastly "Edit" and finally "Cut". Now turn the Fill down to 18%.

image 20

Then select the "Ellipse Tool" and draw a circle as illustrated using White as the circle color.

image 21

Now right click the circle layer in the layers palette and select, "Blending Options...". Now click on "Inner Glow".

image 22

Do not click "OK" yet. Still more to do.

Now click on "Bevel and Emboss".

image 23

Do not click "OK" yet. Still more to do.

Now click on "Gradient Overlay".

image 24

You may now click OK.

You should now have the below image.

image 25

The Results!!!

After duplicating the circle layer and placing them to the remaining three corners atop the interface this tutorial is done.

Sci-fi Menu Tutorial: Final Result (Click to enlarge)
Click to enlarge

Against a white background

Click to enlarge
Click to enlarge


Author's URL: www.empiredezign.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 "Sci-fi Menu"