From bemoko developer wiki

Essential tool for command line conversion of images.

Preparing Images for mobile

If you want to batch convert a collection of images for different mobile devices you can base it on the following approach which sets up a function called images-mobilise which you can use to create images within a bemokoLive site ready for mobile.

images-mobilise () {
  imageDir=${1:-"images"}
  sourceUi="pc"
  destinationUis="128:120 240:230"
  imageExts="jpg gif"
  inDir=ui/pc/$imageDir
  for ext in $imageExts ; do
    if [ -f $inDir/*.$ext ] ; then
      for uiConfig in $destinationUis ; do
        ui=${uiConfig%:*}
        width=${uiConfig#*:}
        outDir=ui/$ui/$imageDir
        mkdir -p $outDir     
        mogrify -quality 75 -resize $width -path $outDir $inDir/*.$ext
        ls -l ui/$ui/$imageDir/*.$ext
      done
    else 
      echo "No images of extension $ext found in $inDir/$imageDir"
    fi
  done
}

This function is called by passing in the directory with in the pc ui folder which contains the images, e.g. images-mobilise images/photos and loops through the various extensions (as specified in the $imageExts variable) and the UIs (as specified in the $destinationUis variable) converting all matching images from the specified pc ui image folder into widths supported by the given UIs as well as reducing the quality of the image slightly to reduce the image file size.

Preparing Images for this Wiki

Some images, e.g. screen shots, look a little better with a drop shadow. This is is easy to apply with ImageMagick.

convert my.png \( +clone -background black -shadow 60x5+10+10 \) +swap -background white -layers merge +repage my-shadow.png

To simplify this conversion, we set up the function image-shadow as below ...

image-shadow () {
  out=${1%.*}-shadow.${1#*.}
  in=$1
  echo "Converted file : $out"
  if [ ! -z $2 ] ; then 
    convert $in -frame $2 $out
    in=$out
  fi
  convert $in \( +clone -background black -shadow 60x5+10+10 \) +swap -background white -layers merge +repage $out
}

and then create a shadow for your image with:

image-shadow myimage.png

and create a shadow with frame with

image-shadow myimage.png 6x6