iPhone Icons, How to Preview the Glossy Effect.

iPhone-Icon-Preview-in-Home-ScreenWe’ve already discussed a long time ago how to remove the glossy effect from iPhone icons. But what if you just want to look at how different icons will look with the glossy effect on the iPhone, while avoiding to recompile the app for every icon draft you made?

Here is the solution: apply a mask to the icon file in Photoshop (or any other graphic design app).

There are some resources around, but for your convenience, here is what I use in PSD and PNG format.

How do you preview the iPhone icon in context, so that you can see how it will look like when it’s surrounded by lots of icons and with the name below it?
I’ve put together this screen, from an iPhone snapshot I found on the internet and the icon mask I mentioned above. You can download the PSD source here.
You can play with the iPhone home screen layer transparency to have your icon pop-out more.

An interesting resource: the iPhone Icon, Favicon, .ico Generator is a web app from which you can select a series of options to generate your website favicon for the iPhone screen. But this is also a nice way to preview your icons. Be sure to check “Don’t display my icon!” if you want to avoid showing your design drafts to the world ;)