Script photoShop pour sauvegarder des fichiers « png » en différentes tailles

Juin 18, 2016 | photoShop | 0 commentaire

Notez que cet article a été écrit il y a plus de 2 ans, mais il n'est pas forcément obsolète.

Les scripts photoShop permettent d’automatiser certaines tâches qui demandent de nombreuses manipulations à l’utilisateur. Pour ce script, il s’agit de sauvegarder un icone en différentes tailles afin de permettre son utilisation dans une extension Chrome.

Sauvegarder pour le web en différentes tailles
Sauvegarder pour le web en différentes tailles

Les images seront carrées, et auront pour taille: 128×128px, 48×48px, 38×38px, 32×32px, 24×24px, 19×19px, 16×16px.

Pour cela, il faut avoir installer l’environnement de développement de photoShop: ExtendScript Toolkit CS6.

L’image devra être carrée et avoir une dimension supérieure ou égale à 512px, pour avoir une bonne résolution. On réalise donc son icone avec une taille correcte, et on la sauvegarde (pour le web) en format « png ».

Le script utilise le javaScript à la mode photoShop. Son extension est .jsx.

ChromeIcons.jsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
try {
 
  // Demande à l'utilisateur de sélectionner l'image dont la dimension est ≥ 512x512 px.
  var xbsImage = File.openDialog( "Select a square PNG file (size ≥ 512x512 px).", "*.png", false );
 
  if ( xbsImage !== null ) {
  
    var doc = open( xbsImage, OpenDocumentType.PNG );
    
    if ( doc == null )
      throw "Something is wrong with the file.  Make sure it's a valid PNG file.";
 
    // Sauvegarde pour l'annulation
var startState = doc.activeHistoryState;
    // Les préférences utilisateur d'unité sont rétablies à la fin du traitement    var initialPrefs = app.preferences.rulerUnits;
    var initialPrefs = app.preferences.rulerUnits;
    // On choisit le pixel comme unité
    app.preferences.rulerUnits = Units.PIXELS;     // use pixels
 
    if( doc.width != doc.height )
        throw "L'image n'est pas carrée";
    else if ( doc.width < 512 )
        throw "L'image est trop petite! Au minimum 512px.";
    
    // Boite de dialogue: répertoire de destination
    var destFolder = Folder.selectDialog( "Choose an output folder" );
 
    if( destFolder == null )
      // Annulation
      throw "";
 
    // Sauvegarde des icones au format PNG.
    var sfw = new ExportOptionsSaveForWeb();
    sfw.format = SaveDocumentType.PNG;
    sfw.PNG8 = false; // Utilisation de PNG-24
    sfw.transparency = true;
    doc.info = null;  // Suppression des metadata
    
    var icons = [
      { "name": "favicon_128", "size":128 },
      { "name": "favicon_48", "size":48 },
      { "name": "favicon_38", "size":38 },
      { "name": "favicon_32", "size":32 },
      { "name": "favicon_24", "size":24 },
      { "name": "favicon_19", "size":19 },
      { "name": "favicon_16", "size":16 },
    ];
 
    var icon;
    for( i = 0; i < icons.length; i++ ) {
    
      icon = icons[i];
      doc.resizeImage( icon.size, icon.size, null, ResampleMethod.BICUBICSHARPER );
 
      var destFileName = icon.name + ".png";
 
      doc.exportDocument( new File(destFolder + "/" + destFileName ), ExportType.SAVEFORWEB, sfw );
      doc.activeHistoryState = startState; // undo resize
    }
 
    alert( "Chrome extension icons created!" );
  }
}
 
catch( exception ) {
   // Alerte et fermeture en cas d'erreur
if ( ( exception != null ) && ( exception != "" ) )
       alert( exception );
}
 
finally {
    if ( doc != null )
        doc.close( SaveOptions.DONOTSAVECHANGES );
  
    app.preferences.rulerUnits = initialPrefs; // Rétablit les préférences
}

Sauvegarder le fichier au format jsx.

Pour lancer le script, charger l’image png dans photoShop. Choisir Fichier ⇒ Scripts  ⇒ Parcourir…. Sélectionner le script, le traitement se lance, et vos icones sont sauvegardés.

Si l’on veut que le script apparaisse tout le temps dans photoShop, copier le fichier jsx dans le répertoire C:\Program Files\Adobe\Adobe Photoshop CS6 (64 Bit)\Presets\Scripts, et on pourra le lancer en sélectionnant  Fichier ⇒ Scripts  ⇒ chromeExtension_png.

Sélection du script dans photoShop
Sélection du script dans photoShop

Sur l’image, le menu montre chromeExtension PNG, le fichier jsx a simplement été renommé chromeExtension PNG.jsx.

Et hop, il n’y a plus à sauvegarder une multitude de fois en différentes tailles pour avoir tous les icones nécessaires.

 

Soumettre un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *