Come Creare un Bottone




Questo Tutorial è stato creato da Roberto (Cyclope05) ed è pertanto di proprietà
di WebDestiny.Net che ne detiene tutti i diritti,
ogni somiglianza con qualsiasi altro lavoro già presente in rete è puramente casuale.
E' vietato distribuire il materiale allegato e le immagini del tutorial, su Forum, gruppi
e siti personali senza la mia autorizzazione scritta.
Se volete richiederla cliccate qui 

Questo tutorial è stato realizzato con PSP 9 in data 26 Aprile 2007.


Grado di difficoltà:  AVANZATO

Aprite una tela delle dimensioni 200 x 100
con sfondo trasparente e risoluzione a 300 pixel.

Dallo strumento Forme selezionate Rettangolo
ed impostate i seguenti valori.


Impostate come colore di primo piano #0b3cc9
e come colore di secondo piano #80ffff

Selezionate il colore di primo piano e qui create un gradiente con i seguenti valori:


a questo punto chiudete il colore di primo piano e tracciate un rettangolo.

Una volta creato il rettangolo, potrete notare la presenza dei nodi,
intorno al nostro oggetto, bene ora andremo ad agire su di loro
per trasformare il rettangolo ed ottenere così la forma del nostro
Bottone.

Dovreste avere un rettangolo tipo questo


Ora se vi avvicinate con il mouse sull'angolo in basso di sinistra,
noterete che il puntatore del mouse sarà una freccia con sotto un crocino,
quindi ora tenendo premuto il tasto sinistro del mouse sul nodo
dell'angolo in basso di sinistra, spingetelo verso l'alto
finchè non vedrete il vostro rettangolo assumere questa forma



a questo punto il nostro bottone è pronto.

Cliccate ora sul bottone nella barra degli strumenti, sotto lo strumento
Penna con questo simbolo 
quindi avvicinatevi ai nodi del bottone e vedrete che il
puntatore del mouse vi mostrerà questa icona al di sotto della
sua classica freccia.
Premete mentre è visualizzata questa icona il tasto destro
del mouse e sciegliete l'opzione Proprietà.

Vi comparirà questa finestra delle proprietà del vettore,



cliccate nella casella con il colore azzurro per aprire
la finestra dei colori.

Qui spostatevi nella sezione Gradiente e dovresti avere già
pronto il gradiente precedentemente impostato.

Qui dovete selezionare solo l'opzione INVERTI così che il blu
scuro vada esternamente e resti come luce l'azzurro chiaro.

Quindi date OK alla finestra del gradiente, ed
OK alla finestra delle proprietà del vettore.

A questo punto convertiamo il livello Vettore in Raster ed
uniamolo con il livello sotto, così da avere un unico livello.

A questo punto ci serviremo di un filtro molto bello e potente
Alien Skin Eyes Candy 5: Impact
e selezioniamo la voce GLASS.

Qui dentro si possono impostare una marea di proprietà ed ottenere
una infinità di sfumature per bottoni di ogni tipo e genere.

Per il mio tutorial ho scelto l'impostazione di default che viene
presentata come default.

Provate a selezionare anche le altre voci così da rendervi conto
dei bottoni che potrete creare nonchè
se si seleziona la linguetta con la scritta LIGHTING
e si mette il pallino sulla voce
Select From File e si prova
a selezionare le voci del menù sotto, si otterranno
numerosissimi altri effetti per i bottoni.

Sul bottone non scriviamo nulla, quello lo faremo
mediante il linguaggio HTML usando
un qualsiasi programma per creare pagine web.

A questo punto non ci resta che ritagliare l'immagine del nostro bottone
e salvarla ma stavolta non come JPG o GIF
ma useremo il formato PNG.

Questo formato molto leggero, permette di salvare la trasparenza
al di sotto del bottone così che questo si possa adattare bene
a qualsiasi tipo di sfondo che vorrete mettere nella vostra pagina.

Spero che questo tutorial sia stato di vostro gradimento e
che soprattutto vi resti utile nella costruzione
dei vostri siti personali.

PS le misure usate nel tutorial sono eccessivamente grandi
per un pulsante di una pagina web, sono state
date queste misure per permettervi di capire e vedere
gli effetti, ora sta solo alla vostra bravura mettere in
pratica e creare bottoni di tutte le forme e misure.

Buon divertimento.