Her

Home Photoshop Tutorials Drawing Techniques LCD Orbs

LCD Orbs

Author: Robouk Author's URL: www.spoono.com More by this author

How I make my LCD orbs for my interfaces and Skins. Smoooth

1. The time has come, the first tutorial for PS 7.0. Because of the similarities between PS 6.0 and 7.0 this tutorial can be completed in either.
I'm going to explain How *I* create the LCD orbs I often use on ifaces/skins. Again, this is the way I like to do it.

Make a new image 500x500px and white background. Now, create a New Layer image 1.
Next select the Elliptical marquee image 2.

Now Hold SHIFT and ALT on the keyboard and draw your circle, roughly the same size as mine. Now fill the selection in with your chosen color.

image 3

2. Now without deselecting, create a new layer: image 1

Press X, then D on the keyboard to reset the colors. Now go to Edit > Stroke for the settings choose 4 and colour black. Click OK. Now, with that layer selected, go to Filter > Blur > Gaussian Blur and enter a setting of 4. Click OK. Next hold CTRL and click on "Layer 1" to load the selection. Now click on "Layer 2" and go to Select > Inverse hit Delete (make sure Layer 2 is selected). Lower the Opacity of that layer to 28%. It should look something like what I have opposite.

image 5

3. HOLD CTRL and click on "Layer 1" to load the circle selection, now press X, then D. Again create a new layer on top of the other 2. Go to Edit > Stroke and enter a setting of 1. Now lower the opacity of this layer to 32%. Create a new layer on top of all the others, Hold CTRL and click on "Layer 1" just to load the selection, now use the Paintbrush tool:image 6 and in the option select the airbrush icon: image 7. Set the layer blending mode of this layer to Color Dodge and lower the "Fill" (located under the Opacity) to 21%. Now using Soft Brushes: size 200px and 100px paint a bright area around the bottom half of the Circle as shown in my picture opposite. Looking smooth eh? yum.

image 8

4. Now, here's how I like to create the highlight to my orbs. Create a new layer, using the pen tool: image 9 to draw a rough section in the top half of your circle as show opposite. To get mine curve, I simply used the "Add anchor point" pen tool and slightly bent my path. Yours will not be look like the image on the left if you are using PS 7.0. I have done this so you can see it clearly.) Now with the pen tool still selected, right click in the path and choose "Make Selection." You can now delete or hide the layer with the path on it.

image 10

5. Now for the tricky part. Create a new layer (don't loose your selection) now hold SHIFT + CTRL + ALT altogether and click on "Layer 1" (the original circle layer. You will end up with a selection like mine opposite (hopefully). Now use the gradient tool, and choose "Foreground to Transparent" now press D, then X to reset the colours. Now, make a gradient in your selection starting from the top dragging to the bottom of the selection. You will end up with a nice highlight, press CTRL+D to deselect. Now go to Filter > Blur > Gaussian Blur and enter about 2.0. Also, you might want to move this layer down a few pixels just to make it more realistic.

image 11

6. it should look something like mine opposite. You're done! However, you can go further! I like to sometimes add scanlines inside mine, this just enhances it, you may also want to make it inset into an interface and you are done.

image 12

7. Here's what I came up with, See what you can do. Hope you enjoyed it, I have decided to make the PSD available for this tutorial so if yours didn't work out, you may learn something from the PSD. Download by clicking here. =)

LCD Orbs