Dal colore al b/n e modifica del colore degli occhi con il “Bilanciamento Colore”

Questo problema lo hanno avuto in tanti ma la necessità di creare il tutorial è venuta “a galla” grazie a Davide che mi ha chiesto di spiegargli i passaggi in maniera più approfondita. Sostanzialmente quello che si desidera fare è cambiare il colore degli occhi di un soggetto dopo aver trasformato in bianco e nero la foto.

Passo 1

Aprite la vostra immagine con Photoshop e duplicatela cliccando sopra il livello con il tasto destro del mouse e scegliendo Duplica livello…. Nella finestra che vi apparirà (Duplica livello) cliccate semplicemente Ok.

Immagine: http://www.sxc.hu/photo/982488

Bene, questa copia è fatta per evitare di creare modifiche irreversibili alla foto originale. Potevamo anche non crearla dato che non modificheremo niente della foto iniziale. Ma le buone abitudini è meglio non perderle.

Passo 2

Ora dobbiamo trasformare la nostra immagine in bianco e nero. Un metodo parecchio usato è quello che cambia la modalità dell’immagine portandola a Scala di grigio, ma essendo un metodo che elimina le informazioni sul colore dell’immagine, preferisco non utilizzarlo. Andiamo quindi a creare un livello di regolazione Bianco e nero… cliccando nell’apposita icona Crea un nuovo livello di riempimento o di regolazione e scegliendo poi Bianco e nero…:

Impostiamo quindi i parametri nel modo che ci sembra più opportuno. Nel mio caso ecco i settaggi:

Inutile dire che con questo metodo avete il pieno controllo delle impostazioni del vostro bianco e nero; ecco la differenza tra l’applicare la modalità Scala di grigio (non modificabile) e l’utilizzare invece il livello di regolazione del Bianco e nero…:

Passo 3

Ora zoomate sull’occhio in modo da vederlo meglio che potete, poi con lo Strumento selezione ellittica andate a selezionare l’occhio. Per fare un cerchio perfetto tenete premuto Shift.

Non importa che siate precisi e non preoccupatevi se ci sono delle parti che vanno fuori dall’occhio.

Ora, dopo esserci assicurati di avere come Colore di primo piano il nero e come Colore di sfondo il bianco (vedi immagine di seguito), creiamo un livello di regolazione Bilanciamento colore… cliccando nell’apposita icona (indicata dalla freccia rossa nell’immagine):

Impostate i parametri nel seguente modo:

Ombre

Mezzitoni

Luci

Logicamente dovete settare i parametri in modo da avere il colore desiderato.

Ecco il risultato che abbiamo dopo aver applicato il livello di regolazione:

Passo 4

Perfetto. Adesso tenendo selezionato il livello di Bilanciamento colore…, selezioniamo un pennello di dimensioni appropriate alla dimensione della nostra immagine con Durezza pari allo 0%, e dopo esserci assicurati di avere come Colore di primo piano il bianco e come Colore di sfondo il nero (vedi immagine di seguito), iniziamo a dipingere l’altro occhio (qui potete essere anche precisi):

Fatto questo dovreste avere qualcosa del genere:

Passo 5

Arrivati a questo punto, dobbiamo solo sistemare le imprecisioni. Tanto per cominciare andiamo su Filtro —> Sfocatura —> Controllo sfocatura…, ed impostiamo un valore pari a 2px o 3px come Raggio. Fatto questo assicuriamoci di avere come Colore di primo piano il nero e come Colore di sfondo il bianco e aggiungiamo una Maschera vettoriale al livello di Bilanciamento colore cliccando nell’apposito pulsante indicato in figura e presente nella scheda dei livelli:

Bene, ora con lo strumento pennello di dimensioni appropriate e Durezza 0%, andiamo a cancellare le parti che non fanno parte degli occhi (il colore di primo piano deve essere nero). Se fate tutto bene, alla fine dovreste ottenere qualcosa del genere:

Questo metodo è molto utile in quanto adesso agendo solo sul livello di regolazione Bilanciamento colore… possiamo cambiare rapidamente il colore degli occhi del soggetto (cliccate due volte sulla miniatura del livello):

Ombre: -30, +20, -30 Mezzitoni: +20, -10, -30 Luci: +20, +20, -80

Ombre: +30, +20, -30 Mezzitoni: +20, -10, -30 Luci: +20, +20, -80

