Adobe Illustrator Tutorial ITA
Ciao a tutti, in questo tutorial andremo a vedere come fare un personaggio in Adobe Illustrator per poi importarlo in Adobe Animate. Il seguente tutorial è adatto a chiunque, e il mio scopo è renderlo accessibile sia a chi ha 6 anni sia agli studenti universitari o agli anziani hobbysti. Detto questo, cominciamo!
Ma prima di tutto, alcuni di voi si staranno chiedendo: ma dove sono gli altri tutorial di Adobe Animate e Adobe Illustrator? è presto detto, eccoli qui!
Adobe Illustrator: Tutorial sulle maschere di ritaglio
Adobe Animate: Introduzione e Simboli
E invece, ecco qui il disegnino semplice (quello che conta è la silhouette) che andrò a trasformare in un personaggio vettoriale:

Potete salvarlo sul vostro computer. Nello specifico andremo a fare le seguenti parti del corpo: – testa separata dal corpo, braccia, gambe, dita e piedi identici sia a destra che a sinistra e infine coda.
Lavoreremo con le forme e scopriremo come modificarle e spostarle di sopra o di sotto nella gerarchia. Lavoreremo su diversi livelli, ognuno per simbolo. Ora andiamo a creare il nostro foglio A4 senza abbondanze (ovvero senza “Pagina al vivo”). Io ho messo orientamento orizzontale.

Bene, adesso che il documento è aperto, facciamo File – Inserisci e andiamo a leggere l’immagine seguente:

Allora, spieghiamo meglio:
Dovremo lavorare con le forme primitive (rettangoli o ellissi). Tali forme verranno poi unite o con il metodo di Elaborazione tracciati (diviso a sua volta in “Metodi forma” ovvero 1) Unifica, 2) Sotto meno sopra, 3) Interseca e 4) Escludi e “Elaborazione tracciati” ovvero 1) Scomponi, 2) Togli, 3)Combina, 4) Ritaglia, 5) Contorno e 6) Sopra meno sotto)
E poi, beh, ho segnato l’immancabile tasto dei Livelli: clicchiamoci sopra!
Lascerò che siano le immagini a parlare… ma solo per poco!

Il lucchetto viene creato automaticamente una volta creato il template

Bene amici, adesso creiamo il livello 2 e clicchiamo il tasto “L” per richiamare a noi l’ellisse!

Il trucchetto da pro: per creare una qualsiasi forma, bisogna partire dal centro di essa, tenendo cliccato anche il tasto ALT!
Detto questo possiamo notare che lo sketch (sì, perché è di sketch che si tratta) del castoro è molto semplice. Si tratta di varie forme ellittiche che vanno a formare questo personaggio.
In generale i personaggi per l’animazione vengono creati con il linguaggio delle forme: ovvero CERCHI per i personaggi amichevoli, TRIANGOLI per i personaggi malvagi o comunque che incutono timore e QUADRATI per i personaggi stabili, che infondono sicurezza.
Ritorniamo alle nostre immagini parlanti…


Tenendo premuto solo il puntino bianco su cui ho disegnato la freccetta, alziamo questo bordo. Ora passiamo alla parte inferiore del corpo. Deselezioniamo la nostra ellissi cliccando sulla freccia nera (Strumento Selezione V) e andiamo a creare un’altra ellissi.


Ricapitoliamo: ruotiamo l’ellisse in basso, selezioniamo entrambe le forme e facciamo il metodo forma UNIFICA. Oppure possiamo usare Crea Forme.
Ora penso sia venuto il momento di dare un riempimento (con Opacità sempre a 100%, mi raccomando) al nostro castoro, quindi selezioniamo il riempimento vuoto e…coloriamolo! (Aumentando anche la traccia, se vogliamo)

