Simple Grey Button
This unusual tutorial looks at
the little grey button found on Windows/X
Windows/MacOS desktops and how to create one in
PhotoShop.
A sample button:
A close up of a button looks something like this.
Notice how the edges are more well defined now than
the one shown earlier?
Notice that the actual button is just made up of 4
basic shades of grey . A light shade of grey (or)
black, depending on how you look at it : )on the upper
left corner with a black border for the lower right
corner, giving definition to the button. A darker shade
of grey just above the black gives the button an almost
'rounded' feel to it.
The same button here for reference:
Building it in PhotoShop
- File > New
Width = 200 px, Height = 200 px
Background colour = White .
- Hold down [ CTRL + " ] to get
grid displayed. Turn on Grid Snap, View> Snap To
Grid .*This is optional.
- Select rectangular area approximately of the size
of the button. Create New Layer and fill it with a
neutral grey.
- Double-click the 'hand' tool to zoom in on the
grey circle. We are now working on the pixel level
now. Using the rectangular marquee tool, now is a
simple matter of dragging a 1 pixel length line
according to the enlarged button above. It is much
easier to drag a 1 pixel rectangle now when the view
is in zoom mode. You may want to zoom in closer on
the working area to allow to work more accurately.
The enlarged button for reference again.
The completed but empty 'button'.
- Zoom out, once you are finished. Add words or even
an icon of your choice and you're done. Leave the
text 'as-is' , that is without anti-aliasing to give
it that 'genuine' button look.
Another much faster method of achieving the 3D effect
, is to use Soft Light Blending mode, although
this method does illustrate how achieving 3D effects are
just illusions by way of clever use of colour
combinations.
More creative ways to create 3D effects with
PhotoShop coming soon.
Check out these sites for ideas as well.
www.designsbymark.com
www.andyart.com
[ TOP
]
© Copyrights
reserved 2000
[RV]ForFEAR September 26th 2000
email
|
Web
tips