Vai al contenuto





Archived

Questa discussione è archiviata e chiusa a future risposte.

blackyb

Pulsanti per web stile mac

Recommended Posts

Premessa: ho cercato all'interno del forum ma non ho torvato un tutorial che spiegasse questa cosa, quindi mi auguro di non aprire una disc. doppia.

Duneque, sto cercando di riprodurre dei pulsanti per il mio sito in stile mac, per intenderci quelli presenti sul sito apple. Ho trovato in rete alcuni tutorial, quello + completo sembra essere questo:

Tutorial


_______________

..::Blacky|B::..

...less is more...

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti


questo metodo che uso io mi sembra più mac(iPhone) style... http://tutorials20.com/design/design-your-iphone-widgets/

;)


www.t1t.it Il mio sito personale

www.appartamentiumago.it ....casa vacanza in Croazia, ottimi i prezzi e i simpatici gestori

MacBook Pro "17 Core Duo - iMac G3 Flavors 333 Mhz - 2xiBook Clamshell G3 300Mhz with airport (Tangerine&Blue) - Canon EOS 350D + 18/55 + 55/200

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Si effettivamente poi è stata una soluzione utilizzata anche da me che già conoscevo, forse la migliore;)


_______________

..::Blacky|B::..

...less is more...

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Alla fine io utilizzo un'altra tecnica:

creo una scritta o una grafica, la apro con phoshop cs2

creo un livello superiore che denomino vetro, nel quale creo un rett o un cerchio (seconda della forma della grafica), e lo riempo di colore bianco.

Imposto il valore di opacità del livello vetro a 40 o 30%

ed infine centro il livello vetro affinche sia posizionato sulla grafica, in modo da rendere un effetto vetro su di essa.

Forse è + spartano, ma funziona e l'effetto merita:ghghgh:


_______________

..::Blacky|B::..

...less is more...

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti
Alla fine io utilizzo un'altra tecnica:

creo una scritta o una grafica, la apro con phoshop cs2

creo un livello superiore che denomino vetro, nel quale creo un rett o un cerchio (seconda della forma della grafica), e lo riempo di colore bianco.

Imposto il valore di opacità del livello vetro a 40 o 30%

ed infine centro il livello vetro affinche sia posizionato sulla grafica, in modo da rendere un effetto vetro su di essa.

Forse è + spartano, ma funziona e l'effetto merita:ghghgh:

E' comodo e veloce! grazie blackyb!


OOOOOOOOOOOOOOOOOO

OOOOOOOOOOOOOOO

OOOOOOOOOOOOOOO

OOOOOOOOOOOOOOOOOO#

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

magari postate un risultato così senza fare tutto il procedimento tutti possono vedere com'è il risultato finale...


www.t1t.it Il mio sito personale

www.appartamentiumago.it ....casa vacanza in Croazia, ottimi i prezzi e i simpatici gestori

MacBook Pro "17 Core Duo - iMac G3 Flavors 333 Mhz - 2xiBook Clamshell G3 300Mhz with airport (Tangerine&Blue) - Canon EOS 350D + 18/55 + 55/200

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Ecco due antriprime, nel primo il riflesso apllicato con photoshop come spiegato sopra, nel secondo ho cretato anche un riflesso sottostante come se la scritta si riflettesse su un vetro.

In questo caso creo un secondo livello, con la stessa scritta che rifleto verticalmente, posiziono la scritta sotto quella originale ed infine non basta che decidere l'opacità del livello.:ghghgh:

es01pm3.jpg

es02kl6.jpg


_______________

..::Blacky|B::..

...less is more...

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Non so esperto di PhotoShop, ma se ti posso dare un consiglio, per fare il riflesso ancora + ganzo, invece di decidere solo l'opacizzazione, poi applicare una sfumatura dal grigio chiaro verso il bianco ed il risultato è questo

italiamacjg9.jpg

:ghghgh:


Alfonso|Huby®

Visita il mio sito: ALFONSO MORABITO PHOTOGRAPHER

Nasce il progretto Calabria Photo:

http://www.calabriaphoto.it/

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

