Figma est un outil de design UX/UI qui est devenu très populaire ces dernières années grâce à sa flexibilité, sa collaboration en temps réel et sa facilité d'utilisation. Cette plateforme évolue constamment pour répondre aux besoins des designers et des utilisateurs. Dans cet article, nous parcourons les 32 nouvelles fonctionnalités qui ont été ajoutées à Figma en mars 2023, de la prévisualisation des modes de mélange à la création de plusieurs animations de prototypage. Que vous soyez un designer débutant ou expérimenté, chacun de ces tips vous sera surement utile pour vos prochains projets. 

1. Prévisualisation des mélanges de calques sur le canevas

Obtenez une prévisualisation en temps réel des modes de mélange et des calques en survolant votre souris. Cette fonctionnalité permet aux designers de visualiser rapidement les différents modes de mélange des calques, les options de fusion et les effets de transparence, directement sur le canevas de Figma, sans avoir besoin de les tester un à un. Une fonctionnalité qui va donc aider les designers à gagner du temps dans les retouches de leurs images.

2. Le masque de luminance est désormais pris en charge

Le masque de luminance est une technique de masquage qui permet de révéler ou de cacher certaines parties d'une image ou d'un calque en fonction de la luminosité de l'image. Cette fonctionnalité est particulièrement utile pour les designers qui travaillent sur des images complexes ou des illustrations.

3. Multi-sélection lors d'une recherche avec possibilité de remplacer / modifier

Cette fonctionnalité permet aux designers de sélectionner et de modifier plusieurs éléments en même temps, depuis la barre de recherche, ce qui peut être très utile pour les tâches de mise à jour ou de modification de contenu.

• Accéder à la barre de recherche : Cmd + F
• Selection multiple : Shift + Click

4. Réduction de la hauteur des boîtes de texte par rapport à la ligne de base

Cette fonctionnalité peut aider les designers à créer des mises en page plus équilibrées en réduisant la hauteur des boîtes de texte et en les alignant plus facilement avec d'autres éléments de la page.

5. Les listes de chiffres ne commencent plus obligatoirement par "1"

Il est maintenant possible de personnaliser les listes numérotées et d'ajouter des préfixes personnalisés, ce qui peut être utile pour les designers qui travaillent avec des listes de tâches, des catalogues de produits ou des listes de prix.

6. Placement de la ponctuation à l'extérieur de la zone de texte

Lorsque vous écrivez du texte dans Figma, vous pouvez maintenant placer la ponctuation, tels que les guillemets et les parenthèses, à l'extérieur de la zone de texte. Cette fonctionnalité vous permet de contrôler l'espacement entre le texte et la ponctuation et peut aider à améliorer la lisibilité de vos designs.

7. Recherche de fichiers dans les nouveaux onglets de l'app Figma

Lorsque vous ouvrez un nouvel onglet dans Figma sur votre bureau, vous pouvez désormais facilement rechercher un fichier spécifique en utilisant la barre de recherche. Cette fonctionnalité améliore la navigation et la productivité en permettant d'accéder rapidement aux fichiers que vous souhaitez.

8. Aperçu des fichiers au survole des onglets

Vous pouvez désormais prévisualiser vos fichiers dans les onglets de votre bureau en survolant les icônes des fichiers. Cette fonctionnalité améliore la navigation et la productivité en permettant de trouver plus rapidement les fichiers dont vous avez besoin.

9. Nouvelles animations du trackpad dans l'application FigJam

L'application Figma prend désormais en charge les nouvelles haptiques du trackpad. Ces vibrations vous aident à ressentir les interactions que vous faites avec votre souris ou votre trackpad lorsque vous utilisez l'application.

10. Mise en forme des commentaires

Vous pouvez désormais mettre en gras, en italique et ajouter des liens à vos commentaires dans Figma. Cette fonctionnalité vous permet de mieux organiser et de mettre en valeur les informations importantes que vous partagez avec votre équipe.

11. Notifications consolidées pour les commentaires

Lorsque vous travaillez sur des fichiers avec d'autres personnes dans Figma, vous pouvez maintenant recevoir des notifications de commentaires consolidées par e-mail. Cette fonctionnalité vous permet de rester informé des commentaires pertinents sans être submergé par des notifications inutiles.

