View Full Version : How to create iChat flag buttons
charlie35slr
March 16th, 2007, 08:16 AM
I like the glass flag buttons in iChat:
http://idisk.mac.com/charlie.whitfield/Public/UK.gifhttp://idisk.mac.com/charlie.whitfield/Public/USA.gif
I use them as my iChat icon when I travel. I'm heading to a country that Apple didn't make a button for and I was wondering if somebody could describe the process for making a new flag button.
graficalicus
March 16th, 2007, 09:28 AM
use custom shape to draw a circle - import the flag graphic, place it on a layer above the circle, and resize it to fit within the circle area. Add a bevel to the circle. Group it with the circle (<Ctrl>/<Cmd>+<G>)
Create a new layer up top - use the circular marquee to draw a smaller circle (the reflection) and fill it with white. Use one of the layer mask actions available to mask a gradient (to make it fade toward the bottom).
OR
Draw the white circle as above. Beneath this layer, create a new layer and draw a black-to-transparent gradient where you want the fade to be. Group the white circle with this gradient layer.
http://i48.photobucket.com/albums/f219/graficalicus/reflection.jpg
Ther's a video where I created a reflection on a Valentine - it's here (http://www.graficalicus.com/modules.php?op=modload&name=Downloads&file=index&req=viewdownloaddetails&lid=35) (you gotta log in, but it's free) - and a PSD example is here (http://graficalicus.com/index.php?name=PNphpBB2&file=viewtopic&p=2381#2381)with both examples - a mask and a group
Cmcburnett
March 16th, 2007, 02:12 PM
Thanks Grafi.
charlie35slr
March 17th, 2007, 08:20 AM
Cracked it!
Apple original:
http://idisk.mac.com/charlie.whitfield/Public/UK.gif
My efforts:
http://idisk.mac.com/charlie.whitfield/Public/Wales.gifhttp://idisk.mac.com/charlie.whitfield/Public/Morocco.gifhttp://idisk.mac.com/charlie.whitfield/Public/NornIron.gif
I've created a generic template, see link below. Here's how use it:
1. open your flag (or whatever) image, select all and copy.
2. open the generic template, select the flag layer, paste your flag into it, position and/or resize.
3. load the selection called "circle" and invert it.
4. delete the contents of the inverted selection, you should only have what's inside the circle left.
5. invert the selection and crop the image.
6. select save for web, size 48x48 pixels (click apply), save as a transparent GIF.
Here's the file: Generic_flag_button_template.psd (http://idisk.mac.com/charlie.whitfield/Public/Generic_flag_button_template.psd)
Enjoy! Oh, and thanks for the tips G!
vBulletin® v3.8.4, Copyright ©2000-2009, Jelsoft Enterprises Ltd.