Altra vantaggio sta nel fatto che se ci ripensate e volete la vostra bella immagine a colori, basta che rendiate non visibile il livello di regolazione Bianco e nero…. Per fare questo basta cliccare nell’occhio del livello Bianco e nero… presente a sinistra (dopo aver cliccato scompare e magicamente l’immagine torna a colori):

Et voilà!

Dal colore al b/n e modifica del colore degli occhi con il “Tinta unita…”

Questo secondo metodo è pressoché uguale al precedente tranne per una piccola differenza al passo 3.

Passo 3

Ora zoomate sull’occhio in modo da vederlo meglio che potete, poi con lo Strumento selezione ellittica andate a selezionare l’occhio. Per fare un cerchio perfetto tenete premuto Shift.

Non importa che siate precisi e non preoccupatevi se ci sono delle parti che vanno fuori dall’occhio.

Ora, dopo esserci assicurati di avere come Colore di primo piano il nero e come Colore di sfondo il bianco (vedi immagine di seguito), creiamo un livello di regolazione Tinta unita… cliccando nell’apposita icona (indicata dalla freccia rossa nell’immagine):

Come colore scegliete quello che più vi aggrada:

Adesso cambiate la modalità del livello da Normale a Colore:

I passi successivi sono esattamente identici (per cambiare colore dovrete cambiare il colore cliccando due volte sulla miniatura del livello Tinta unita…) . Anche con questo metodo si possono ottenere piacevoli effetti:

Dal colore al b/n e modifica del colore degli occhi con il “Tonalità/saturazione…”

Credo che abbiate capito che anche in questo caso dobbiamo agire sul passo 3.

Passo 3

Ora zoomate sull’occhio in modo da vederlo meglio che potete, poi con lo Strumento selezione ellittica andate a selezionare l’occhio. Per fare un cerchio perfetto tenete premuto Shift.

Non importa che siate precisi e non preoccupatevi se ci sono delle parti che vanno fuori dall’occhio.

Ora, dopo esserci assicurati di avere come Colore di primo piano il nero e come Colore di sfondo il bianco (vedi immagine di seguito), creiamo un livello di regolazione Tonalità/saturazione… cliccando nell’apposita icona (indicata dalla freccia rossa nell’immagine):

In questo caso è fondamentale spuntare la casella Colora e scegliere poi il colore desiderato:

Cambiate poi la modalità del livello da Normale a Colore (se non vi ricordate come fare guardate la figura precedente).

I passi successivi sono esattamente identici (per cambiare colore dovrete cambiare il colore cliccando due volte sulla miniatura del livello Tonalità/saturazione…); ovvio che anche in questo modo otteniamo ottimi risultati:

Conclusioni

Queste tre tecniche, una volta imparate, sono davvero semplici, veloci e non distruttive; inoltre avete il pieno controllo sulla vostra immagine e potete modificare il colore degli occhi quante volte volete. Spero che questo tutorial oltre che chiarire molte cose sulla colorazione degli occhi, sia anche un valido aiuto per cominciare ad apprezzare i potenti livelli di regolazione e di riempimento, e che questo possa essere un punto di partenza per la sperimentazione di nuovi utilizzi di questi strumenti.

In occasione di una sponsorizzazione da parte di 99designs.com, altro sito di riferimento per designer e creativi della rete (e per altro con un’ottima struttura e funzionamento), sitepoint ci dona uno dei suoi libri più belli su Photoshop: The Photoshop Anthology: 101 Web Design Tips, Tricks & Techniques. Il libro non è una guida all’uso del software Photoshop, bensì un pratico manuale pieno di tutorial per imparare al meglio determinate tecniche e utilizzi del programma; a mio avviso è molto più utile di molti altri libri. Oltre ad alcune informazioni di base, viene spiegato come si creano bottoni, sfondi, come si utilizzano e modificano i font e gli stili sul testo, come si ottimizzano le immagini per renderle perfette, come si comincia a creare un layout per un sito web ed infine alcune tecniche avanzate per facilitarci la vita con Photoshop ! Insomma un libro davvero da non perdere!

Clicca sull’immagine per andare a scaricare il libro!

Come Scaricare

Per scaricare il libro in formato .pdf, basta semplicemente cliccare su DOWNLOAD NOW! Fatto questo ci apparirà un pop-up dove dovremo inserire un indirizzo e-mail nel quale ci verrà inviato il link per scaricare l’e-book:

Quando vi arriverà il messaggio, ci saranno due link, uno per scaricare la versione ad alta risoluzione (high-res copy) da 64 Mb, oppure per chi non ha una connessione molto veloce c’è il link per la versione a bassa risoluzione (low-res copy) da 23 Mb.

