by xxviii : 23 June 2004

What tutorial oriented web site would be complete without the obligatory shiny orb tutorial? That's right, not a single one! So that is why, young Photoshop grasshopper, you will learn this simple concept that can be applied to pretty much any shape imaginable. Though we're going to focus specifically on the generic circle shape.

Here's what you're going to be creating. Intimidating? Well no, not really. Simple? Definitely.

[ End Product ]

 NOTE - Photoshop Version
This tutorial was created using Photoshop 7. The same steps should be nearly identical in any version of Photoshop.

If you can't figure out how to do a certain step on your version of Photoshop feel free to post your concern in the Drawing and Design forums.

Alright then, open up Photoshop and create a New Document by either pressing Ctrl + N or selecting New.. from the File menu. Set your dimensions to 400 by 400 pixels, keep the color mode to RGB, and select White under contents and click OK. Now click, hold and drag the rectangular marquee tool until the drop out appears and select the elliptical marquee too.

Find the Style drop down box, which should be at the top of your screen if you left the toolbars alone, and select Fixed Size and set the Width and Height to 300 px. Your bar should look like this.

[ Your Style bar should look like this ]

Now create a new layer from your layers panel. Click somewhere inside the canvas to make your circle appear. Try to get the circle somewhat centered, though it isn't all that important. Select a color you want to use for your orb and fill the selection with the fill tool. I chose to use #4380AB for my color. You should now have something along these lines.

[ Base color of our orb ]

Now we come to a series of slightly harder steps, and if you're new to Photoshop they might be a little tricky at first, but just stick with it and you'll be fine. What we want to do first is give the orb a little bit of depth. So go to your tools panel and select the Burn Tool Now you want to select a nice large soft brush. Go to the top of the screen again and select a soft brush of any size. Then push the ] (closed bracket) key until you get a desirable size, something around 200px should suffice. Now where it says Exposure set the value to somewhere around 60 percent.

Now, starting at the lower left edge click and drag to the lower right edge, following the curve of the circle. If that didn't make sense, don't worry, a picture detailing this step is just below. Now select the Dodge Tool from the same area as the Burn Tool from before. Select a similar sized brush with a similar exposure as from the last step and do what you did to the bottom, but now do it to the top. Whew, hopefully you got that all, but if not, here's what you should have done.

[ Burning and Dodging your orb ]

Alright, now the fun part that makes our sad circle actually look like an orb! Go to your gradient tool and do the following. Select the upper left knob and set the Opacity to 100% and the Location to 0%. Now select the upper right knob and set the Opacity to 0% and the Location to 100%. Now click the lower left hand knob and set the Color to #FFFFFF (pure white) and Location to 0%, and set the right knob's Color to #FFFFFF and Location to 100%. Your bar should look like mine does below.

[ Your gradient bar should look like this ]

We're almost done now. Create a new layer on top of your base circle layer. Hopefully you kept the selection around the circle the whole time, but if you didn't just hold CTRL and click on the circle layer to get the selection back. Drag your gradient from the very top of your circle to about half way down, while holding shift to insure it's a straight line, and let go.

Go up to Edit>Transform>Scale and make your selection look something like the below image. You will have to move the selection around a bit to get it to be in the right place.

[ Your transformed selection ]

Now all that's left do is click the check mark at the top of the screen to confirm your transformation, hit CTRL + D to finally get rid of that selection, drop the opacity of the layer down to about 65% and you're done! Though there is obviously more you can do to your orb, such as add a drop shadow or put some text or a logo inside the sphere I'll let you practice that on your own.

Author's Comments
This tutorial is obviously aimed more toward the novice Photoshop user. It's main intention is to get your mind away from the over used filters that new users tend to use and start creating things with just the basic tools. It will help you a lot in the end if you know how to do fundamental techniques such as those mentioned in this tutorial. Hopefully most readers of this tutorial will use this as a learning experience rather than as a quick way to make some shiny graphics to throw on their new website. Either way though, I hope this was helpful and feel free to ask questions on the Drawing and Design forums.

x x v i i i Blue


SUPPORTERS:'s fast and reliable hosting provided by Media Temple.