Userò questo colore anche per la testa, le orecchie e tutte le zampe. Ora lucchettiamo il livello e creiamone uno nuovo. Chiamiamo pure questo Livello 2 “corpo”.
Adesso creo il braccio sinistro seguendo il metodo applicato prima. MA! In questo caso, copierò l’ellissi e la rimpicciolirò! Come si fa?



Cari bambini, cari ragazzi, cari lavoratori che fatturano TAAAAC, cari nonnini, cari fan della grafica… NON correte!!! Devo dirvi altre due cosette: quando cliccherete su Riflessione assicuratevi di avere “Verticale” e “Anteprima” selezionati, quindi cliccate su Copia!

Ora seguitemi bene: abbiamo copiato e riflesso l’arto “zampa”. Ebbene, prima di tutto, facciamo Modifica – Copia (Oppure CTRL+C), e creiamo un nuovo livello che andremo a posizionare sotto il livello “corpo”. Rinominiamo tale livello inferiore “zampa destra” e il livello superiore “zampa sinistra”, come in figura:


Ora, con tutti i trucchetti che abbiamo appreso finora, andiamo a creare la faccia (vuota, gli occhi li faremo dopo, come anche il naso). Vi lascio con la vostra intuizione. Se avete problemi, leggete di nuovo quanto è scritto fin qui!

Ora che abbiamo preparato la faccia del castoro, vedrete che ho anche preparato il livello “occhi” (dove andrò a mettere l’occhio sinistro, e, in un livello poi separato, metterò quello destro). Per creare la pupilla degli occhi useremo un metodo molto ma molto architettonico che mi è stato insegnato da un’amica. Ma intanto andiamo avanti e preoccupiamoci della… coda! Prepariamo un altro livello che posizioneremo sotto il livello del corpo
Fatto?!? disse Giovanni Muciaccia. Benissimo, allora creiamo partendo dal centro e tenendo premuto ALT una bella ellisse (che io chiamerò Elly l’Ellisse per omaggiare la mia gattina)! (Riempimento: nullo, traccia: 2pt)

Benissimo, ora deformiamola! Come? Bene, clicchiamo sulla freccina bianca e sul punto a destra/est e vedremo che…

Clicchiamo sul puntino che vogliamo spostare… io in questo caso non userò le maniglie, ma nessuno vi vieta di farlo!

Per il riempimento della coda, io metto questo colore: #5E4307 . Poi, con la freccina nera, la avvicino al corpo, ruotandola leggermente. Et voilà! (Non sto facendo la vanitosa -anzi detesto farla, è che mi piace la posizione)

Con il metodo usato per la coda, possiamo creare anche le orecchie (ognuna in un livello separato). Possiamo inoltre creare i baffetti (quelli a dx in un livello, quelli a sx in un altro), raggruppandoli però (facendo Oggetto – Raggruppa o semplicemente la scorciatoia Ctrl+G, prima per quelli a dx e poi per quelli a sx, tenendo dx e sx in un livello separato – repetita iuvant, chi vuole intendere intenda gli altri in camper!!!) oppure copiando il primo vettore, moltiplicandolo due volte e unendo i baffi in un unico elemento facendo poi Crea Forme (io userò entrambi i metodi).
So che magari sembra eccessivo ripetere, ma è importantissimo rispettare la gerarchia per evitare disguidi e confusioni poi!
Intanto, creiamo la gamba sinistra con il metodo Crea Forme (sempre livelli separati e blablabla – appare Greta Thunberg selvatica di livello 19!), la copiamo e riflettiamo. Poi, copiamo quella riflessa e in un nuovo livello (chiamato gamba dx) facciamo Modifica – Incolla nella stessa Posizione, cancellando poi la copia riflessa del livello della gamba sinistra.

Vi lascio creare le parti rimanenti (piedi, unghie delle mani, naso, occhi ancora senza pupille e orecchie). Aspettatemi che le creo anch’io, e poi faremo INSIEME il dentone del castoro (usando il rettangolo) e le pupille degli occhi.
Intanto un trucchetto! Potete copiare il vettore delle orecchie e riciclarlo per i baffi e le unghie!
Per i piedi, invece, vi consiglio di usare lo strumento Penna! (Scorciatoia:P)