Ultima cosa abbastanza importante da dire è che il libro è in inglese (anche se un inglese comprensibilissimo) e quindi, chi non è molto pratico con la lingua, potrebbe abbattersi un po’ durante la lettura. Per qualsiasi problema comunque non esitate a chiedere .

Ora andate subito a scaricare il libro e cominciate la lettura!

Oggi, dopo molto tempo, vedremo come sia possibile realizzare scritte 3D con Illustrator. Armatevi di pazienza perché è più facile da fare che da dire ! Tanto per iniziare dovete aprire Illustrator, poi creare un nuovo documento di dimensioni che preferite; io ho scelto 600px per 600px (File —> New…):

Fatto questo selezionate il Type Tool (Strumento Testo) e poi impostate la grandezza dei caratteri ed il font come preferite (in modo da vedere bene ciò che fate):

Cliccate sullo Strumento Testo

Scegliete font, stile e dimensione

Ok, ora non dovete far altro che scrivere quello che più desiderate; io ho scritto due semplici lettere “CW“. Una volta scritto tutto, cliccate sullo Strumento di Selezione (Selection Tool) e selezionate il testo appena scritto cliccandoci sopra:

Cliccate sul Selection Tool

Una volta selezionata la scritta, vi apparirà questa “cornice” azzurra

Perfetto, ora applicchiamo al testo qualche effetto: andate su Effect —> Warp —> Arc…

Nella finestra che vi apparirà impostate i seguenti valori:

Ecco come dovrebbe apparirvi il testo:

Adesso andate su Effect —> 3D —> Extrude & Bavel:

Nelle regolazioni impostate Extrude Depth a 30pt:

Fatto questo cliccate su Object —> Expand Appearence per ottenere un risultato simile:

Come potete vedere è stato creato un tracciato formato da punti uniti; quello che noi desideriamo fare è scindere la parte frontale delle lettere (quella liscia) dalla tridimensionalità che è dietro. Per fare questo dobbiamo cliccare più volte su Object —> Ungroup:

Clicchiamo più volte fino a che la parte frontale del testo non è completamente scissa dal dietro

Fatto questo dobbiamo rendere uniformi le parti curvose e non unite del testo dietro (in 3D), questo perché altrimenti in fase di colorazione verrebbero come parti disunite con distacco netto dovuto ai piccoli rettangolini. Quindi mergiamo queste parti tramite il comando Add to Shape Area presente nella finestra PathFinder (chi non la vedesse può attivarla cliccando su Window —> Pathfinder):

Cliccate sulla parte da mergere (quelle stondate e tutte quelle che presentano più di un tracciato interno; per capirsi che sono formate da più rettangolini azzurri) e poi tenendo premuto ALT, cliccate sul bottone Add to Shape Area (indicato dalla freccia rossa). Mi raccomando di farlo per ogni lettera.

Questo vi farà avere una colorazione perfetta e non “a scatti”. Adesso selezionate le due parti frontali delle lettere tenendo premuto Shift e cliccando su ognuna:

Come vedete per mettere il gradiente dovete aver attivato la Finestra Color (Window —> Color); fatto questo dovete cliccare nella scheda Gradient in basso e scegliere i colori che desiderate in più modi (o selezionandoli dallo spettro, o indicandoli in rgb, o trascinando quelli di default nella barra del gradiente, etc…).

Bene, ora tenendo premuto Shift, cliccate su tutte le parti dietro la parte frontale per selezionarle tutte:

Dopo aver selezionato ogni parte ad esclusione di quelle già colorate, selezionate lo strumento Eyedropper Tool (Contagocce), e cliccate in un punto già colorato. Così facendo si colorerà in automatico anche la parte tridimensionale:

Nelle impostazioni del gradiente di queste parti però spostate verso il colore più scuro il Gradient Slider (cerchiato in nero nell’immagine seguente):

Così facendo avremo un vero effetto di tridimensionalità che ci permetterà di ottenere un risultato simile a questo:

Oppure giocando con le impostazioni, simile a quest’altro:

Iniziamo con l’aprire il nostro Photoshop e successivamente l’immagine alla quale dobbiamo applicare la cornice, andando su File —> Apri (File —> Open). Avrete di fronte a voi la vostra immagine che nel mio caso è la seguente:

Adesso dovete fare un semplice passaggio, che consiste nell’andare su Image —> Canvas Size:

Dopo aver cliccato, vi apparirà una finestra dove avete da settare qualche parametro:

Alla voce “Current Size” sono indicate le dimensioni in pixel della vostra immagine originale e sotto, alla voce “New Size“, dovete impostare un nuovo valore per width e height, che tenga conto delle dimensioni della vostra immagine.

In sostanza dovete avere una vaga idea di come volete che la cornice sia grande; ad esempio, io ho pensato ad una cornice uniforme di 15 pixels su ogni lato e di conseguenza ho aumentato la Width e la Height originali di 30 pixels.

Sotto a queste impostazioni ci sono delle freccette (Anchor): cliccando nel quadratino centrale, farete in modo che la cornice si disponga uniformemente su tutti i quattro lati dell’immagine.

Infine alla voce “Canvas extension Color“, dovete impostare il colore della cornice, che può essere bianco (white), nero (black), grigio (gray) o di un colore a vostra scelta (other..).

Fatto tutto questo cliccate su Ok; questo dovrebbe essere il risultato:

VIDEO TUTORIAL

Quello che vediamo oggi è un metodo semplicissimo e banalissimo per inserire un’immagine dentro ad una scritta. In particolare metterò un’immagine di fiori (tulipani) dentro ad un numero, il 5. Perché? Semplice, 5 è il mio nuovo page rank ! Si lo so che conta poco, ma è comunque bello dirlo . Il risultato finale dovrà essere qualcosa di simile:

Bene cominciamo, la mia immagine iniziale è la seguente e la potete scaricare QUA:

Apritela con Photoshop (File —> Open) e cliccate sopra il livello due volte per renderlo modificabile, vi apparirà una finestra nella quale potrete rinominare il livello e fatto questo, cliccate su Ok. Bene, ora selezionate lo strumento testo (Text Tool) e scrivete quello che desiderate (nel mio caso il numero 5):

Come noterete il colore da usare è indifferente e la grandezza dipende dalla scritta che dovete fare e dalla grandezza dell’immagine. Fatto questo, spostate il livello del testo sotto il livello immagine (semplicemente cliccando sul livello con il tasto sinistro del mouse e trascinandolo sotto al livello con l’immagine):

Adesso manca il passaggio essenziale —> tenendo premuto Alt (vi apparirà un simbolino come nella figura qui sotto a sinistra), cliccate con il tasto sinistro del mouse in mezzo ai livelli per ottenere la situazione nell’immagine qua sotto a destra:


Ok, ora siamo a posto, basta aggiungere degli effetti al livello utilizzando le opzioni di fusione (Blending Options); io ho utilizzato questi, ma nessuno vi vieta di provarne altri:

Ricordatevi di selezionare il livello con il testo!

Poi impostate un’ombra (Drop Shadow):

Il colore è nero

e per finire un bagliore esterno (Outer Glow):

Il risultato finale l’avete già visto:

Ciao Carlos ho un problema, avevo installato sul mio pc, photoshop cs2 in inglese, e grazie ad una patch ero riuscito a portarlo quasi interamente in italiano, ultimamente però, ho acquistato la versione in italiano, per cui ho disinstallato la precedente, ora ho notato una cosa, nell’altra versione, il fondo dell’area di lavoro era grigio, invece con questa è tutto bianco, ora, vuoi per le vecchie abitudini, vuoi perché è un po’ fastidioso, vorrei portare nuovamente lo sfondo del colore che reputavo originale, sai se c’è un opzione che permette di cambiare il colore di fondo? grazie in anticipo per la tua risposta.

Io avevo risposto stupidamente dicendogli di andare su Edit —> Preferences, dimenticandomi che non serve a niente se si vuole modificare il colore dello sfondo dell’area di lavoro . Tanto per capirci, ecco qual è la zona incriminata:

Per cambiare il colore di questa zona, bisogna agire sul nostro computer, in quanto è dipendente da una opzione settata nelle nostre proprietà Desktop del pc. Cliccate sul vostro Desktop con il tasto destro del mouse e scegliete Properties (Proprietà):

Vi apparirà la seguente finestra nella quale dovrete andare nella scheda (tab) Appearance:

La freccia rossa indica la scheda su cui dovete andare, la freccia verde indica il tasto che dovete premere per accedere alle opzioni avanzate; cliccando su Advanced, si aprirà la seguente:

Selezionate Application Background (indicato dalla freccia verde) e poi andate a cliccare su color 1 (cerchiato di rosso); nella finestrina che vi si aprirà potrete modificare il colore del vostro Photoshop scegliendo il colore che preferite:

