Retour à l' AccueilRetour aux Tutoriaux Web Design liste 2
 

Bouton de Verre # 2

  Passez votre curseur sur le texte en vert pour une infobulle en image 

Créez un nouveau document 200 x 100 px. Fond Blanc.

Créez un nouveau calque nommé [Bouton].
Mettez # 2C535D en couleur d'avant-plan.

Prenez l' outil Rectangle arrondi [U] Pixels de remplissage.
Rayon : 20 px - Lissage : Coché.
Tracez votre bouton, 170 x 40 px par exemple.

Tapez [Ctrl+clic] sur la vignette du calque [Bouton] pour récupérer sa sélection.

Allez dans Sélection > Modifier > Contracter.
Contractez de 2 px.

Créez un nouveau calque [Reflet haut].
Tapez [D] puis [X] pour mettre Blanc par défaut.

Prenez l' outil Dégradé [G] Linéaire et Premier plan - Transparent.
Inverser : Non coché - Simuler : Coché - Transparence : Coché.

Appliquez votre dégradé du haut vers le bas de la sélection en vous arrêtant au 2/3 de la sélection.
Tapez [Ctrl+D] pour déselectionner.

Prenez l' outil Rectangle de sélection [M] Nouvelle sélection.
Tracez un rectangle qui croise le milieu de votre bouton comme ci-dessous.

Tapez [Retour arrière] pour supprimer puis [Ctrl+D] pour déselectionner.

Cliquez droit sur [Reflet haut] puis > Dupliquer le calque.
Nommez-le [Reflet bas].

Allez dans Edition > Transformation > Symétrie axe vertical.
Prenez l' outil Déplacement [V] et déplacez le nouveau calque en bas de votre bouton.
Note : Utilisez la touche flèche Bas de votre clavier...

Masquez [Reflet haut] en cliquant sur l' oeil.
Reprenez l' outil Rectangle de sélection [M] et supprimez quelques pixels en haut du calque.

Cliquez à l' endroit de l' oeil pour rendre [Reflet haut] de nouveau visible.

Réduisez l' Opacité de [Reflet haut] à 70% et celle de [Reflet bas] à 30%.

Créez un nouveau calque [Motif].
Tapez [D] puis [X] pour mettre Blanc par défaut.

Prenez l' outil Forme personnalisée [U] Pixels de remplissage.
Choisissez la forme qui vous convient.

Tracez votre forme en maintenant [Maj] pour conserver les proportions.
Déplacez-la à l' endroit voulu.
Dupliquez la forme, faîtes une Symétrie axe horizontal et déplacez celle-ci.

Réduisez l' Opacité des 2 calques [Motif] à 50%.

Il ne vous reste plus qu' à placer votre texte...

~ Graphisme Delphine © 2006 ~