Introduction

Aujourd'hui, on utilise de plus en plus de Design System pour la conception de nos interfaces. Qui dit Design System, dit aussi des styles de texte et de couleur toujours plus nombreux. Ces styles, une fois mis en place sont pratiques à utiliser et nous font généralement gagner un temps précieux. En revanche, lorsqu'il faut les mettre à jour, cela devient soit très compliqué soit très long et par conséquent fastidieux.

Par ailleurs, à chaque problème sa solution ! Batch Style vous facilite votre tâche en modifiant plusieurs styles de texte et de couleur à la fois. Peu importe la valeur que vous souhaitez modifier, en gras ou en italique, la hauteur de ligne ou l'espacement des caractères, tout est possible. La fonction "Rechercher et remplacer" s'applique à tous les styles sélectionnés. Désormais, il est plus facile que jamais de renommer les styles.

Terminé la modification manuelle de chaque style pour "simplement" passer de la typographie "Roboto" a celle de la "Open Sans" !

Fonctionnalités

STYLES DE TEXTE PAR LOTS

Mettez à jour plusieurs styles de texte et leurs propriétés en une seule fois, par exemple leur famille de polices.

CHANGEMENT DE STYLE DE COULEUR PAR LOTS

Mettez à jour les styles de couleurs en modifiant par exemple uniquement leur teinte de base, leur luminosité, leur saturation ou leurs valeurs hexadécimales.

MODIFIER LES NOMS DE STYLE

La fonction "Rechercher et remplacer" s'applique à tous les styles sélectionnés. Désormais, il est plus facile que jamais de renommer les styles.

FILTRER LES STYLES PAR NOM

Servez-vous de la barre de recherche pour afficher uniquement les styles qui correspondent à ce que vous souhaitez modifier. Si vous utilisez plusieurs graisses, dans ce cas, vous n'avez qu'à cibler tous les styles "Light" et changer le font weight en "Thin" ou "Extra Light". En fonction de la structure de vos styles, vous pourrez les modifier encore plus rapidement.

MODIFIER LES DESCRIPTIONS

Dans mon quotidien, je n'utilise pas souvent la partie description des styles. En revanche, grâce à Batch Styler, il vous est possible de les mettre à jour. Pour cela, il vous faut simplement sélectionner les styles concernés et ajouter ou modifier leur description. Par exemple, sélectionner toutes les déclinaisons de vos titres "Small" et noter leur utilisation dans votre design.

SUPPRESSION EN BLOC DES STYLES

Tout est dans le titre ! Vous avez besoin de supprimer plusieurs styles ? Sélectionnez les styles, cliquez sur Supprimer la sélection. Et voilà ! Un gain de temps considérable, non ?

Comment l’utiliser

CHANGEMENT DE STYLE DE TEXTE PAR LOTS

Sélectionnez tous les styles que vous souhaitez modifier, puis éditez leurs valeurs. Les noms et les graisses des polices sont attribués. Admettons qu'une graisse n'est pas trouvée, le plugin vous dira quelles sont les graisses disponible pour pouvoir re-attribuer les nouvelles graisses.

MODIFIER LES NOMS DE STYLE

Sélectionnez tous les styles que vous souhaitez modifier. Vous pouvez faire CMD + A pour Mac OS ou Ctrl + A pour Windows pour sélectionner tous les styles. Entrez la partie du nom du style que vous souhaitez remplacer dans le champ "Find", et entrez la nouvelle valeur dans le champ "Remplace".

Ainsi, par exemple, si vous voulez changer tous les styles "Heading 1 / Light", "Heading 1 / Regular" et ainsi de suite en "H1 / Light", "H1 / Regular", vous devez entrer "Heading 1" dans le champ "Find" et "H1" dans le champ "Remplace".

MODIFIER LES DESCRIPTIONS DE STYLE

Vous pouvez également modifier (par lots) les descriptions des styles. Pour cela, il suffit de sélectionner autant de styles que vous le souhaitez et de saisir la description souhaitée dans le champ Description. Laissez vide pour supprimer.

SUPPRESSION EN BLOC DES STYLES

Sélectionnez tous les styles, puis cliquez sur le bouton "Supprimer la sélection". C'est fait !

Conclusion

Pour conclure, Batch Styler nous offre de nombreuses fonctionnalités qui répondent à un réel besoin. Celui d'être plus rapide et efficace dans son travail. En permettant le traitement par lot avec les propriétés de base des styles, chaque personne pourra mettre en place une logique en fonction de ses besoins. Un avantage considérable si vous travaillez en équipe !

Batch Styler fait partie d'un groupe de plugin qui sont sollicités lorsque je dois créer l'ensemble des styles de texte de mon Design System. Cet outil m'a véritablement aidé dans mon efficacité et ma productivité. N'hésitez pas à vous abonner, d'autres plugins vous seront prochainement présentés et expliqués en détails !

LIENS PRATIQUES

Plugin Figma
Site du Développeur

Site du Plugin

Certains liens sont des liens d'affiliation, si vous effectuez un achat auprès de ceux-ci, nous pouvons percevoir une commission.