12. Déplacer des projets vers d'autres équipes

Faites un clic droit sur un de vos projets Figma, pour le déplacer rapidement vers une autre équipe Figma. Cette fonctionnalité vous permet de mieux réorganiser et transférer vos fichiers en fonction de leur évolution.

13. Fonctionnalités des propriétés de composants activées par défaut

Certaines fonctionnalités des propriétés de composants, telles que les instances imbriquées exposées, sont désormais activées par défaut pour tout le monde dans Figma. Cette amélioration permet de faciliter la création de designs et de gagner du temps en évitant d'avoir à configurer manuellement chaque fonctionnalité.

14. Propriétés de composants privilégiées activées par défaut

D'autres propriétés de composants, telles que les instances privilégiées, sont également désormais activées par défaut pour tout le monde. Cela permet de décider quel seront les propriétés par défaut des instances utilisées sur le projet, plutôt que d'avoir à les re-paramétrer chaque fois.

15. Redimensionnement d'images amélioré

Lors du redimensionnement d'une image, celle-ci s'adapte au moment où le rapport d'aspect est parfait. Vous pouvez également maintenir la touche Ctrl enfoncée pour désactiver temporairement tout accrochage. Vous pourrez ainsi retrouver facilement les dimensions de l'image d'origine.

16. Remplacement sélectif de remplissage

Vous pouvez à présent sélectionner un calque de remplissage spécifique pour le coller et le remplacer par des images ou des vidéos sans écraser tous les remplissages. Vous préservez ainsi tous les autres calques et effets ajoutés à cette image.

17. Réalignement d'images simplifié

Vous pouvez maintenant réaligner les images avec les options d'alignement du designer. Cette fonctionnalité est disponible même en mode édition. Cela facilite le positionnement des images au sein d'un Frame.

18. Alignement simplifié des instances

Alignez facilement les calques sans instance par rapport aux instances imbriquées.

19. Suppression rapide des règles et des guides

Cliquez avec le bouton droit de la souris sur les règles pour les supprimer rapidement, ainsi que tous les guides verticaux.

20. Mise à jour des bibliothèques

Vous pouvez désormais appliquer les mises à jour de la bibliothèque à une seule instance ou à un seul style. Vous pouvez prévisualisez les mises à jour de la bibliothèque.

21. Importation SVG améliorée

L'importation de SVG a été améliorée, y compris la prise en charge des chemins de clip et la correction du problème des segments de chemin supplémentaires.

22. API Fetch pour les plugins

Utilisez l'API Fetch pour votre plugin afin de simplifier les requêtes réseau.

23. Création facile d'images pour les plugins :

Utilisez l'API createImageAsync pour votre plugin afin de créer facilement des images.

24. Widget Photobooth amélioré

Le widget Photobooth affiche maintenant une image miroir.

25. Option de remplissage en transparence sur FigJam

Il y a maintenant une option de remplissage en transparence pour les formes FigJam.

26. Couleur par défaut des formes FigJam

Vous pouvez définir la couleur par défaut des formes FigJam depuis la barre d'outils.

27. Effets d'animation pour différencier les stickies et les formes FigJam

Nous avons ajouté quelques effets d'animation pour différencier les stickies FigJam des formes.

28. Animation sticky en haut des éléments lors du défilement

Les éléments peuvent maintenant se coller en haut lors d'un défilement vertical dans le prototypage.

29. Prévisualisation dans des archives de Frame

Les images archivées sont maintenant sélectionnables dans les paramètres de prototypage.

30. Amélioration de l'affichage des effets de flou

Les effets de flou d'arrière-plan sur les cadres superposés (overlay) s'affichent désormais correctement dans les prototypes.

31. Liens de prototypage dans le même onglet

Les liens de prototypage (c'est-à-dire depuis d'autres pages) peuvent désormais s'ouvrir dans le même onglet.

32. Création de plusieurs interactions de prototypage en une seule fois

Plus besoin de créer des interactions une à une pour les prototypes, il est désormais possible de créer plusieurs interactions en une seule fois.

‍