Pagina 1 di 2 1 2 ultimoultimo
Visualizzazione dei risultati da 1 a 10 su 11
  1. #1

    [tutorial]stile aqua in Psp




    Lo stile aqua gel , può essere simulato in paint shop pro , in tantissimi modi , se volete ottenere dei bei pulsanti aquagel , fate un salto quì:
    http://www.sfondo.com/psp/Tutorials/...alpsp10ita.htm

    Troverete un dettagliato tutorial che parla proprio di quell'argomento.

    In questo sito invece , troverete spiegata una tecnica veloce per rendere tale effetto applicabile a più forme (pulsanti e sfere) :
    http://www.eyeball-design.com/fxzone/tutorial_ifx01.htm

    Pur essendo stato fatto il tutorial per un altro programma , l'effetto (leggermente modificato) , è applicabile anche a paint shop pro , ed in questo tutorial vi spiegherò come .




    1 - In psp aprite un nuovo documento 300x600pixel , sfondo = trasparente
    2 - create un nuovo livello raster che chiamerete "aqua"
    3 - create una selezione per il pulsante :



    o usando la tecnica che tovate quì:
    http://forum.html.it/forum/showthrea...readid=313805ù

    Oppure più semplicemente scaricate questo file:
    http://utenti.lycos.it/jamesvalue/ht...s/aquagel1.psp

    , che contiene nel canale alpha tutte le selezioni necessarie allo svolgimento del tutorial.
    Fatta la selezione salviamola nel canale alpha perchè poi la riuseremo più volte .
    Selezione>salva su canale alpha , OK , nome da mettere= "pulsante" , OK

    Dobbiamo riempire la selezione con una sfumatura color aquachiaro/aqua scuro.

    4 - prendiamo il tool riempimento , nella tavolozza colori selezioniamo come stile di primo piano = gradiente (e blocchiamo), e clicchiamo sulla casella del gradiente , per costruirne uno nuovo , aperta la finestra dei gradienti , clicchiamo sul tasto "modifica" , si aprirà una finestra dove potremo modificare i gradienti esistenti in Psp , oppure farne di nuovi.

    Clicchiamo sul pulsante "nuovo" , si aprirà una finestra nella quale mettere il nome del gradiente , il nome che digiteremo è "aqua" , quindi confermiamo con l'OK.
    Si aprirà una finestra con un gradiente formato da due caselle dello stesso colore.

    Dobbiamo modificare queste due caselle in modo invece che i colori siano due e costituiscano una "shade" del medesimo colore ovvero in parole povere una casellina contenente una versione chiara di un colore , e l'altra casellina conterrà la versione scura dello stesso colore.

    In termini di modello colore HSL i due colori dovranno avere la stessa Hue (tonalità) , lo stesso valore massimo di saturazione (ma non è obbligatorio) e differenti L (luminosità).

    Nel caso del gradiente acqua , il primo colore è HSL=127 , 255 , 178 , mentre invece il secondo colore è HSL=127 , 255 , 70.

    Come potete vedere H e S rimangono fissi , mentre invece cambia solo L.

    Se avete assegnato i giusti colori al gradiente , dovreste ritrovarvi con l'immagine quìsotto:



    Cliccate su OK ,

    verificate che il gradiente sia impostato su "lineare" e che la parte chiara sia in basso (se così non fosse basterebbe invertire il gradiente).
    Quindi cliccate all'interno della selezione per dispensare il gradiente.




    Dobbiamo ora inserire un riflesso sfumato , bianco e semitrasparente.
    5 - selezione>modifica>contrai = 5pixel
    selezione>modifica>sfuma = 8pixel

    N.B. - questi valori possono cambiare in rapporto alle dimensioni del pulsante , e sono stati calcolati sulla base delle dimensioni del pulsante usato nel tutorial , cambiando le dimensioni del pulsante questi valori non vanno più bene e devono essere adeguati alle nuove dimensioni.

    Salviamo questa selezione nel canale alpha , col nome di "riflesso pulsante"

    selezione>salva su canale alpha , OK , nome=riflesso pulsante , OK.

    Prendiamo il tool riempimento (dovrebbe già essere attivo) , e nella tavolozza colori , prepariamo un nuovo gradiente col nome di "riflesso pulsante" , questa volta però il gradiente dovrà essere bianco - bianco , e dovremo intervenire solo sulla trasparenza.

    Il colore a trasparenza massima dovrà trovarsi circa al 50% della posizione , mentre invece il colore a opacità massima , dovrà trovarsi come posizione a 100 , ovvero tutto spostato a destra.




    Clicchiamo all'interno della selezione col tool riempimento.




    6 - Nella tavolozza strumenti prendiamo il tool spostamento e draggando sul pulsante appena fatto spostiamolo verso il basso del foglio , creiamo quindi un nuovo livello che chiameremo "blù".

    livelli>nuovo livello di rasterizzazione (nome=blù)
    Carichiamo la selezione per il pulsante dal canale alpha.
    selezione>carica da canale alpha (pulsante) , OK

    Nella tavolozza strumenti prendiamo il tool riempimento , nella tavolozza colori clicchiamo sulla casellina di gradiente di primo piano , quindi sul pulsante "modifica" , quindi sul pulsante "nuovo" e creiamo un gradiente di nome "blù1"(il gradiente "blù" esiste già in Psp , quindi quel nome non può essere usato).

    I due colori basta che siano un chiaro/scuro del colore blù, io ho scelto per il colore chiaro un HSL=160 , 255 , 216 e per quello scuro un HSL=160 , 255 , 83.

    Col tool riempimento cliccate all'interno della selezione , quindi caricate la selezione del riflesso dal canale alpha .
    selezione>carica da canale alpha (riflesso pulsante) , OK.

    Nella tavolozza colori carichiamo il gradiente "riflesso pulsante" precedentemente preparato (lo stesso usato per il pulsante aqua).

    clicchiamo all'interno della selezione per dispensare il gradiente riflesso.
    Abbiamo creato il pulsante blù:



    Prendiamo il tool spostamento , e dragghiamo il pulsante verso il basso , quindi creiamo un nuovo livello che chiameremo "rosso" e che ovviamente conterrà un pulsante con sfumature rosse.

    Ripetete i procedimenti di fabbricazione dei pulsanti e dei rispettivi livelli , fino alla creazione (oltre ai due che abbiamo già creato)dei pulsanti :
    rosso , verde , giallo , arancio. (se volete crearne altri , siete liberi di farlo)

    I colori da me usati per i gradienti sono:
    rosso1=HSL255 , 255 , 213 - rosso2=HSL255 , 255 , 72
    verde1=HSL85 , 255 , 158 - verde2=HSL85 , 255 , 52
    giallo1=HSL45 , 255 , 230 - giallo2=HSL45 , 255 , 54
    arancio1=HSL20 , 255 , 200 - arancio2=HSL20 , 255 , 82.

    I pulsanti una volta creati dovranno avere più o meno questo aspetto:


  2. #2
    E questa sarà la tavolozza livelli se avrete creato un livello per ogni pulsante come era stato suggerito.




    Passiamo ora alla creazione delle sfere.

    Il procedimento sarà simile a quello per la creazione dei pulsanti , dovremo solo costruire un nuovo gradiente per il riflesso , che sarà leggermente diverso da quello usato per i pulsanti.

    1 - Nella tavolozza livelli attiviamo il livello "aqua" cliccandoci sopra.

    Nella tavolozza strumenti prendiamo il tool "selezione" , nel menù opzioni strumenti impostiamo "cerchio" (antialias=si) come tipo di selezione , quindi tracciamo un cerchio più o meno delle dimensioni che vedete nell'immagine quìsotto:



    2 - Prendiamo il tool riempimento , e nella tavolozza colori impostiamo il gradiente "aqua" come stile di primo piano.

    Clicchiamo all'interno della selezione .
    Creiamo la selezione per il riflesso.
    Eseguiamo selezione>modifica>contrai=5pixel

    seguito da selezione>modifica>sfuma=8pixel

    Salviamo la selezione nel canale alpha,
    selezione>salva su canale alpha , OK , nome=riflesso sfera , OK.


    Dobbiamo creare un gradiente semitrasparente per il riflesso della sfera.

    Nella tavolozza colori , clicchiamo sul gradiente di primo piano , quindi sul pulsante "modifica" , quindi sul pulsante "nuovo", ci verrà richiesto un nome per il gradiente , noi metteremo come nome "riflesso sfera".
    Il gradiente dovrà essere costituito da due caselline di colore "bianco" di cui la prima a sinistra 0%opaca (cioè trasparente al 100%) e posizionata al 60% della scala , la seconda casellina dovrà invece essere opaca al 100% e posizionata al 100% della scala , cioè all'estrema destra , la sfumatura non dovrà essere al centro perfetto delle due caselline , ma leggermente spostata verso destra , esattamente al 62% della distanza fra le due caselline.

    L'immagine quìsotto vi chiarirà le idee:



    Preparato il gradiente per il riflesso , clicchiamo nella selezione otterremo una sfera color aqua:



    I più esperti possono passare direttamente alla creazione delle altre sfere , nei rispettivi livelli , i meno esperti invece seguano le istruzioni su come creare la seconda sfera (processo simile alla creazione dei pulsanti) , poi il processo di creazione delle altre sfere sarà automatico e non ci sarà bisogno di spiegazioni.

    Creeremo la sfera blù.
    3 - Nella tavolozza strumenti , prendete il tool "selezione" e disegnate una selezione attorno alla sfera , che sia più grande della sfera, ma che non tocchi altri oggetti presenti nel livello , quindi cliccate dentro la sfera , psp automaticamente selezionerà solo la sfera.(faccio presente che su quello stesso livello si trova anche un pulsante) .
    Prendete il tool spostamento e draggate la sfera , verso il basso , in modo da spostarla da dove si trova .
    Nella tavolozza livelli attiviamo (cliccandoci sopra) , il livello "blù", oppure potremo attivare il livello eseguendo il comando:
    livelli>livelloX (blù).

    Carichiamo la selezione dal canale alpha.
    selezione>carica da canale alpha (sfera) OK.
    Nella tavolozza strumenti prendiamo il tool riempimento , nella tavolozza colori impostiamo il gradiente "blù1" come stile di primo piano , clicchiamo all'interno della selezione , quindi carichiamo la selezione "riflesso sfera" dal canale alpha selezione>carica da canale alpha (riflesso sfera) , OK , mettiamo il gradiente "riflesso sfera" come gradiente di primo piano , quindi clicchiamo dentro la selezione :



    Spostiamo la sfera blù , cambiamo livello , carichiamo la selezione e così via fino ad avere disegnato tutte le sfere nei rispettivi livelli , alla fine se avete seguito i passi giusti , dovreste avere una figura che somiglia a questa:


  3. #3
    non si vedono le immagini...neanche negli altri tuoi tutorial....

    potresti fare qualcosa...grazie
    Let's your dream came true!

  4. #4
    Originariamente inviato da ale500
    non si vedono le immagini...neanche negli altri tuoi tutorial....

    potresti fare qualcosa...grazie
    Ciao ,
    purtroppo le immagini stavano su uno spazio web non mio e penso siano state cancellate .

    Anzi consiglierei i moderatori di togliere tutti i miei tutorial nei quali mancano le immagini.


    (sorry ma purtroppo non è colpa mia!)


  5. #5
    non potresti rifarle...se ti serve uno spazio ti posso dare il mio.....

    grazie
    Let's your dream came true!

  6. #6
    Il mondo ti lascia delle possibilità. Sta a te coglierle nel modo che più ti aggrada.

  7. #7
    Originariamente inviato da ale500
    non potresti rifarle...se ti serve uno spazio ti posso dare il mio.....

    grazie
    Ciao ,

    uno spazio sicuro ce l'ho pure io , solo che il problema è che le immagini vecchie stavano su uno spazio web non mio e sono andate per sempre quindi ci vorrà un pò a ricostruire tutto! (cmq ho già iniziato , però per psp8 così puoi scaricare anche lo script che fa il tutorial da solo e tu leggi solo i comandi).

    Cmq pazienta un poco!

    Casomai scrivimi in PVT a
    jamesvalue@virgilio.it

    così ti tengo informato meglio!


  8. #8
    Utente di HTML.it L'avatar di cyberman
    Registrato dal
    Mar 2002
    Messaggi
    7,588
    james se vuoi possiamo modificare i tuoi post originari così se hai le immagini su un altro spazio non ci sono problemi

  9. #9
    Originariamente inviato da cyberman
    james se vuoi possiamo modificare i tuoi post originari così se hai le immagini su un altro spazio non ci sono problemi
    Grazie Cyberman , ma purtroppo le immagini originali non le ho più ne in uno spazio web e nemmeno (a parte qualcuna) sull'HD!

    Cmq i tutorial li stò rifacendo , quando ne ho qualcuno pronto (se vuoi) , lo riposto , così cancelli quello vecchio . (cmq i miei tutorial li puoi già cancellare adesso , tanto i testi dei TUT li ho già salvati sull'HD).


  10. #10
    Utente di HTML.it L'avatar di cyberman
    Registrato dal
    Mar 2002
    Messaggi
    7,588
    ok se posti qualcosa che sostituisce quelli vecchi eliminiamo

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.