High-Res Artwork Management Automation

Fri, 22. Oct 2010

Categories: en development Tags: ImageMagick iPhone iPhone4 make Makefile Retina Display

The iPhone4 comes with a super high-res display and to leverage that encourages App Developers to provide all artwork twofold โ€“ once „normal“ and once in double resolution named equally with a „@2x“ suffix.

To ease my designers’ life and avoid confusion (and designers are easily confused I found) I ask them to provide the high-res artwork only and I scale it down myself. And as this is a reoccuring task, I automated via a Makefile like this:

#!/usr/bin/make
# Make help: http://www.gnu.org/software/make/manual/html_node/Phony-Targets.html#Phony-Targets

# Requires ImageMagick, Installation per macport: $ sudo port install imagemagick +no_x11
CONVERT :=  convert

# Where are the images?
ASSETS_DIR := .

# Which ones? All @2x.png plus twins without @2x.png
ASSETS_HIGH :=  $(wildcard $(ASSETS_DIR)/*@2x.png)
ASSETS_LOW  :=  $(patsubst %@2x.png,%.png,$(ASSETS_HIGH))

# The scaling command
%.png: %@2x.png
  convert $< -resize 50% $@

assets: $(ASSETS_LOW)

clean:
  -rm $(ASSETS_LOW)

See also myย link collection about high-res images and my general Xcode project setup.