Tutorial per creazione bottoni per barra di navigaziona ambiente Photofiltre

lunedì, maggio 23, 2011

Mi sono giunte e-mail dove mi si chiede come ho realizzato la barra di navigazione che sto usando....bene, è semplicissimo come al solito.
Premetto che io ho usato Photoshop, ma il tutorial riguarderà Photofiltre semplicemente perchè è un programma scaricabile gratuitamente
Cosa ci occorre?


  • Tanta pazienza
  • La base in stile post-it che trovate qua sotto, per prenderla tasto desto del mouse  e salva con nome

  • e dove la salviamo direte voi? bhe...è essenziale tenere in ordine il nostro PC, quindi vi consiglio di: creare una cartellina nominandola per esempio " Barra di navigazione" e dove mano a mano andrete a salvare tutti i vostri pulsanti o banner che dir si voglia.
  • Icone che possono essere tutte diverse come nel mio blog, oppure potete usare sempre la stessa...vi faccio un esempio:


l'icona che salverete nella cartellina che avete creato (se volete proprio questa: tasto destro del mouse e salva con nome

Adesso andiamo a creare il nostro pulsante, quindi apriamo Photofiltre
  • Apri 
  • doppio click sull'icona


Si aprirà l'immagine con sfondo bianco, dobbiamo rendere lo sfondo trasparente, quindi:
  • Click sull'icona della trasparenza (quella a scacchi neri e grigi)
  • Selezionare il colore di sfondo nella finestra che si apre, nel nostro caso è il bianco
  • Anteprima
  • Ok



 L'immagine con sfondo trasparente si presenterà così:

Bene, la nostra icona è pronta per traslocare sul bottone, quindi aprimao il bottone in Photofiltre:
  • Apri
  • doppio clic sul bottone

  • attivare la finestra dell'icona a fiorellino cliccandola
  • tasto destro
  • copia

  • attivare la finestra del bottone cliccandola
  • tasto destro
  • incolla
ed il fiorellino si posizionerà sul bottone

  • usando il puntatore del mouse posizionare l'icona-fiorellino dove volete voi, io la metto in alto a sinistra
  • tasto destro del mouse
  • convalida ed incolla

ed otteremo questo:
ma dobbiamo rendere trasparente la parte bianca evidenziata dalla freccia rossa (immagine sopra)
quindi non venitemi meno adesso e continuiamo:
  • bacchetta magica
  • tolleranza 0
  • togliere la spunta al colore
  • cliccare sulla parte bianca da rendere trasparente
  • selezione
  • inverti (resterà selezionato solo il bottone)
  • copia
  • accertarsi di non avere selezionato il bianco nel selettore colori

  • modifica
  • incolla come nuova immagine, ed avremo la parte da rendere trasparente di un colore del selettore colori


occupiamocil pezzettino rimasto indicato dalla freccia nell'immagine sotto



  • Bacchetta maciga
  • clic nel pezzettino
  • tasto destro contorno e riempimento


  • togliere la spunto a contorno
  • mettere la spunta a riempimento
  • cliccare sull'iconcina del contagocce
  • posizionarsi con il mouse sulla parte colorata (rosa nel mio caso) e cliccare (vedrete il puntatore assumere la forma del contagocce)
  • cliccare ok

Adesso la parte del pezzettino è rosa
  • Selezione
  • Nascondi selezione
  • Immagine
  • Colore di trasparenza
  • Cliccare su sì nella finestra che si apre
  • Cliccare su ok in quella successiva (dovrebbe automaticamente essere selezionato il colore da rendere trasparente)
ed otteniamo questo:
è lui o non è lui?
Certo che è lui!






E' il nostro bottone!
Per poterci scrivere sopra potete leggere il seguente tutorial ricordandovi di scrivere prima di attuare la missione trasparenza
ma potete anche leggere il seguente:
Ancora una cosa...per usare il banner va prima appoggiato su un sito hosting:
Mentre il codice per creare la barra di navigazione lo trovate qua:

You Might Also Like

9 scarabocchi

  1. Prof. Azzurra sei semplicemente fantastica!!!!
    Voglio provare e poi ti dirò come è andata...
    Buona serata Tilli

    RispondiElimina
  2. bellissimo tutorial cara Azzurra,ho messo qualche bottoncino nel mio blog così ho fatto un pò di ordine,grazie un bacio giostroso

    RispondiElimina
  3. grazie Azzurra,ho seguito il tuo tutorial ed ho fatto dei bottoncini per il mio blog,
    ciao un abbraccio.

    p.s.pensavo di aver scritto il post per dirtelo ma siccome non c'è si vede che l'ho solo pensato

    RispondiElimina
  4. Grazie Franca e grazie tilli...
    tilli hai risolto il problema della finestra che non si apre?
    Un bacio grande a entrami
    azzurra

    RispondiElimina
  5. no franca...è che...sono meno al pc...e quindi apro posta in ritardo...
    :)
    azzurra

    RispondiElimina
  6. ok,era che volevo ringraziarti per tutto quello che metti a disposizione per noi,,grazie grazie grazie,

    RispondiElimina
  7. buona giornata franca!
    :)
    azzurra

    RispondiElimina
  8. Ciao, potresti indicarmi un sito dove trovare delle icone belle come le tue??

    RispondiElimina
  9. ciao lully,
    i bottoni della barra di navigazione li ho fatti io...ed in questo momento le richiestegrafiche sono chiuse, ad ogni modo mi sembra che sei riuscita a realizzarli perfettamente..
    :)
    azzurra

    RispondiElimina

Grazie della visita e del tuo commento...♥♥♥
è un piacere leggervi!
Sorrisone!
:)

Nota. Solo i membri di questo blog possono postare un commento.

Circa Grafic Scribbles








modificare foto

Paperblog : le migliori informazioni in diretta dai blog

Mr.Webmaster


Motori ricerca

SEO


BlogItalia.it - La directory italiana dei blog

siti
sito internetBlog d'argento



Ebuzzing - Top dei blog - Blog creativi


Visite

eXTReMe Tracker

Views

© 2011 - 2016 Grafic Scribbles, AllRightsReserved.. Powered by Blogger.

on line