X Course Advisor FREE Course Advisor
(Close)
Watch Tutorials
macProVideo.com
Close

Accès Premium gratuitement

Accédez à notre bibliothèque complète des articles Hub Premium, les fichiers projet et les premiers 10% de chaque Cours-vidéo de la Bibliothèque Didacticiel en ligne .

Créez votre compte gratuit!

Débuter avec des dégradés de couleurs dans Photoshop CS5
Traduit par Google Translate

Les dégradés sont un excellent moyen de créer un intérêt visuel dans vos conceptions. Mais ce que le diable est un gradient de toute façon? La façon dont je suis venu à les décrire, c'est une transition entre deux couleurs ou plus. En d'autres termes, nous allons mélanger au moins deux couleurs ensemble, et dans ce tutoriel, nous allons mettre en place un fond dégradé pour la zone d'en-tête de notre site.

Quelle est la taille et la résolution devrait vous rendre votre fichier Photoshop? Depuis que nous allons créer un dégradé pour notre site, nous pouvons garder la résolution tout faible (72 ppp). En ce qui concerne les dimensions, qui serait déterminé par la disposition de notre site. Supposons pour cet exercice cette zone en-tête de notre site Web est de 960 pixels par 100 pixels.

Mais n'oubliez pas, les gradients peuvent également être utilisées dans l'impression. Dans cette situation, vous devriez juste comprendre comment grande surface d'impression de votre document que vous voulez remplir, et de définir votre taille du document en conséquence. Bien sûr, il faudrait aussi être une résolution beaucoup plus élevée (plus comme 300ppi).

Okay, let's get started on creating our web gradient.

Etape 1

Allez-y et créez un nouveau document vierge dans Photoshop.

En utilisant notre exemple d'un gradient d'en-tête d'un site Web, assurez-vous de régler votre largeur et la hauteur en conséquence (encore une fois, Pixel 960x100). En outre, la résolution à 72 pixels par pouce et le mode de couleurs RVB. Cliquez sur OK lorsque vous êtes prêt.

Etape 2

From the Toolbox, grab the Gradient tool.


The default gradient that's set for the Gradient tool is Foreground To Background. That means that the starting color in the gradient will be the color that's loaded into the foreground color swatch at the bottom of the Toolbox. The ending color would be the color that's loaded into the background color swatch.

Vous pouvez changer votre plan et les couleurs de fond en cliquant sur leur nuancier de couleur dans la boîte à outils, mais nous allons jeter un oeil à la bibliothèque de Photoshop de dégradés prédéfinis.

Étape 3

On the Options bar, click the drop-down arrow beside the gradient swatch.


This opens Photoshop's Gradient Picker. You can either choose from the set of available gradients, or open another gradient library. To open a new gradient library, open the Options menu in the top-right corner of the Gradient Picker, then choose from the list of libraries towards the bottom of the Options menu.

Si vous optez pour l'une des bibliothèques de Photoshop gradient supplémentaires, vous serez demandé si vous voulez remplacer les gradients actuels avec la nouvelle bibliothèque. Cliquez sur OK pour les remplacer, ou Append pour les ajouter dans la bibliothèque actuelle.

Une fois que vous avez choisi un dégradé, vous êtes prêt à l'appliquer à votre fichier.

Etape 4

Pour appliquer le dégradé, cliquez et glissez à l'intérieur de la fenêtre du document.

For example, click and drag from the left side of your document to the right; or from the top to the bottom. You can even drag on an angle if you wish. If you'd like your gradient to be perfectly straight either horizontally or vertically, hold down Shift as you drag.


Sometimes it takes a few tries to get the look you're after. Once you're done, you're ready to save the file out for use on the web.

Etape 5

Choose File > Save As; then name your file and choose JPEG from the Format menu.

Voici ce que nos dégradé final ressemble à ceci:

Dans un prochain tutoriel, nous allons parler en utilisant Enregistrer pour le Web de Photoshop

De là, vous seriez alors charger votre nouveau dégradé dans la tête dans votre mise en page web, peut-être en l'insérant directement dans l'en-tête, ou le définir comme un fond d'écran via CSS. Comme vous pouvez le voir, en travaillant avec des dégradés dans Photoshop est facile et amusant. Dans un autre tutoriel avenir, il serait amusant de jeter un oeil à la façon de créer, d'enregistrer et de travailler avec des gradients sur mesure!

Geoff Blake

Geoff Blake | Articles by this author

Geoff Blake is a book author, video presenter, designer, and visual artist. As an in demand live-on-stage software educator since 1997, Geoff has taught desktop publishing, web design and graphics courses all over North America and is regarded as an expert in Adobe's Creative Suite applications, as well as in HTML, CSS, WordPress, and related technologies. With his humorous, non-jargonny approach, Geoff produces highly regarded articles, video training and DVDs, and regularly contributes to top industry magazines and websites.

Comments

You must be logged in to post a comment.
Create an Account  Login Now

What is macProVideo.com?

macProVideo.com is an online education community featuring Tutorial-Videos & Training for popular Audio & Video Applications including Adobe CS, Logic Studio, Final Cut Studio, and more.
© 2018 macProVideo.com
a division of NonLinear Educating Inc.
Link