SpecKing, un plugin pour créer des spécifications dans Photoshop

SpecKing, un plugin pour créer des spécifications dans Photoshop

J’ai pu tester ce weekend SpecKing, un plugin Photoshop qui vous permet de créer des calques de “spécifications”. Il se compose de 3 panneaux qui permettent de récupérer les largeurs et hauteurs d’éléments, les distances (padding et margin) ainsi que toutes les informations typographiques d’un calques texte.

SpecKing

Vous pouvez lire le teste du plugin en anglais dans l’article “SpecKing, a plugin to measure and create design specs in Photoshop“. Pour les allergiques à l’anglais,
une présentation du plugin en Français est disponible sur Webdesignertrends.

Mon avis sur le plugin

Pour le moment il n’est pas possible de mesurer la distance entre deux éléments dont on sélectionne le calque, pour avoir par exemple la marge entre un titre et le texte en dessous. La mesure se fait toujours par rapport à un “parent” qui est donc souvent une sélection. J’en ai discuté rapidement avec l’équipe qui fait le plugin, cette fonctionnalité serait plus compliquée à mettre en place mais est à l’étude. Il est possible de tricher comme ci-dessous, mais ça peut devenir très vite fastidieux.

Specking element distance

Je pense que SpecKing est très pratique si vous produisez des .PSDs “pixel perfect” et voulez alléger le travail de vos intégrateurs pour certains éléments. Hélas, au risque de me faire jeter des cailloux et je n’ai pas honte de l’avouer : mes maquettes Photoshop ne sont pas toujours réalisées au pixel près. Pour moi la maquette n’est pas un produit final, mais est une étape de validation pour que le client ai un aperçu du site final. Mais ça reste un “outil”, le véritable “livrable” est le site terminé. Je ne dis pas que mes maquettes ne sont pas équilibrées, mais il peut y avoir parfois quelques marges qui ne sont pas tout à fait égales après plusieurs heures de retouches (ou simplement un déplacement de calque sélectionné malheureux), des paddings qui ont un pixel en trop à droite, etc. Ce n’est pour moi pas un problème, puisque ça sera corrigé dans le navigateur en CSS, et que l’utilisateur final ne verra jamais mes maquettes Photoshop “non pixel perfect” mais bien le produit final.

Avec le Responsive Web Design, nous avons tendance à privilégier les pourcentages  ou les ems au détriment des pixels. Vous allez donc me demander : à quoi sert un plugin qui va me donner des valeurs en pixel alors que j’ai besoin de pourcentages en CSS ? Je vous répondrais qu’il faut bien commencer quelque part, non ? A moins d’avoir un excellent œil, l’intégrateur a besoin d’une valeur de départ qu’il pourra convertir en pourcentage ou em. Ce plugin peut donc lui rendre la tâche plus “facile” en lui offrant un point de départ en px et la possibilité d’extraire les informations de typographie sans avoir à ouvrir le .PSD pour vérifier toutes les valeurs.

Le gros “point noir” que je peux voir est cependant une tendance au retour du pixel perfect de la part du client qui tomberait sur ce plugin, et s’en servirait pour lui même mesurer chaque valeur et espacement pour “vérifier” l’intégration. Vous me direz, certains le font déjà sans ce plugin. Mais c’est là encore une fois à nous d’éduquer nos clients sur les différents rendus navigateurs et la fluidité du web.

 

 

Besoin d'un designer ? D'un design de site ou d'application mobile ? De cartes de visites ou d'un logo ? Envie de travailler ensemble ? N'hésitez pas à consulter mes réalisations et à me contacter directement.

2 réflexions au sujet de « SpecKing, un plugin pour créer des spécifications dans Photoshop »

  1. Merci pour ton complément d’avis et la mention ! En effet la sélection obligatoire pour mesurer la distance entre deux éléments est un peu longue, l’avantage est de surtout pouvoir mesurer la taille d’un bloc.

    Autre chose, pire que de se servir du plugin, les clients qui impriment le design PSD sur papier calque pour le plaquer sur l’écran ça existe ! C’est du vécu ! Bien heureusement c’est rare et tant mieux pour notre karma… :)

  2. Tu as bien raison quand tu dis que cela donne des mauvaises habitudes au client.
    J’utilisais le plugin PNG Express, j’ai vite arrêter de posé des mesures sur mes livrables, tellement cela devenait chronophage (ratio de 1.5 sur une app iOS).