Conversion d’images par batch

Pourquoi utiliser ImageMagick

ImageMagick est une bibliothéque qui permet d’effectuer du traitement d’image. Sous licence Apache 2.0, elle est disponible sur plusieurs langages (C/C++, PHP, …) via des interfaces adaptées.
Elle est aussi facilement manipulable via un script Bash, ce qui permet de faire du traitement par lot d’images.

Celle-ci est disponible au téléchargement sur le site officiel : http://www.imagemagick.org/script/index.php

Exemple d’utilisation : réduction d’image, rendu similaire à GIMP et Photoshop

Le but est d’obtenir un résultat similaire à GIMP ou Photoshop via ImageMagick dans la conversion d’images pour le web ou le mobile.

Pour obtenir ce résultat nous allons procéder à une suite de traitements :
– Réduction via un filtre Lanczos
– Profondeur 24 bits
– Niveau de compression à 95%
– Filtre permettant d’adoucir l’image
– Conversion au format PNG

Exemple de code :

#! /bin/bash
# script directory
scriptDirectory=$(dirname $0)
# get file list
originalFileList=`ls -1 $scriptDirectory/original/`
for originalFile in $originalFileList ; do
    extension="${originalFile##*.}"
    if test $extension == png || test $extension == gif || test $extension == jpeg || test $extension == jpg  ; then
        echo "Processing file : $originalFile"
        resizeImage 128 $originalFile
    fi
done
# resize image
function resizeImage(){
    # test if directory original exists
    if [ -d $scriptDirectory/$1/ ] ; then
        echo "Format $1 directory exists : $scriptDirectory/$1"
    else
        echo "Creating format $1 director : $scriptDirectory/$1"
        mkdir $scriptDirectory/$1
    fi
    # convert the file
    convert $scriptDirectory/original/$2 -distort Resize $1x$1 -filter Lanczos -depth 24 -quality 95 -unsharp 0.5x0.5+0.5+0.008 $scriptDirectory/$1/${2%%.*}_$1.png
}

Gestion des image sur iOS

Quel format d’image?

Apple recommande le format PNG sur 24 bits (8 bits pour le rouge, 8 bits pour le vert, 8 bits pour le bleu, 8 bits pour la transparence).

Les principales différences avec le format JPG, très répandu, sont :
– une qualité sans perte
– la gestion de la transparence
– un affichage plus propre pour les rendus typographiques
– une meilleure gestion par iOS

Pourquoi la gestion des images?

La gestion des sur iOS peut-être quelque chose de très complexe du fait de la diversification des résolution introduite par l’arrivée de l’iPad puis du Retina Display (qui double l’affichage) comme nouvelle technologie d’écran.
Sur des application complexes, on peut facilement multiplier les lignes de codes ou le nombre d’images. Ceci peut donc être très couteux en temps de développement à proprement dit puis en maintenance.

Comment rationnaliser?

Un système de notation par suffixe permet de vous simplifier la vie. En effet, nul besoin de tester le type d’appareil ou le type d’affichage, laissons iOS gérer cela comme un grand.

Lorsque l’on crée une image via UIImage, l’OS peut détecter à la fois :
– l’extension si png, j’ai rencontré quelques problèmes avec le format jpg qui de plus n’est pas recommander par Apple.
– le type de résolution en fonction de l’écran et du périphérique

Nous allons prendre le cas d’une image de 100px x 100px sur iPhone pour faire face aux 4 cas d’affichage d’une image :

Type d’affichageiPhoneiPhone avec Retina DisplayiPadiPad avec Retina Display
Exemple de résolution d’une image
(largeur x hauteur)
100px x 100px200px x 200px150px x 150px300px x 300px
Modèle de nom de fichier à utilisermon_image.pngmon_image@2x.pngmon_image~ipad.pngmon_image@2x~ipad.png

Exemple de code :

UIImage *image = [UIImage imageNamed:@"mon_image"];
UIImageView *vueImage = [[UIImageView alloc] initWithImage:image];

Simplifier la conversion, le travail des batchs

Si vous voulez gagner du temps pour traiter vos images, il existe de multiples outils permettant la conversion par lot d’images.
Le plus connu, Adobe Photoshop, mais l’outil étant payant on peut lui préférer GIMP ou ImageMagick.