Friday, November 30, 2012

Icon Test Page

Like every iOS developer, we need to test lots of icons.  And while looking at them in a dropbox folder or sending by email works, nothing is as good as seeing them for real on an iPhone or iPad.

My brother (who does all the icons) is in London while I'm in Seattle--so he often is working on them while I'm sleeping.  We figured out a cool way so he can test them easily.

We made a PHP script that looks for icon files in a folder on the server.  It then makes up a web page to see them all on an iPhone default background, styled close to how they really look.

The script detects if it's an iPad to look right there as well.

In the morning, Shawn and I often have a whole page to look at as Pete has narrowed things down and tried variations.  Above is the progression for an icon for BounceBash (update, now in the App Store).

But even better, if you tap one, it sets that icon as the "apple-touch-icon" for the page so if you save the page to your home screen, you get that icon on the springboard.

And it works for any number at all, so you can add lots of test icons.  The "newest" even auto-updates if you tap it on the springboard, then return.

And here is what you need.

Download This.  It has both the index.php and .css files needed to put this on your server and make it work!

Pete did lots of nice HTML5 things for curves and stuff, so you will only need to provide your own background image.  And you'll need to edit the .php file to add a path so it knows where to look for the icon images.

1 comment:

Oscar said...

That's great!!
Just want to write some similar script and now I can just use it!
Thanks for the great work!!

For other users:
There's some tricky point here.
You must upload those icon files one by one, make each file modified time got at least 1 second gap.
If not, those "same modified time" file will be "disappeared".
As the script use filemtime() function for sorting, it can't return in millisecond.