10,00

Tuto Atelier WEB DESIGN : Apprendre à poser du texte sur une image avec Figma

10,00

  • Une formation vidéo de 1h02m
  • Téléchargement immédiat et visionnage illimité à vie
  • Satisfait ou remboursé
  • Fichiers sources inclus
  • Découvrez pourquoi vous former avec Tuto.com
Atelier WEB DESIGN : Apprendre à poser du texte sur une image

ajouter ce cours aux favoris retirer ce cours des favoris

Dans ce tuto Figma en vidéo, nous allons voir ensemble comment placer du texte sur une image/photo de différentes façons.
Cela peut être dans le cas d'un blog pour faire défiler vos derniers articles dans un slider, une landing page qui présente un produit ou un service, ou tout simplement le premier visuel que l'on va voir en arrivant sur votre site web. 

Important : La formation peut être suivie avec un autre logiciel que Figma comme Adobe XD par exemple, car le principal intérêt de cet atelier est d'apprendre les techniques & astuces permettant de placer du texte sur une image en Web Design.

Au programme de cet Atelier WEB DESIGN : Apprendre à placer du texte sur une image

Voici les notions couvertes dans cette formation en ligne :

  • Foncer ou éclaircir le fond d'une image pour faire ressortir le texte,
  • Mettre un dégradé sur le fond et garder sur la droite les couleurs originales de l'image,
  • Ajouter une légère ombre portée sur le texte pour le faire décoller du fond,
  • Mettre en avant un mot grâce à la couleur dominante de l'image,
  • Flouter le fond pour donner plus de place au texte,
  • Coloriser le fond grâce aux options de fusion,
  • Mettre en place différents cartouches (blanc, noir, en opacité, flou) sous le texte et ainsi garder les couleurs de la photo originale,
  • Décaler une image et faire chevaucher le texte par dessus pour donner plus de force et de profondeur à votre design,
  • Intégrer le texte à une image détourée pour ne faire plus qu'un.
  • et d'autre astuces encore...

Le fichier Figma contenant tous les exemples créés au cours de la formation est inclus avec le tuto.

N'hésitez pas à me soumettre des questions dans le salon d'entraide si vous rencontrer des difficultés pendant ou après le visionnage de la vidéo.
Bon tuto !

Table des matières de cette formation Figma (durée : 1h02m)

    • Introduction gratuit 00:02:36
    • Créer un contraste en éclaircissant ou en fonçant le fond 00:09:34
    • Mettre un dégradé sur le fond pour faire ressortir le texte 00:07:31
    • Flouter & colorer le fond + mettre en avant un mot avec une couleur 00:08:04
    • Ajouter du texte dans un cartouche blanc, noir, en opacité ou avec du flou 00:10:32
    • Décaler l'image et faire chevaucher le texte par dessus 00:10:30
    • Intégrer le texte à une image détourée pour ne faire plus qu'un 00:13:04
    • Conclusion 00:01:08



Formateur : Adrien Gazaix

Adrien Gazaix a publié 139 tutoriels et obtenu une note moyenne de 4,8/5 sur 52 249 tutoriels vendus. Adrien Gazaix est un formateur certifié tuto.com. Voir les autres formations de Adrien Gazaix

5,0
note moyenne

2
avis laissés
5 étoiles
2
4 étoiles
0
3 étoiles
0
2 étoiles
0
1 étoile
0
  • 5
    avis de izigrafik laissé le 19/09/2021
    Bonjour Adrien ;) Une nouvelle fois une formation intéressante et de qualité ! Je m'inspire beaucoup de tes conseils et cela me permet d'avancer dans ma reconversion professionnelle de Webdesigner ! Il me tarde de te retrouver au travers de nouvelles formations ! Eric
    "A très bientôt pour de nouveaux tuto 😉"

  • 5
    avis de sylpat laissé le 03/09/2021
    Super petite formation pour celles et ceux qui debutent.
    "Merci pour ton retour, oui en effet cet atelier a été pensé pour les débutants en Web Design :) A très vite pour d'autres ateliers sur tuto.com !"

  • Avec quelle version de logiciel ce tuto est-il compatible ?
    Figma
  • Quel est le niveau requis pour suivre ce tuto ?
    débutant
  • Que contient le fichier source ?
    Le fichier Figma avec tous les exemples créés au cours de la formation.
accédez à plus de 1357 tuto gratuits


non, je ne veux pas me former gratuitement

voir notre politique de protection des données