[Photoshop CS] Les calques <Niv.Débutant>

Ce tutoriel Photoshop va vous permettre de bien commencer avec Photoshop sans vous perdre dans les fonctionnalités. Nous allons découvrir quelles sont les principales fonctionnalités puis nous ferons deux petits cas pratiques pour les mettre en application.

Le premier cas pratique sera la réalisation d'une affiche au format A4.

Le second cas pratique sera la réalisation d'une maquette de site internet avec également la conception d'un logo et d'un picto de bouton.

A la fin de ce tutoriel , vous aurez compris le principe de fonctionnement de Photoshop, la palette des calques, les principales fonctions pour faire vos premières créations graphiques de site Internet, d'affiches, de flyers....
</TD>
</TR>
</TABLE>

1. Commencez par créer un nouveau document avec le menu Fichier / Nouveau. La boîte de dialogue vous permet de saisir les informations de votre nouveau document. En fonction de votre création, choisissez 72 dpi et RVB pour une création pour Internet et 300 dpi et CMJN pour une création destinée à l'impression.

2. Comprendre le principe des calques sous Photoshop : Comprendre le principe des calques est fondamental, il vous permettra de travailler efficacement et rapidement. Sur photoshop, il est possible de travailler sur plusieurs supports dans un même document, au moyen de calques. Comme en réalité, il est possible de voir à travers un calque. L’intérêt est de pouvoir superposer plusieurs éléments graphiques (un sur chaque calque) et de travailler indépendamment sur certains d’entre eux. Il est possible de : - Renommer un calque (clic droit renommer) - Déplacer un calque (clic sur le calque et glisse) : permet de faire passer un élément graphique 1 situé sur le calque 1 au dessus d’un autre élément graphique 2 sur le calque 2. - Supprimer un calque (clic + glisse dans la corbeille) L'espace où se trouvent tous les calques s'appelle la palette de calques.

Vous pouvez organiser vos calques en les mettant dans un dossier. Cliquez-glissez ensuite le calque que vous souhaitez dans le dossier nouvellement créé.

L'ordre des calques est très important. Un calque A situé au-dessus d'un calque B dans la palette des calques apparaîtra aussi au-dessus dans la zone de travail. Vous pouvez bien sûr modifier l'ordre des calques avec les clic-glisse sur un nom de calque dans la palette de calques. Vous pouvez également afficher ou masquer indépendamment chaque calque en cliquant sur l'œil situé à gauche du nom du calque. Cela vous permet de ne pas afficher le contenu d'un calque sans le supprimer. Cela est utile pour ne pas afficher le contenu d’un calque spécifique sur la zone de travail. Par exemple, si on veut faire des tests sur plusieurs calques à la fois et que l’on ne veut en garder qu’un visible sur la zone de travail sans supprimer définitivement les autres. Astuce :Si dans votre zone de travail, vous ne voyez pas les modifications que vous faites sur un calque, pensez à vérifier que celui ci ne soit pas caché par un autre calque situé au-dessus dans la palette de calques.

3. Voici les quelques fonctionnalités qui pourront vous servir dès vos premiers essais sur Photoshop Essayez chacune d'elles pour découvrir les fonctionnalités en détail. Pour les outils qui disposent d'une petite flèche vers le bas, maintenez appuyé sur la flèche pour laisser apparaître de nouveaux outils. Exemple : Outil dégradé / Outil pot de peinture

4. Chaque fois qu'un outil est sélectionné , vous disposez d'options complémentaires à l'outil sélectionné sous la barre de menu. N'hésitez pas à modifier ces options pour découvrir les fonctionnalités plus avancées de chaque outil. Exemple pour l’Outil Texte :

<tr><td align=left>5. Cas pratique 1 : faire une affiche ou un flyer. Pour avoir une impression de l’affiche A4, il convient de qualité de travailler sur une résolution de 300dpi, à taille réelle. Créez un nouveau fichier avec ces caractéristiques :

