Archives for posts with tag: graphic design

I needed to generate graphics of some screenshots on the various devices it’s available on today, and had to hunt for the quickest way to do it.

Google made an awesome tool for Android, the Device Art Generator. No Photoshop needed.

Finding a tool to do this for iOS wasn’t so straightforward, but I eventually stumbled upon iPhone Screenshot Maker (which also does iPad and Mac screenshots). Again no Photoshop.

Finally, the ones for Chrome OS required some Photoshop work after I found a Google+ post with the PSD for the Chromebook Pixel.

$ logout


Icons that are different sizes cause problems when you’re working on an app, but don’t want to spend multiple hours individually adjusting padding around each image. So I created a script that uses ImageMagick to size a batch of images to the same dimensions. To prevent clipping, I note the maximum width and height of each image in the batch before running the script, and supply this as my desired-size:


# Name some args

# Gotta have some parameters to continue
# First parameter should be image dimensions, i.e. contain 'x' in the middle.
if [ -z "$FINALSIZE" ] || [[ $FINALSIZE != *x* ]]; then
	if [[ $FINALSIZE != *x* ]]; then
		echo "desired-size not given!"
	echo "usage: desired-size file [file2 ...]"
	echo "         desired-size: Desired image dimensions, e.g. 164x120"
	exit 1

# Make sure we've got the magic butter
hash convert 2>/dev/null || { echo >&2 "MISSING convert COMMAND! INSTALL ImageMagick TO CONTINUE."; echo; exit 1; }

for INFILE in ${@:2}; do
	FILENAME=$(basename $INFILE)

	# Do the stuff
	# If your grays are fine, use this. Otherwise comment out, and use command below.
	convert $INFILE -background transparent -gravity center -extent $FINALSIZE $FILENAME

	# Sometimes this script messes up grays in your PNGs. If so, uncomment this:
	#convert $INFILE -define png:big-depth=16 -define png:color-type=6 -background transparent -gravity center -extent $FINALSIZE $FILENAME

Also on GitHub.

You could probably also modify this to find the correct dimensions based on the images you provide.

This script is meant for PNGs, but can easily be modified for any other image type, like a JPEG, by giving something other than transparent for the -background argument.

Known issues: I occasionally noticed that gray-colored icons got darker after running this script. After searching around, the commented-out convert line solved my problem. Utilizing it increases the file size slightly, but without a finer knowledge of PNGs, this was a quick and easy solution.

$ logout