Glitter Menu Photoshop Tutorial

Flash Game Design
A Photoshop tutorial to create a glitter
menu bar
Photoshop Tutorials Flash Tutorials Flash Games
Step 1.
First of all we're going to create the menu bar. so start off by making a new Photoshop
document with dimensions of 260x190, or bigger if you'd like to create a larger menu bar. Use
the rectangular marquee tool create narrow selection (a). Set the foreground color to #17f0ff
and the background to 0fa4c4. Choose the gradient tool and set it to linear gradient (b)
a) b)
Step 2.
Zoom in to 300% and drag from the top of the selection to the bottom (a). Now make another
selection, around the same length and width of the first one (b)
Flash Website

a) b)
Step 3.
Zoom in again and create another gradient (a), this time using #0385bf for the foreground and
#01e8fc for the background. Next create a rounded rectangle on top of the gradient bar, using
10 pixels for the radius (b)
a) b)
Step 4.
Create a slection using the rounded rectangle (select > load selection), and then delete the
rounded rectangle. Use the selection to a cut a new shape out of the gradient. You can do this
by choosing the gradient bar in the layers panel, right click on the selected area on the stage
and choose "layer via cut". Then delete the layer containing the surrounding area, leaving (b)
a) b)
Next go to Glitter Menu - Part 2) Part: 1 | 2 | 3

Flash Game Design
4
0
Photoshop Tutorials Flash Tutorials Flash Games
Like
2
Step 5.
This is the 2nd part of this Photoshop tutorial to create a Glitter Menu Bar, where we'll be
creating the glitter. First of all zoom in to 600% and choose the Polygonal Lasso Tool (a, i).
Create a trianglular selection, as outlined in red (a, ii). The selection should look something like
image (b). Create a new layer and fill the selection with white, and duplicate the layer (c)
a) b) c)
Step 6.
Flip the duplicate triangle vertically (Edit > Transform > Flip Vertical) and merge the two
triangles together (a) . Duplicate the the layer further (b)
a) b)

Step 7.
Rotate the duplicate 90 degrees (edit > transform > rotate 90 clockwise), and merge the two
layers together. Create a new layer and use the Rectangular Marquee tool to create a thing line.
Step 8.
Rotate the thin line by 45 degrees using the free transform tool (edit > free transform). Create a
duplicate of the now diagonal line and flip it horizontally (edit > transform flip horizontal). Place
the two lines as shown below (b)
a) b)

Step 9.
Merge the diagonal lines with the 4 triangles to create a single layer, and make a selection using
it (Select > Load Selection). Expand (Select > Modify > Expand) the selection by 1 pixel (a).
Feather (Select > Modify > Feather) the selection by 4 pixels (b)
a) b)
Step 10.
Fill the selection with white, which should create a glow around the star, and merge the two
together. Name the layer "Large". Create a duplicate layer called "medium" and resize the star
to 75% using the free transform tool (edit > transform > free transform).
a) b)
Step 11.
Create a duplicate of the "medium" layer called "small" and resize that by 75%. The stars need

Create a duplicate of the "medium" layer called "small" and resize that by 75%. The stars need
to remain in their current positions, but moving them side by side you can see their sizes (b)
a) b)
Next go to Glitter Menu - Part 3) Part: 1 | 2 | 3
Create Flash Applications
Make brilliant desktop apps using
Flash and mProjector - PC & OS
X.
www.screentime.com/pro-flash-tools

Flash Game Design
3
Step 12.
0
Photoshop Tutorials Flash Tutorials Flash Games
Like
This is the 3rd part of this Photoshop tutorial to create a Glitter Menu Bar. So now that we've
created the frames needed to animate one glitter star, we're going to animate it. Once this has
been done, you'll be able to use the technique to duplicate the stars group/folder, and animate
them aswell,
So open the PSD file in Adobe Image Ready, and make sure you have the Layers and Animation
panels open. Make the small and medium star layers invisible for the first frame.
Step 13.
Create a 2nd frame in the animation panel, by click on the icon circled in red. Make the Large
star layer invisible and the Medium one visible.

Step 14.
Create another frame, this time only making the Small star visible.
Step 15.
No now we have 3 frame to animate the star, we need to slow it down to 0.1 second per frame.
Select each frame and choose 0.1. You can see the star being animated by clicking on the play
buttin (circled in red)

Step 16.
Go to File > Save Optimized As, and save.
And That brings us to the end of this Photoshop tutorial to create a
Glitter Menu. Now you know how to animate the stars, you can
create duplicate it and make various sized ones! :) Download PSD
Cox® Internet Bundles
Order online for free installation!
Get Internet to the power of X now.
coxvalue.com/high-speed-internet
Navigation
Flash Tutorials
Photoshop Tutorials
Flash Games
War Games
Photoshop Categories
Web Layout Tutorials
Photo Effects Tutorials
Text Effect Tutorials
Drawing Tutorials
Animation Tutorials
Effects Tutorials
Menu Photoshop Tutorials
Part: 1 | 2 | 3
Top Photoshop
Chain Text Effect
Modern Web Layout
Rust Text
Horse Background
Water Effects
Game Websites
Hidden Object Games
Tower Defense Games
Hunting Games