
*** TUTO CREATION BOUTON DEVICE ACTIF ***
création du bouton à l'aide Phoshop CS2 version anglaise
nous allons partir d'un bouton inactif, le Pearl par exemple.

*** PARTIE 1 ***
- il faut dans un premier temps faire une selection de la zone bleu du bouton et ce, par tous les moyens que nous connnaissons ; c'est-à-dire baguette magique, rectangle ou cercle de selection...

*** PARTIE 2 ***
- Après avoir sélectionner la zone bleu du bouton et uniquement la zone bleue, faire un COPY/PASTE soit un copier/coller (menu "EDIT"). Après avoir effectuer ce copier/coller, la zone de selection (zone clignotante) a dû disparaitre, pas de panique c'est normal !!!
nous allons maintenant nous allons appliquer un INNER SHADOW (menu "LAYER" et ensuite "LAYER STYLE">"INNER SHADOW").
- rentrez les valeurs ci-dessous :

après rentrer toutes les valeurs, faire "OK" et obtenir ceci (effet d'eclairage dans le reflet) :

Après avoir admirer le résultat, il faut ensuite absolument aplatir notre image et pour celà aller : menu "LAYER" > "MERGE VISIBLE".
*** PARTIE 3 ***
- Dans la partie 3, nous allons passer notre image en noir et blanc... (le comble pour une Pronto couleur !

- Pour celà aller : menu "IMAGE" > "ADJUSTMENTS" > "DESATURATE"
et voilà le résultat :

*** PARTIE 4 ***
Nous approchons de la fin... enfin non, pas vraiment


- Nous avons donc notre beau bouton en N&B et d'une taille de 70px*70px. Nous devons diminuer la taille de notre bouton...
- Pour modifier la taille de l'image : menu "IMAGE" > "IMAGE SIZE"
- une fenêtre apparait :

- Effectuer les modifications ci-dessous (soit une réduction image de 80%) puis ensuite "OK". Au final nous devons avoir une image de 56px*56px.

*** PARTIE 5 ***
- ProntoEdit NG n'aimant pas les différences de taille entre boutons actifs et passifs, nous devons agrandir la zone de travail pour retrouver la dimension initial de 70px*70px.
- Pour celà : menu "IMAGE" > "IMAGE CANVAS" et entrer les valeurs ci-dessous et faire "OK" :

- Au final, nous devons avoir ce résultat (réduction de 80% du bouton mais zone de travail de 70px*70px) :

*** PARTIE 6 ***
les derniers effets... enfin !!!


Pour information, tous les effets se feront sous une même fenêtre : "LAYER STYLE"
- appliquons tout d'abord un effet de halo blanc autour de notre bouton et pour celà aller : menu "LAYER" > "LAYER STYLE" > "OUTER GLOW" et entrer les valeurs ci-dessous (sans faire "OK" ensuite)

pour obtenir à l'ecran ceci (ne pas faire "OK" après avoir rentrer les valeurs !!!) :

Nous allons ensuite appliquer une transparence de 50% sur la totalité de notre image. Vu que nous n'avons pas quitté la fenêtre "LAYER STYLE", rendons nous (sur la partie gauche de la fenêtre) "BLENDING OPTIONS : CUSTOM" et aplliquons une transparence de 50%.

Dès la valeur correcte entrée, faire "OK" pour obtenir ce résultat :

et bien voilà notre bouton actif est fini, reste plus qu'à l'enregistrer en PNG !!!
si vous avez des questions...

Stef