Per usare lo strumento Penna, passatelo sopra l’area interessata, nel nostro caso, il piedino del castoro.
Poi, con la freccina bianca, andiamo a spostare i punti di ancoraggio della penna. Avete bisogno di più punti di ancoraggio? Cliccate +! Ne volete togliere alcuni? Cliccate su – !

Con lo strumento curvatura, poi, possiamo aggiungere dei punti per ammorbidire la forma generale, come nel “work-in-progress” in figura:

State molto attenti in questa parte, a un certo punto (è normalissimo) la forma vi sembrerà sgraziata: in quel caso potreste usare lo strumento arrotonda, o, come ho fatto io…


Il risultato adesso è molto più aggraziato di quando avevamo iniziato a creare la forma, dico bene?
Ora parliamo del naso: una semplice ellisse anch’essa di traccia 2 pt, ma per riempimento userò il seguente colore: #89490E.
Ed eccoci arrivati quasi alla fine… quasi, perché ci aspettano altri due trucchetti niente male!

Adesso, sotto il livello “Faccia”, creiamo un livello che chiameremo “dentone”, usando un rettangolo arrotondato sempre con traccia 2 pt. e con il riempimento bianco puro (#FFFFFF). (Potete richiamare l’impostanzione bianco riempimento e nero traccia cliccando sotto a sinistra della palette che avevate impostato, oppure semplicemente con “D” ovvero la scorciatoia per Default).
Scegliamo quindi lo strumento rettangolo con angoli arrotondati (sotto il Rettangolo “M”).

Bene, facciamo di nuovo i PRO con Alt, e creiamo la forma a partire dal centro. Poi spostiamola in corrispondenza del dentone e vedremo che…


E ora, diamo un’occhiata… agli OCCHI del nostro roditore! Io il mio occhio lo avevo preparato già arrivata a metà di questo tutorial, quindi si tratta soltanto di rendere visibile il livello e…

Ora dobbiamo fare Oggetto- Trasforma- Ridimensionamento e cliccare il punto con ALT che ci interessa ridimensionare:

Diamo le seguenti coordinate per il Ridimensionamento:

Ed ecco il risultato (ho riempito la pupilla di nero, codice colore #000000)!

Un po’ inquietante ma buffo…in ogni caso, raggruppiamo (Ctrl+G) occhio e pupilla, e poi, come prima lo copiamo e lo portiamo a destra su un altro livello.
Cestiniamo il “Livello 1” Template, ed…ecco qua il nostro castoro! Non ci resta che importarlo su Adobe Animate!

Apriamo quindi Adobe Animate e creiamo un documento HD (1280 x 720) con 24 fotogrammi al secondo.

Apriamolo e facciamo File – Importa- Importa nello Stage come di seguito, e importiamo il nostro file .ai

Vi si aprirà questa finestra che vedete qui sotto. Lasciamo Converti livelli in Livelli Animate e Collochiamo gli oggetti nella posizione originale, dopodiché clicchiamo Importa

Signori e Signore, Ladies and Gentlemen, Mesdames et Messieurs, ecco a voi il risultato! Ma i simboli non sono ancora pronti! Come fare?

Ora, cliccando su ogni parte una ad una, facciamo “Converti in Simbolo” (F8): vedrete che ogni simbolo avrà un pallino bianco al centro, come in figura.

Se per caso non sapete ancora cosa siano i simboli e come muoverli (ovvero: avete usato soltanto Illustrator ma non avete mai usato Animate prima d’ora), beh… qui c’è una lista in continuo aggiornamento con i miei tutorial di Adobe Animate, Illustrator, Photoshop, Autodesk Maya e scrittura creativa: non perdeteveli!
Alla prossima!