Il colore predefinito in Photoshop (quello a cui siamo abituati) è indicato dalla freccia nera, nulla vi impedisce però di scegliere i colori più strani. Scelto il colore giusto, cliccate prima su Ok, poi su Apply (applica) e poi ancora su Ok. Se avete fatto tutto correttamente, avrete modificato il colore della vostra area di lavoro (workspace color) che adesso potrebbe essere così:

Spero che adesso sia tutto più chiaro .

Tanto per cominciare, create un nuovo file (File —> New) e settate le impostazioni come preferite; nel mio caso ho scelto le misure che vedete sotto e come sfondo (Background Contents) ho messo White (poiché sapevo già dove mettere la scritta: se non sapete dove andrà, mettete Transparent, così non sbaglierete mai):

Fatto questo selezionate lo strumento Testo (Horizontal Type Tool):

Ora date un’occhiata in alto dove ci sono le impostazioni del testo, io utilizzo il font Arfmoochikncheez 1.0, potete scaricarlo dal sito 1001fonts.com a questo indirizzo (è freeware):

La freccia rossa indica il pulsante da premere per selezionare il font, la freccia verde il colore iniziale del testo ed infine la parte evidenziata in verde indica la finestrina per modificare la grandezza del testo (nel mio caso 80pt, ma dipende da come la volete voi).

Fatto questo cliccate con il tasto sinistro del mouse nell’area di lavoro ed appena vi apparirà l’indicatore lampeggiante, scrivete quello che desiderate (nel mio caso carlosweb):

Una volta scritto il tutto, andiamo a cliccare con il tasto destro sopra il livello testo (text layer) e scegliamo Blending Options…:

La freccia verde indica un pulsante che potete cliccare e che vi porta all’aggiunta di stili (cliccandolo, potete scegliere ovviamente le Blending Options…)

Bene, adesso dobbiamo modificare tre parametri, ed in particolare Drop Shadow, Bevel and Emboss e Gradient Overlay:

DROP SHADOW

Non c’è molto da dire, dovete soltanto impostare i parametri come nell’immagine.

BEVEL AND EMBOSS

Anche qui non dovete far altro che impostare i valori come nell’immagine e costruire la mappa del Gloss Contour: dovete cliccare sopra l’immaginetta e creare i quadratini cliccando sulla linea per poi modificare i valori di input output. I valori che ho inserito io, sono approssimativi (nel senso che ci possono essere piccole differenze e il risultato non cambia), cercate di fare una linea simile a quella.

GRADIENT OVERLAY

Qui le cose da dire sono: gli indicatori di opacità (freccettine in alto), sono posizionati in Location 0%, 41% e 100% con opacità pari al 100% per tutti e tre (per crearli dovete cliccare sopra il gradiente stesso, dove vedete scritto Click to adda a stop). Per quanto riguarda i due colori sono in Location 0% e 100%. Queste impostazioni le potete modificare a vostro piacimento cliccando nella finestrina del gradiente (indicata dalla base della freccia rossa).

E’ tutto ! Giocate con i colori del gradiente per ottenere scritte davvero belle!!

Ma che cosa sono questi “brushes”? In sostanza sono dei pennelli che potete utilizzare quando selezionate l’apposito strumento; quando cliccate su Brush Tool, vi appare in alto a destra una finestrina in cui potete scegliere la forma del brush. Ad ogni forma corrisponde un tratto del pennello. I pennelli possono essere anche creati, ma di questo ne parleremo magari in un altro post. L’utilità dei brushes, risiede nel fatto che permettono di “disegnare” o tracciare forme che magari sono state estrapolate da foto o da disegni e che di conseguenza non sareste in grado di rifare. Nel sito designfruit, ho scaricato i seguenti: Japanese Foliage e Fresh Foliage Part I. Dopo li ho messi nella cartella in cui ho i pennelli di Photoshop ed in particolare in:

Dopo averli messi in questa cartella aprite il vostro programma preferito (Photoshop!) e create un nuovo documento andando su File —> New e mettete le misure che preferite, io ho messo 450×300:

Dopo aver cliccato su Ok, selezionate lo strumento Brush Tool:

Se cliccate nella freccettina a destra della scritta Brush indicata dalla freccia rossa, vi apparirà il seguente menù:

