Creare bottoni in stile iPhone con Fireworks

bottoni-stile-iPhone-con-fireworks

bottoni-stile-iPhone-con-fireworks

In questo mini tutorial parleremo di come creare dei bottoni in stile iPhone con Adobe Fireworks.

Apriamo Adobe Fireworks e apriamo un nuovo documento con le sguenti caratteristiche:

550px x 398px come dimensioni

colore di background:#333333

dpi:100

Prendiamo lo strumento rettangolo e al centro selezioniamo un rettangolo con la larghezza pari a quella del nostro documento.

Applichiamo il seguente gradient:

gradient-background-fireworks

Questo sara’ il risultato fino qui:

risultato-con-gradient-in-fireworks

Adesso prendiamo lo strumento rettangolo arrotondato e disegnamo il rettangolo nella striscia che abbiamo appena creato.

Applichiamo al rettangolo un gradient:

gradient-fireworks

Una volta applicato il gradient, usiamo gli strumenti di Photoshop e applichiamo gli stili come nella figura seguente:

effetti-photoshop-in-fireworks

A questo punto dovremmo avere una cosa del genere nel nostro documento.

risultato-bottone-iphone-in-fireworks

All’interno del bottone dobbiamo andare a scrivere il titolo dello stesso. Prendiamo lo strumento testo, come font usiamo il Franklin Gothic Medium e scriviamo.

Applichiamo al testo un effetto Photoshop di bevel and emboss, come segue:

effetto-photoshop-su-testo-in-fireworks

Ecco il risultato.

tasto-iphone-in-fireworks

Una volta creato il primo bottone possiamo usare come scorciatoia la copia del livello per costruire tutti i bottoni che vogliamo.

bottoni-ipad-con-fireworks

Grazie all’uso di Fireworks abbiamo creato dei bottoni stile iPhone molto belli ed eleganti in un tempo abbastanza breve.

Scritto da Magoo

Magoo

Web Developer & Mobile Developer, Game Lover insomma un Nerd.
Co-founder Iwebdesigner.it, Nerdzhouse SRL.
Prendo a schiaffi la tastiera fino a quando non succede qualcosa di buono.

COMMENTA

Loading Disqus Comments ...
Loading Facebook Comments ...

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *