Tutorials Books Videos Forums

-- online Change the theme! Search!
Rambo ftw!

Customize Theme


Color

Background


Done
Look, an author!

Shiny Orbs

by Themos   | filed under Flash and ActionScript

Nothing says "This person knows their gradient fills" like shiny orbs.
You've created them in Photoshop now create nice shiny (vector based) glass orbs in Flash!

[here is (roughly) what you'll end up with]

[here is (roughly) what you'll end up with]

Enough Chit Chat show me how.

  1. The most important stage! Choose a nice bright primary colour or use grey for plain glass. Then set your fill colour to your desired shade. Set your line colour to a slightly darker version of your fill colour.

[The colours I used]

[ The colours I used ]

  1. Create a new Movie Clip symbol (Insert > New Symbol). Name it something relevant ("Orb","Shiny" etc) and click OK.
     
    Select the Oval tool and create a circle (hold down Shift) approximately 200 pixels wide.
     
  2. Now select the filled area of the circle and bring up the Colour Mixer window.
    On the Colour Mixer window click on the paint bucket to make sure the fill is selected.
     
  3. Now in the drop down menu select 'Linear Fill'. Your circle will have a gradient fill fading from black on the left to white on the right! Change the fill so that it starts with a dark shade of your colour and ends with a light shade.

[use the colour mixer to perfect your fill]

[ use the colour mixer to perfect your fill ]

  1. Now select the "Fill Transform Tool" and click on your lovely gradient fill.
    Use the rotate fill handle to rotate the gradient fill until the dark shade is at the top and the light shade is at the bottom.

[rotate the fill until it looks something like this]

[ rotate the fill until it looks something like this ]

  1. Select the first filled circle and copy it (Ctrl+C), create a new layer and "Paste it in Place" onto the new layer (Ctrl+Shift+V).
     
  2. Select the filled circle you have just made and go back over to our old friend the Colour Mixer window.

    This time select Radial Fill in the drop down box.
    Set up the fill so that the outside of your circle is a dark shade of your colour with an Alpha value of 70%.
     
    Then set the inner colour's Alpha value to 0%.

[set up your second gradient fill]

[ set up your second gradient fill ]

This should create the shadow around the edge of your Orb.

[hopefully you'll have something like this!]

[ hopefully you'll have something like this! ]
 

  1. Make another copy of the circle by selecting the second filled circle and copying it (Ctrl+C). Then create a new layer and "Paste it in Place" onto the new layer (Ctrl+Shift+V).

  2. Select this new fill, go to the Colour Mixer window and select radial fill from the drop down menu. Set up the fill so that it blends from white with 100% Alpha value in the centre to white at 0% Alpha at the edges.

[the final gradient fill part I!]

[ the final gradient fill part I! ]

  1. Select the "Fill Transform Tool" and move the fill vertically upwards so that it's centre touches the top of the circle.

[the final gradient fill part II!]

[ the final gradient fill part II! ]

  1. Select this fill and use the Transform window to shrink the fill horizontally by about 6%. Now use the cursor keys to move the fill down a few pixels.
    And hey presto a shiny orb to impress your friends and family with!

[the end result!]

[ the end result! ]

Extra Stuff.
I added text to the layer below the final fill but pictures, animations and roll over effects would look awesome.

I hope you find this tutorial useful. If you have any queries or get stuck try the forums here at Kirupa.com for help.

Themos
www.tjdanvers.co.uk

 

Just a final word before we wrap up. What you've seen here is freshly baked content without added preservatives, artificial intelligence, ads, and algorithm-driven doodads. A huge thank you to all of you who buy kirupa's books, became a paid subscriber, watch the videos, and/or interact on the forums.

Your support keeps this site going! 😇

-Themos

The KIRUPA Newsletter

Thought provoking content that lives at the intersection of design 🎨, development 🤖, and business 💰 - delivered weekly to over a bazillion subscribers!

SUBSCRIBE NOW

Creating engaging and entertaining content for designers and developers since 1998.

Follow:

Popular

Loose Ends

:: Copyright KIRUPA 2026 //--