Astuces pour avoir une photo de profil avec un contour blanc dans Figma

Avez-vous toujours souhaité avoir une image de profil où votre silhouette est entourée d'un contour blanc? Cet article pourra potentiellement vous aider à faire cela avec Figma! 🤗

4 minutes de lecture
Astuces pour avoir une photo de profil avec un contour blanc dans Figma

Récemment, je souhaitais changer ma photo de profil sur LinkedIn afin de la rafraîchir et d'être cohérent avec l'image de marque de mon entreprise, Merisia. Dans le but de me distinguer des autres utilisateurs (du moins, certains!), je souhaitais enlever l'arrière-plan et avoir un contour blanc autour de moi. Par contre, je ne savais pas comment m'y prendre. 😓

Après avoir fouillé sur le Web, j'ai trouvé le moyen en utilisant un de mes outils préférés : Figma! 😁

N'ayant pas l'expertise nécessaire pour vous expliquer en détails comment je me suis pris, j'ai décidé de vous partager quelques astuces qui m'ont aidé. Avec un peu de chance, vous devriez être en mesure de vous en inspirer pour créer, vous aussi, votre photo de profil de rêve. 😎

Astuces

Astuce #1 - Choisir une photo appropriée

Que vous ayez déjà une photo ou que vous envisagez d'en prendre un, je vous conseille de lire préalablement l'article « 10 Tips for Taking a Professional LinkedIn Profile Photo » écrit par LinkedIn. Cet article liste 10 conseils afin d'avoir une photo professionnelle.

10 Tips to Take Professional LinkedIn Profile Pictures
Take the best professional LinkedIn profile picture using these 10 simple tips. Adding a picture makes your profile 14X more likely to be viewed by others.

De plus, dans le but de vous aider à supprimer l'arrière-plan de votre photo, je vous conseille de prendre votre photo devant un mur d'une couleur uniforme. Vous pouvez toujours prendre une photo avec un arrière-plan non-uniforme, mais il se peut que vous obtiendrez des résultats n'étatant à la hauteur de vos attentes. 🤔

Astuce #2 - Supprimer l'arrière-plan

De nos jours, il existe plusieurs outils gratuits en ligne pour retirer l'arrière-plan d'une image. Un de mes outils préférés est remove.bg, qui ne nécessite que de téléverser une image pour qu'une intelligence artificielle fasse tout le travail à notre place. 🙃

Remove Background from Image for Free – remove.bg
Remove image backgrounds automatically in 5 seconds with just one click. Don’t spend hours manually picking pixels. Upload your photo now & see the magic.

Pour télécharger le résultat en haute qualité (recommandé), vous aurez besoin de vous créer un compte gratuitement.

Astuce #3 - Découper l'image dans Figma

Après avoir importé l'image dans un fichier Figma (FilePlace image), nous sommes rendus à la découper! Comme l'arrière-plan a déjà été supprimé, le plugin Image Tracer pourra être rapidement appliqué sur l'image. 🤗

Capture d'écran du plugin Image Tracer sur Figma.

Le plugin créera un nouveau tracé, qui sera disponible dans la liste des couches.

Astuce #4 - Ajouter un contour blanc dans Figma

Après avoir sélectionné le tracé, il suffit de lui ajouter un trait extérieur (stroke) de la grosseur désirée. Dans mon cas, comme mon image était de grande taille, j'ai choisi un trait de 100 pixels. 😬

Options de Figma pour ajouter un trait de base.

De plus, afin d'avoir un trait plus rond et d'éviter certains problèmes de traçage, je vous recommande également de sélectionner un joint « rond » dans les paramètres avancés.

Paramètres avancés pour les traits dans Figma.

Astuce #5 - Recadrer l'image dans Figma

Étant donné que les médias sociaux préfèrent généralement les images carrées, je vous conseille de recadrer directement votre image dans Figma. Cela vous permettra de vous assurer que votre image soit à votre goût, peu importe le réseau social. 😉

De mon côté, j'ai utilisé la fonctionnalité des frames pour faire cela. De plus, il est possible de cocher la case « Clip content » du frame pour masquer tout le contenu extérieur. 💡

Options disponibles sur le frame dans Figma.

Astuce #6 - Ajouter une couleur d'arrière-plan

Si vous avez utilisé un frame à l'étape précédente, vous pourrez facilement ajouter une couleur d'arrière-plan à votre image. Cela complétera la création de votre nouvelle photo de profil. 🤗

Options pour ajouter une couleur d'arrière-plan dans Figma.

Astuce #7 - Exporter l'image

Maintenant que votre nouvelle image est prête, il ne reste plus qu'à l'exporter dans le format souhaité! 😎

Options pour exporter le résultat dans le format d'image désiré.

Conclusion

Bien que cet article ne soit pas un guide exhaustif, j'espère qu'il vous aura au moins aidé à créer votre nouvelle photo de profil! Si vous éprouvez des difficultés, n'hésitez pas à confier cette tâche à votre graphiste préféré! 😉

Êtes-vous dû pour rafraîchir votre image de profil? 😆