Android menu icons with GIMP

This entry is about creating Android menu icons with GIMP, from command line.

Here’s official icon style guidelines. The guide specifies shadows and bevels in terms of Photoshop layer effects:

For my application I’d like to have black-and-transparent source graphics (in a folder called “art” or “assets”), and a build script that would “build” the icons for various resolutions:

I probably spent way too much time trying different things involving Inkscape, ImageMagick, Photoshop and GIMP. Eventually settled with a self-made GIMP plugin, here it is.

I’m aware of Android Asset Studio, which is written in Javascript and uses Canvas for image manipulation. It runs in a browser. Automating it might be possible but I didn’t get into that.

I also came across SVG template with a monster filter:

Initially this filter gave me results that looked way off, perhaps because of Inkscape version differences. Fiddled with knobs, got half-decent results, but passed on this one too, because automation again wouldn’t be trivial. At least for me, now.

Next, what about Photoshop itself? Photoshop is out: costs lots of $$$, doesn’t run natively on Linux, cannot be controlled from command line (although there are some mentions on interwebs that it can be controlled from languages/environments like VBScript).

Then I found GIMP “Layer Effects” plugin which seems to closely mimic layer effects in Photoshop. With this plugin I can follow the same steps I’d be doing in Photoshop and get quite similar results. Just need some automation now.

There’s this tutorial on writing GIMP plugins in Python (google webcache if the link is down). With these on hand and with fair amount of guess-coding I came up with The Script. In order to use it you need to put it in GIMP’s plugin folder, which might be ~/.gimp-2.6/plug-ins. Also, put Layer Effects plugin there.

This is how you run it from command line:

gimp -i --batch-interpreter=python-fu-eval -b 'pdb.python_fu_androidicon_batch(None, None, "/path/to/pictures/*.svg", "/path/to/res");pdb.gimp_quit(1)'

It takes two arguments: location/glob of source pictures and location of the res folder.

Here I’m visually comparing the results, Photoshop is left, my script in middle, Android Asset Studio right:

Advertisements

2 thoughts on “Android menu icons with GIMP

Comments are closed.