Magick!

I’ve always like ImageMagick, and frequently it is the first thing I install when I set up a new computer. For OS/X, I have found that MacPorts make the installation pretty painless, although it takes a while to compile all the dependencies.

Like most ImageMagick users, I have rarely scratched the surface of what this toolkit can do – I mostly use it for simple format conversions and image re-scaling. However, I recently had a image processing problem that went beyond the ordinary – I wanted a general purpose tool that would take any input image, scale it to 200 pixels wide, and create nice rounded corners, with transparency where the pixels used to be.

Basically, to go from this:

To this:

Since I plan on doing this a lot, I don’t want to fire up a graphics program every time and point-and-click my way to nirvana. Enter ImageMagick, my old friend!

#!/bin/bash

# Usage:
# ./roundclip.sh [inputfile]

# Output width
OUTPUTWIDTH=200
# Corner size
CSIZE=20

IMG=$1
EXT=${IMG##*.}
BASE=`basename $IMG .$EXT`
OUTFILE=PNG8:${BASE}_round.png
TMPFILE1=/tmp/${BASE}-1-$$.png
TMPFILE2=/tmp/${BASE}-2-$$.png
MASK=/tmp/mask-$$.png
TRANSPARENT=/tmp/transparent-$$.png

# Scale the input down to our desired width
convert $IMG -scale ${OUTPUTWIDTH}x $TMPFILE1

# Find out the height and width of the working file
DIM=`identify -format %wx%h $TMPFILE1`
W=`identify -format %w $TMPFILE1`
H=`identify -format %h $TMPFILE1`

# Calculate the lower corner coordinates
X=$(($W - 1))
Y=$(($H - 1))

# Make a clipping mask with rounded corners
convert -size $DIM xc:black \
    -fill white \
    -draw "RoundRectangle 0,0 $X,$Y, $CSIZE,$CSIZE" \
    $MASK

# Make a transparent underlay
convert -size $DIM xc:transparent $TRANSPARENT

# Place the masked input image onto the transparent underlay
composite -compose src-over $TMPFILE1 $TRANSPARENT $MASK $TMPFILE2

# Convert to the output format, and do some color reduction
convert $TMPFILE2 -quality 90% $OUTFILE

# Clean up the temporary files
/bin/rm $TMPFILE1 $TMPFILE2 $MASK $TRANSPARENT

There are probably much more efficient ways to do this, with fewer intermediate steps, but I am not a guru yet.

Using other drawing and blurring techniques, it’s also possible to create drop-shadows on the fly too…