6. Mise en forme Ecrire du texte : Sélectionnez un nouveau calque Sélectionnez l’Outil Texte Définissez votre police de caractère ainsi que la taille, la couleur… Dessinez une zone de texte sur l’espace de travail et tapez votre texte. Tapez sur la touche Entrée du clavier numérique une fois terminé. Ajouter une image : Sélectionnez un calque. Ouvrez l’image que l’on veut ajouter : Fichier / Ouvrir Sélectionnez l’image avec CTRL+A Copiez la sélection avec CTRL+C Revenez sur l’espace de travail de votre affiche Collez l’image CTRL+V Transformer un visuel / du texte : Sélectionnez un calque Edition / Transformation manuelle (raccourci CTRL+T) Utilisez les poignets de rotation, de redimensionnement Clic droit pour afficher d’autres options : perspective, torsion… Une fois les réglages faits, appuyez sur la touche « Entrée »

8. Cliquez sur "ajouter un style de calque"

9. Sélectionnez un type de style de calque (par exemple : biseautage estampage) Une fenêtre de dialogue s’ouvre, ajustez vos réglages ; vous pouvez apercevoir les conséquences de vos réglages en même temps sur l’espace de travail. Cliquez sur Ok une fois les réglages faits.

<tr>

10. Vous remarquerez que le style apparaît sous votre calque dans la palette des calques. Vous pouvez modifier votre style de calque en double-cliquant dessus.

11. Vous pouvez modifier les options de Style, profondeur, taille… pour faire évoluer l’effet sur votre calque.

12. Vous pouvez aussi accéder à d’autres options (supprimer, afficher, masquer..) pour le style de calque en utilisant le clic droit sur le style. Cliquez sur l'œil du style de calque pour ne plus afficher l’effet sans supprimer le style. En regroupant ces quelques conseils, voici un exemple de ce que l’on peut faire facilement.

13. Cas pratique 2 : Faire une maquette de site Internet, un logo et un picto Pour travailler pour le web, une résolution de 72dpi suffit , prenez la dimension que vous voulez en pixels. Pour un site web classique qui doit rentrer dans une résolution 800x600 sans scrollbar horizontale, créer un document de 760 pixel de large.

14. Mise en forme Les outils principaux dont vous aurez besoin sont les Outils Forme : Rectangle, Rectangle arrondi…

15. Réglez les options comme sur le screen suivant (Attention à bien sélectionner "Pixels de remplissage") :

16. Vous pouvez maintenant placer vos éléments sur votre espace de travail. Voici ce que l’on peut faire aisément avec : - une forme rectangle arrondie pour le menu - une forme rectangle pour la bannière publicitaire - une forme rectangle pour le corps du site - une forme personnalisée pour le logo - des zone de texte pour les textes - un style de calque pour les ombres portées des forme Menu et Corps du site

17. Création d'un logo En utilisant les formes, les zones de texte, on peut facilement se créer son logo. Exemple de logo de 120 px de large sur 80 px de haut, en utilisant : - 3 formes personnalisées « puzzle » - 1 transformation / rotation pour l’une des formes « puzzle » - 3 zones de texte

18. Création d'un picto En utilisant les formes, les styles de calques, on peut facilement créer un picto pour agrémenter un site internet. Exemple de logo de 120 px de large sur 80 px de haut, en utilisant : - 1 forme personnalisée en forme de flèche - 1 style de calque pour la flèche « Biseautage estampage - Biseau interne » - 1 forme ronde avec l’Outil Ellipse (appuyez sur SHIFT pour que la forme reste ronde) - 1 style de calque pour la forme ronde « Biseautage estampage - Biseau externe » et un « Contour – Externe de 1px »

19. Quelques astuces Photoshop - Utilisez les touches CTRL / SHIFT / ALT pour découvrir les fonctionnalités complémentaires lors de vos manipulations. Exemple : lors d’une transformation / rotation, SHIFT permet de faire tourner le calque par angle de 45°. - CTRL+clic sur le nom du calque : sélectionne le contenu du calque - CTRL+ALT+Z pour annuler plusieurs opérations à la suite - Pour enregistrer un gif transparent, masquez le calque « Arrière-plan » en cliquant sur l'œil du calque Arrière-plan de la palette des calques. Puis faites Fichier / Enregistrer pour le web… et sélectionnez Gif et cliquez sur Enregistrer. - Essayez et persévérez, vous verrez, c'est le meilleur tutoriel que je peux vous conseiller :)

Merci pour le tuto Ieven. ^^

Je dois encore mettre les images, sa vient.