Cette fonctionnalité existe depuis la sortie de la version Photoshop CC. Elle permet d’exporter des calques à des formats différents en les nommant directement dans la palette calques. Cette astuce est bien pratique pour les concepteurs et intégrateurs d’applications mobiles et web, même si les éléments graphiques peuvent être générés en CSS ou en directement en SVG.
Voici l’explication et démo en vidéo (en anglais).
NB il faut l’activer sur chaque PSD dans lequel vous travaillez via le menu Fichier, Générer, Fichiers d’image.
Les paramètres sont les suivants :
- .jpg (valeur par défaut : 9), .jpg(1-10)
- .gif
- .png (valeur par défaut : png32 with semi-transparent alpha), .png8, .png24, .png32
- 1-n%, (longueur) px x (largeur) px pour l’agrandissement
Voilà 4 exemples :
- “200% logo@2x.png, logo.png” produit un logo 2x plus grand et un autre à la taille d’origine
- “banner.jpg10” génère une image avec la qualité maximale en jpeg
- “400% bouton.png, 250×250 bouton.jpg40%” génère un PNG 4x un JPEG 250×250
- *”@2x” c’est une convention pratique pour nommer les images retina
Astuce, pensez à bien enlever les espaces (sauf avec l’attribut % )et les majuscules. On retrouve cette fonction de Photoshop CC 14.1 à CC 2018.
Résultat en live avec SDK
Voilà une autre vidéo de démo avec le rendu en temps réel grâce au kit de développement LOOM connecté à un smartphone et une tablette !
Je suis Fabien Lesbordes, formateur indépendant PAO et graphiste professionnel diplomé et spécialiste certifié ADOBE avec plus de 20 ans d'expérience dans l'image. Je suis aussi photographe et utilisateur Apple. Je retouche et 