Star Badges

;

;

;

In this tutorial you will learn how to create a smooth gloss content
box. This effect can be found all over the internet these days, to make
a very stylish glass/plastic effect for your headers, buttons, and
content boxes. After following the steps in this tutorial you will be
able to create great looking content
boxes.图片 1

This is an in-depth tutorial on how to make the basic star badge, then
how to make it look glossy and
professional.图片 2

This is an in-depth tutorial on how to make the basic star badge, then
how to make it look glossy and
professional.图片 3

图片 4 Open an
existing document in photoshop, or open a new one. I will be working
with a 300×415 canvas for this tutorial.Fill the background with white
(#FFFFFF).

Step 1. Create a new document

Step 1. Create a new document

图片 5 Get out
the Rounded Rectangle tool
(图片 6Make sure
the “Fill Pixels” is
selected图片 7Drag
out a rectangle just a little smaller than the canvas size such as l’ve
done here:
图片 8Double click
this layer, and apply the following blending options: Inner
Shadow:图片 9Stroke:图片 10Gradient
Overlay:图片 11图片 12Inner
Shadow:图片 13Result:
图片 14

First, create a new document in Photoshop, for this tutorial I’ll be
using a 400×400 document, but the images I’ll be showing you will
usually be 300×200.After you’ve created a new document, add a background
in. I used a light blue gradient and some white scan
lines.图片 15Step

First, create a new document in Photoshop, for this tutorial I’ll be
using a 400×400 document, but the images I’ll be showing you will
usually be 300×200.After you’ve created a new document, add a background
in. I used a light blue gradient and some white scan
lines.图片 16Step

图片 17 Next we’ll
create a shine/gloss to our content box. Hold down the CTRL key on your
keyboard and click this layer (doing so should make a selection of
everything on this layer) Alternatively you can get out the magic wand
tool (图片 18Keeping
the selection still active, create a new layer.Get out the elliptical
marquee tool
(图片 19Now press
and hold the ALT key on your keyboard, and make a deselection as l’ve
done here:
图片 20Set your
foreground color to white (#FFFFFF). Get out the gradient fill tool
(图片 21图片 22Next
fill this selection with your gradient from top to bottom as l’ve done
here: 图片 23Drop
the opacity of this layer to 40 percent:
图片 24This should
lighten the gloss a little bit, and make it look more realistic.

  1. Making the shape
  1. Making the shape

图片 25 Next we
are going to cover our content area with some basic scan lines. Here is
how we create scan lines.Press CTRL+ N on your keyboard to create a new
document. set the size to 3×3, with a transparent background:
图片 26Next zoom in
as close as you can to this new 3×3 document. You can zoom quickly by
holding the CTRL key and rolling your mouse scroller downwardSet your
foreground color to black (#000000). Get out the pencil tool
(图片 27图片 28Using
the pencil tool, draw three dots onto the canvas exactly as l’ve done
here: 图片 29Go
to “Edit->Define Pattern”, and name this pattern “Scanlines”:
图片 30We are
finished creating our pattern, so you can safely close this 3×3
document.

Now let’s make the shape of the star badge.In the Photoshop Tools Menu,
find and get the Polygonal Tool
(U).图片 31Be
sure at the top of Photoshop in the tool options menu, that you’re using
these
settings:图片 32Click
the drop down arrow that is highlighted in the above image and use these
settings:图片 33Now
create a new layer and change your foreground color to what you would
like the badge to be. I used #4fb2ea.Be sure you’re on the new layer,
then click and drag on the
canvas.图片 34That’s
how to make the basic shape, move onto the next step to make it look
much nicer.

Now let’s make the shape of the star badge.In the Photoshop Tools Menu,
find and get the Polygonal Tool
(U).图片 35Be
sure at the top of Photoshop in the tool options menu, that you’re using
these
settings:图片 36Click
the drop down arrow that is highlighted in the above image and use these
settings:图片 37Now
create a new layer and change your foreground color to what you would
like the badge to be. I used #4fb2ea.Be sure you’re on the new layer,
then click and drag on the
canvas.图片 38That’s
how to make the basic shape, move onto the next step to make it look
much nicer.

admin

网站地图xml地图