forse con una maschera anzichè una sfumatura dal grigio al bianco viene ancora meglio... nel caso di un riflesso di un oggetto non nero dovresti ottenere un risultato migliore... ma non ne sono sicuro, appena ho un po' di tempo provo.


transizioni positive con:

tarcleti - pelato - geppep - alex78red - cavamatteo - sagitter

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

scusa la domanda ma come si fa a fare l'effetto "pressione" quando si passa sopra e si schiaccia un pulsante? intendo dire graficamente...


OOOOOOOOOOOOOOOOOO

OOOOOOOOOOOOOOO

OOOOOOOOOOOOOOO

OOOOOOOOOOOOOOOOOO#

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

solitamente dai un colore più scuro al pulsante della barra che vai a cliccare, poi tecnicamente varia dal sito fatto in html (dove un javascript gestisce il rollover) e da flash (dove vanno gestite le varie fasi di un'istanza di un'oggetto pulsante). In ogni caso è sempre un effetto dato da un cambio di tonalità e a volte da un leggerissimo spostamento del testo su una diagonale.


transizioni positive con:

tarcleti - pelato - geppep - alex78red - cavamatteo - sagitter

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Grazie per i consigli, ma c'è un tutorial per fare i pulsanti che hai postato prima (tipo apple)?


OOOOOOOOOOOOOOOOOO

OOOOOOOOOOOOOOO

OOOOOOOOOOOOOOO

OOOOOOOOOOOOOOOOOO#

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

mmmm no ho inkscape e gimp però posso scaricare qualsiasi freeware mi possa servire per farlo


OOOOOOOOOOOOOOOOOO

OOOOOOOOOOOOOOO

OOOOOOOOOOOOOOO

OOOOOOOOOOOOOOOOOO#

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

purtroppo non conosco programmi freeware, ma essendo tutte dunzioni semplicissime (sfumature, effetto trasparenza, ombra esterna e interna) qulunque programma vettoriale potrebbe andar bene.

Ti ripeto uso freehand e illustrator, con questi posso seguirti passo passo.


transizioni positive con:

tarcleti - pelato - geppep - alex78red - cavamatteo - sagitter

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

fa niente proverò io a far qualcosa! grazie comunque!


OOOOOOOOOOOOOOOOOO

OOOOOOOOOOOOOOO

OOOOOOOOOOOOOOO

OOOOOOOOOOOOOOOOOO#

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Se leggi tutto il post sin dall'inizio ho inserito un link

Se cerchi in rete cmq trovi molti tutorial in merito.

:DD


_______________

..::Blacky|B::..

...less is more...

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Grazie ci proverò


OOOOOOOOOOOOOOOOOO

OOOOOOOOOOOOOOO

OOOOOOOOOOOOOOO

OOOOOOOOOOOOOOOOOO#

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti
questo metodo che uso io mi sembra più mac(iPhone) style... http://tutorials20.com/design/design-your-iphone-widgets/

:ciao:

Questo è interessante...

ma.. chi mi spiega questa frase?

"Do “Rounded Rectangular Tool†(U), create a 70×70 pixel selection and right-click/Fill Path — Use color: #BF0000."

O meglio, come faccio a farne uno di 70x70 preciso! mentre trascino il mouse non vedo le dimensioni da nessuna parte :P

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

la dimensione è quella che vuoi tu, puoi fare anche ad occhio


www.t1t.it Il mio sito personale

www.appartamentiumago.it ....casa vacanza in Croazia, ottimi i prezzi e i simpatici gestori

MacBook Pro "17 Core Duo - iMac G3 Flavors 333 Mhz - 2xiBook Clamshell G3 300Mhz with airport (Tangerine&Blue) - Canon EOS 350D + 18/55 + 55/200

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Ok, ma non esiste un modo per far venire fuori le dimensioni della selezione man mano che si sta selezionando? non so.. che appena clicchi scrive 0x0 e, man mano che trascini, fa 10x10, 10x14...15x40...

Insomma le dimensioni attuali ?

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

×
×
  • Crea Nuovo...

Info

Per offrirti il miglior servizio possibile il sito utilizza cookies, anche di terze parti e profilazione. Utilizzando il sito acconsenti al loro impiego. Privacy Policy Termini di utilizzo