Kaede WeBlog

Su richiesta di un amico ho realizzato questo ritratto a colori in Photoshop con l’ausilio della mia fida tavoletta grafica.

Il soggetto del ritratto è “agghindato” per un cosplay ed interpreta Faust VIII, personaggio della serie animata Shaman King…non spaventatevi .

Lo speed painting mostra tutto il procedimento della realizzazione, quindi proverò a sintetizzare i vari “steps” :

- con lo strumento “pennello” ho abbozzato una sagoma del viso e l’ho usata come riferimento
- sempre con lo strumento pennello ho dato una base di colore alle varie aree (pelle, capelli, camicia,…)
- gradualmente ho aggiunto dettagli ai capelli (sfumature e riflessi)
- con lo strumento “sfumino” ho reso le sfumature della pelle
- utilizzando di nuovo lo strumento “pennello” ho corretto le sopracciglia e le ciocche di capelli
- con pennello e sfumino ho operato sulla camicia creando le pieghe e aggiungendo dettagli
- sempre col pennello ho disegnato gli occhi e ho provato ad aggiungere riflessi che rendessero un’espressione reale
- ho regolato la tonalità e la saturazione delle labbra
- ho aggiunto dettagli (in particolare alla pelle)
- ho aggiunto un po’ di disturbo in maniera tale da rendere più realistico il tutto
- infine ho disegnato uno sfondo sfumato irregolarmente

Penso sia evidente che per la maggior parte del lavoro è stato utilizzato lo strumento “pennello”, che ho regolato in base all’esigenza, inoltre per comodità ho assegnato a ciascuna area (capelli, pelle, ecc…) un proprio livello.
Mi scuso per non essere stato analitico nella spiegazione, ma vi prometto che mi farò perdonare .
A voi la parola.

Con un mese di ritardo pubblico sul blog il primo frutto della mia prima esperienza con una tavoletta grafica.

Il ritratto è stato realizzato con Photoshop CS3 Extended e, come potrete notare dallo speed painting, ho utilizzato prevalentemente lo strumento “pennello” e quello “gomma”. Per altre info lasciate un commento e risponderò con piacere.

Partendo da dove ci eravamo lasciati nel precedente tutorial sulle userbars, impareremo a crearne di animate.
Riapriamo il nostro file .psd (ossia il documento di Photoshop) e, per chi possiede Photoshop CS3, apriamo la finestra animazione (ITA: Finestra>Animazione; ENG: Window>Animation); se possedete una versione precedente alla CS3 passate ad ImageReady premendo l’apposito bottone presente nella barra degli strumenti (nella figura seguente è indicato da un ovale rosso).

A questo punto dovrebbe essersi aperta la finestra Animazione in cui potremo lavorare sui frames (fotogrammi). Ecco come si presenta la finestra…

Nell’animazione di una userbar possiamo giocare principalmente con la posizione, l’opacità, e gli effetti dei livelli. Adesso entriamo nel vivo dell’animazione agendo in maniera semplice su questi tre parametri.
Questi sono i livelli della nostra userbar…

E questo è il suo aspetto attuale…

A titolo esemplificativo la nostra animazione consisterà nel creare una comparsa in assolvenza del logo, un’entrata in scorrimento del testo, e un bagliore esterno al pattern.

Selezioniamo l’unico frame presente nella finestra Animazione, poi selezioniamo il livello del logo e settiamo la sua opacità allo 0%; ora selezioniamo il livello del testo e spostiamo il contenuto verso destra premendo Ctrl+freccia direzionale destra oppure usando il Move Tool (V), infine selezioniamo il livello del pattern e applichiamo l’effetto bagliore esterno (outer glow) attraverso il percorso Livello>Stile di livello>Bagliore Esterno (ENG: Layer>Layer Style>Outer Glow) senza dimenticare di impostare l’opacità del bagliore allo 0%.
A questo punto, se avete eseguito tutto in maniera corretta, dovreste visualizzare solo lo sfondo e il pattern…

Adesso creiamo un nuovo frame, selezioniamolo, e impostiamo l’opacità del livello del logo al 100%, riportiamo il testo all’interno della userbar, e infine impostiamo al 75% l’opacità del bagliore applicato al pattern.

Il passo successivo consiste nel cliccare sul bottone Tween (”interponi frames“) ed inserire i seguenti parametri…

…non ci resta che impostare quante volte vogliamo che si ripeta l’animazione…

In questo caso ho scelto Once (una volta).
Prima di andare in “Salva per Web e Dispositivi” (Alt+Shift+Ctrl+S) e salvare l’immagine in formato .gif, assicuriamoci che l’animazione venga eseguita correttamente.

Il tutorial è terminato e il suo risultato è questo:

(per rendere sempre visibile l’animazione ho selezionato la ripetizione continua ogni 5 secondi)

La mia animazione è basilare ma, ovviamente, capito il meccanismo potrete elaborare l’animazione di una userbar in base alle vostre preferenze.

Spero di essere stato chiaro. Se riscontrate problemi lasciate pure un commento e sarò felice di aiutarvi.