Attenzione: l'articolo è stato scritto da oltre 1 anno, le informazioni in esso contenute potrebbero essere datate e non più attuali.

Creiamo un bottone

Vediamo come riuscire con poche operazioni a creare un semplice bottone per rendere le nostre pagine web più gradevoli.

Il tutorial

 

Apriamo una nuova immagine 100 per 50 pixel, con sfondo bianco sporco (RGB=252,252,252) (File/Nuovo o CTRL+N).

Impostare quattro guide, una per ogni lato, a 10px dal bordo: (Cliccare sul righello e trescinare all'interno dell'area di lavoro)
Aiutandosi con le guide, creare una selezione quadrata e arrotondarla (Selezione/ Arrotondata)

N.B. Se non è presente quest'ultima voce devi installare il pacchetto Gimp-perl

Creare un nuovo livello trasparente. Scegliere i colori per primo piano e sfondo (per lo sfondo scegliere un colore più scuro) e applicare un gradiente lineare in senso verticale
  Creare un altro livello. Ridurre la selezione di tre pixel (Selezione/ Ridotta) e applicare di nuovo il gradiente ma in senso inverso.
Infine applicare un'ombra in rilievo (Script-Fu/ Ombre/ Ombre in rilievo)
Creare un altro livello. Con lo strumento testo inserire il nome al bottone.
  La costruzione del bottone è terminata, non ci resta che salvare (in realtà sarebbe stato meglio salvare di tanto in tanto prima). Possiamo salvare il lavoro fatto prima nel formato di Gimp xcf per mantenere inalterate caratteristiche come i livelli, le selezioni e per poter tornare a lavorare sul file con poco sforzo; poi possiamo scegliere il formato migliore per il web. Io vi consiglio di indicizzare l'immagine (Immagine/ Modalità/ Scala di colore) e poi salvare nel formato png.
Ecco il risultato finale.E possibile anche scaricare il file per Gimp cliccando QUI.
Altro esempio
 

I parametri scelti sono i seguenti:
Dimensione immagine: 75 x 50
Selezione/ Arrotondata: 10
Ombra in rilievo: 2,2,4
Testo: Edgewater, corpo 14



Potete scaricare il file XCF, QUI.
Altri esempi "automatici" usando gli script-fu
Gli esempi che seguono sono stati ottenuti usando alcuni script-fu trovati sul web. E' bastato semplicemente inserire qualche parametro :-)
bottone web

Questo è stato ottenuto con lo script aqua-pill. Dopo averlo installato basta andare in: xtns / script-fu / temi pagina web / aqua pill / button.
N.B. Lo script-fu in questione permette anche di creare altri elementi delle pagine web: barre orizzontali (Hrule) e una sfera/logo (Round)

bottone web Questo è stato ottenuto con lo script aqua.scm. Dopo averlo installato basta andare in: xtns / script-fu / titix / button / aqua.
N.B. Il testo è stato inserito in seguito.
bottone Bottone ottenuto con lo script in perl prelevabile da QUI.
bottone Bottone ottenuto con lo script in perl prelevabile da QUI
Altri script-fu   Altri script che possono creare bottoni in automatico li troviamo in : xtns / script-fu / temi pagina web / ... e in:xtns / script-fu / bottoni / ...

Argomenti correlati

Il tuo voto: Nessuno Media: 3.2 (5 voti)