La freccia rossa indica il tasto che dovete cliccare per accedere ad altre opzioni tra cui c’è quella che utilizzeremo e che è Load Brushes…; la freccia blu invece punta all’indicatore che dovrete far scorrere a destra o a sinistra a seconda che vogliate aumentare o diminuire la grandezza in pixel del pennello. Cliccate su Load Brushes e poi cercate uno dei due brushes che abbiamo precedentemente salvato dentro la cartella …\Adobe Photoshop CS2\Presets\Brushes\ e fate click su Load. Io ho caricato Fresh Foliage Part I. Dopo che Photoshop avrà caricato il set di pennelli, potrete vederli scorrendo verticalmente la finestra:

I brushes selezionabili sono quelli che vedete scorrendo la barra nella direzione della freccia verde; è probabile che siano troppo grandi per la vostra area di lavoro, quindi come vedete dalla freccia blu, ho diminuito il brush che ho scelto da 2500px a 506px, l’anteprima la vedete nell’immagine qua sopra a destra. Se volete cambiare colore, fatelo cliccando nella casellina indicata dalla freccia rossa. Quando siete pronti fate click con il mouse sopra l’immagine ed ecco il risultato:

Oppure aggiungendo qualche thunder effetto:

Vi invito a sperimentare altri brush perché oltre ad essere veramente utili, spesso sono anche molto belli. Se ne cercate altri, sappiate che qui ce ne sono alcuni, ma se provate a cercare su internet ne trovate davvero un’enormità!

Read this tutorial in English language

Leggi questo tutorial in lingua Inglese

Apro questa categoria dedicata all’approfondimento del programma “fratello” di Photoshop, e cioè ImageReady. Questi tutorial sono fatti in collaborazione con PhotoshopExpert.it, e se la grafica è la vostra passione, non vi resta che visitarlo .

Bene, ma ora passiamo al tutorial vero e proprio: creeremo un’animazione testuale che appare e scompare in maniera non brusca, ma bensì attraverso una dissolvenza costante. Tanto per cominciare, utilizziamo Photoshop per creare quello che desideriamo (in questo caso una scritta), poi cliccheremo sul tasto passa ad ImageReady:

Ecco la scritta

Ed ecco il tasto per passare ad ImageReady

Una volta che il programma si sarà aperto, assicuratevi di avere aperta la finestrina delle animazioni visualizzata nell’area di lavoro, per esserne sicuri, andate nel menù Window ed assicuratevi di avere spuntata la voce Animation:

Appena attiverete la finestra ecco cosa vi si aprirà:

La freccia rossa indica il primo frame dell’animazione. L’effetto che vogliamo dare è semplice, ma le cose devono essere fatte con ordine: cliccate sul tasto Duplicate current frame per duplicare il frame iniziale

Quando avrete cliccato, vi si aggiungerà un altro frame (con numero 2) alla vostra animazione; questo è uguale al primo. Cliccate su questo nuovo frame per selezionarlo e andate nella finestra livelli (layers): qua dovrete diminuire l’opacità del livello della scritta fino all’80%

Ora dovete ripetere questo procedimento: duplicare il frame corrente e scalare l’opacità ancora del 20% e poi ripetere ancora fino ad arrivare al passaggio in cui dovete impostare 0% (io vi consiglio di mettere al posto di 0% un 10%). Poi ovviamente dovrete duplicare ancora i frames stavolta aumentando di 20% a volta fino all’80% (infatti il 100% ce l’ha già il primo frame e il ciclo è impostato su forever (per sempre):

Nell’immagine qua sopra l’animazione è formata da 10 frames, con i seguenti valori di opacità:

1 —> 100%, 2 —> 80%, 3 —> 60%, 4 —> 40%, 5 —> 20%, 6 —> 10%, 7 —> 20%, 8 —> 40%, 9 —> 60%, 10 —> 80%.

La freccia rossa indica che l’animazione si ripeterà all’infinito (se non è impostato su forever, cliccate e mettete su forever). Ho inoltre evidenziato in violetto la parte relativa al delay (ritardo tra un frame e l’altro in secondi); se volete modificare questo valore, cliccate sulla freccetta presente in basso a destra su ogni fotogramma:

Le frecce rosse indicano i tasti con i quali potete vedere in anteprima l’animazione (tasto centrale) e scorrere i frame a destra o a sinistra.

Tutto qui , questi sono due risultati lasciando un ritardo di 0 secondi nel primo, e di 0.2 secondi in quello successivo:

Per salvare l’animazione andate su File —> Save Optimized As…; otterrete un file con estensione .gif. Buon divertimento!