Le blog d'Eenov, solutions eenovantes !

Créer une texture pour votre site web dans Photoshop

Voici un petit tuto pour vous montrer comment créer très simplement et très rapidement une texture avec Photoshop (j’utilise ici Photoshop CS5).
Je pense vraiment que les petits détails comme les ajouts d’ombres et de textures donnent du relief et de l’éclat à vos sites web ;) Ce petit tuto vous donnera donc un bon point de départ si vous ne savez pas quoi faire pour améliorer vos designs de sites web.  Alors commençons ce tutoriel !

1 – Calque de base

Créez un nouveau document avec les dimensions de votre choix, et créez un nouveau calque. Remplissez ce calque avec la couleur de votre choix (j’utilise ici du orange #f37607).

Créer une texture avec Photoshop

 

2 – Calque de bruit

Créez un nouveau calque et remplissez ce calque avec du blanc (# ffffff).  Ensuite, appliquez un filtre de bruit à ce calque (Filtre> Bruit> Ajout de bruit).

Définissez une quantité de 25%, en répartition uniforme. Plus la quantité est haute, plus il y aura de bruit sur le calque. Évitez donc de monter trop haut afin de garder quelque chose d’assez homogène.

Créer une texture avec Photoshop

 

Vous remarquerez en ajoutant le bruit, que des centaines de pixels multicolores sont apparus. Pour avoir ce  même rendu en nuances de gris, créez un nouveau calque de réglage (Calque>Nouveau calque de réglages>Teinte/Saturation) et réglez la saturation à -100.

Créer une texture avec Photoshop

 

Sélectionnez maintenant vos deux calques (calque de réglage et calque de bruit), faites un clic droit et sélectionnez « Fusionner les calques ».

3 – Rendu final

Maintenant, c’est un peu comme si vous étiez dans une cuisine et que vous testiez des recettes ! Jouez avec l’opacité et le mode de fusion de votre calque de bruit afin de trouver un résultat qui vous convienne !

Créer une texture avec Photoshop

Vous pouvez tester d’autres effets en ajoutant des styles de calque à votre calque de bruit (Incrustation de dégradé par exemple !).

Créer une texture avec Photoshop

4 – Inspirations

Quelques sites utilisant la texture dans leur webdesign :

Texture utilisée dans le webdesign

Texture utilisée dans le webdesign

Texture utilisée dans le webdesign

Texture utilisée dans le webdesign

Posté par : Marion le 02/11/2011
Design, Tutos
Tags : , , , ,

1 commentaire

  • […] Créer une texture pour votre site web dans Photoshop || Solutions … Voici un petit tuto pour vous montrer comment créer très simplement et très rapidement une texture avec Photoshop (j'utilise ici Photoshop CS5). Je pense vraiment que les petits détails comme les ajouts d'ombres et de … Source: blog.eenov.com […]

  • Poster un commentaire

    Vous voulez donner votre avis ?
    Laissez un commentaire !

    Laisser un commentaire

    Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *