Vai al contenuto
Xeone

Inchiostrazione Digitale

Recommended Posts

Premesso che ci sono molti modi e programmi per ottenere un'inchiostarzione digitale, questo tutorial tratterà l'argomento utilizzando alcuni strumenti base di Illustrator, in questo caso nella versione 10, ma sostanzialmente invariato anche con versioni precedenti o successive.

Per il soggetto mi sono ispirato ad un eroe dell'infanzia, riportatomi alla mente da un disegno di Nduul di qualche tempo fa.

Bando alle ciance e andiamo ad iniziare.

1 Come prima cosa prepariamo il nostro disegno da inchiostrare. In questo caso non è importante che l'immagine sia pulita, lo sarà l'"inchiostro" che otterremo a fine tutorial. (Con tanto di macchia sul vetro dello scanner! :D )

tutorial_1.jpg

2 In Illustrator creiamo un nuovo documento. Possiamo scegliere le dimensioni che preferiamo (il file risultante sarà un vettoriale, quindi non ci sono problemi di risoluzione/dimensioni) oppure lavorare con la stessa dimensione del prodotto finale.

Dal menù "FILE" scegliamo "INSERISCI".

tutorial_2.jpg

3 Questo farà aprire una finestra di dialogo dove possiamo andare a scegliere l'immagine da tracciare e alcune opzioni sul suo inserimento, nella fattispecie COLLEGA e TEMPLATE

tutorial_3.jpg

4 Scegliendo l'opzione COLLEGA l'immagine viene posizionata sul livello corrente. Come dice la parola stessa in realtà è un collegamento all'immagine reale, pertanto se salvate il file di Illustrator e poi eliminate l'immagine, andandolo a riaprire vi chiederà il collegamento. E' possibile INSERIRE effettivamente l'immagine all'interno del documento semplicemente togliendo la spunta alla casella COLLEGA, ma questo comporta un'aumento delle dimensioni del file che viene salvato.

Scegliendo invece TEMPLATE l'immagine viene posizionata automaticamente su un livello bloccato al di sotto del livello corrente, leggermente più chiara e pronta per essere inchiostrata.

In questo caso io ho scelto la prima opzione, in realtà per un lavoro come questo non ho trovato differenze sostanziali tra le due varianti.

tutorial_4.jpg

5 Come si vede nell'immagine è comunque semplice gestire i livelli, e abbastanza simile alla loro gestione in Photoshop. Sul livello uno ho inserito il disegno a matita e l'ho bloccato (click sul quadratino grigio accanto all'occhio nella palette dei livelli, compare il lucchettino). Poi ho creato un nuovo livello sopra di questo. Facendo doppio click su nome di un livello si apre la finestra delle sue proprietà. Da qui possiamo cambiare nome, colore (il colore delle tracce quando vengono selezionate) e tipologia di livello (template, bloccato ecc.). Nel nostro caso il livello è rimasto con le impostazioni di default tranne il nome che ho cambiato in "INK".

tutorial_5.jpg

6 Preparato il livello è ora di pensare al pennello. Come in Photoshop è possibile crearsi i propri pennelli, qui in maniera addirittura più semplice, basta creare una forma e trascinarla all'interno della palette pennelli. Ma anche in questo caso è sufficiente modificare uno dei pennelli che troviamo disponibili di default. Facendo doppio click sull'icona di un pennello(1) facciamo aprire la finestra delle proprietà dello stesso. Per creare un pennello adatto all'inchiostrazione in linea di massima dobbiamo considerare un pennello di forma leggermente ellittica (2) e con la variazione delle dimensioni gestita tramite il controllo della pressione della tavoletta(3). N.B. questi valori possono essere modificati anche dopo aver iniziato il lavoro, in questo caso il programma ci chiederà se vogliamo applicare le modifiche anche ai tratti già tracciati o meno.

tutorial_6.jpg

7 A questo punto possiamo a ripassare i tratti. Nella palette principale degli strumenti selezioniamo lo strumento pennello e il colore della traccia (i due quadrati evidenziati gestiscono il colore di riempimento ed il colore di traccia. In questo caso il colore di riempimento va necessariamente tolto). Iniziamo pure a fare i primi tratti ed eventualmente approfittiamo per gestire dimensioni, e proprietà del pennello. N.B. è comunque possibile, ad inchiostrazione ultimata, selezionare e modificare qualsiasi tratto.

tutorial_7.jpg

8 Man mano che ci avviciniamo al completamento del lavoro possiamo disattivare la visualizzazione del livello contenente la traccia a matita semplicemente cliccando sull'iconcina a forma di occhio di fianco al livello stesso. In questo modo possiamo identificare più facilemente eventuali "magagne" nel nostro disegno e correggerle.

tutorial_8.jpg

9 Ad esempio in questo caso ho scelto di unire i due tratti che avevo tracciato per delimitare il lato sinistro del torso e lo stacco tra coscia e pannolino. Per fare questo abbiamo bisogno dello strumento di selezione diretta, la freccetta bianca che troviamo in alto nella palette strumenti (attenzione, questo strumento possiede due modalità, quella normale presente di default nell'interfaccia e la versione "strumento selezione gruppo" identificabile da un piccolo segno +, a noi serve la prima modalità)

tutorial_9.jpg

10 Per mostrare meglio l'unione ho scostato leggermente le due estremità dei tracciati selezionando solo i punti terminali.

(I punti di un tracciato sono rappresentati da quei piccoli quadratini, quadratino pieno = punto selezionato, quadratino vuoto = punto non selezionato. Tenendo premuto Shift si può cliccare su altri punti per aggiungerli alla selezione, oppure sottrarli tenendo premuto Ctrl.)

Una volta selezionati i due punti estremi (NB si possono unire solo 2 punti in questo modo) apriamo il menù Oggetto>tracciato>unisci tracciato, o più semplicemente la scorciatoia da tastiera Ctrl+j

tutorial_10.jpg

11 Un altro modo per modificare i tracciati, oppure per crearli, è tramite lo strumento pennino. Questo funziona come l'omonimo strumento di Photoshop, tramite le amate/odiate curve di Bezier.

Anche questo strumento prevede funzioni multiple, alle quali possiamo accedere tenendolo premuto. Il pennino di default ci permette di disegnare dei punti in sequenza (se creiamo un tracciato formato da un minimo di tre punti possiamo creare l'ultimo di questi in corrispondenza del primo e ottenere quindi una forma perfettamente chiusa. Utile per i riempimenti). Abbiamo poi i due pennini per aggiungere e togliere punti da un tracciato esistente, identificati dal segno + e – rispettivamente. Ed infine lo strumento "converti punto di ancoraggio" che ci permette di modificare/inserire le maniglie di controllo su di un punto già creato.

Due piccole note: se con il pennino di default ci posizionamo su di un punto di un tracciato che non sia uno dei due estremi, il puntatore diventerà temporaneamente lo strumento di sottrazione punti.

Quando creiamo un tracciato possiamo iniziare da un lato, interromperci, deselezionare il tracciato e poi riprendere in seguito, anche dalla parte opposta, semplicemente cliccando con il pennino su uno dei due punti estremi.(parlando ovviamente di un tracciato aperto).

tutorial_11.jpg

12 Di ogni linea possiamo modificare lo spessore assegnando un pennello diverso dalla palette pennelli oppure intervenendo sui valori di traccia. Cliccando due volte sulla tab "traccia" otterremo l'espansione della stessa dove possiamo impostare ad esempio gli angoli smussati per le linee che creiamo o il tratteggio delle stesse.

tutorial_12.jpg

13 Tornando all'unione di punti possiamo notare che, nel caso i due punti siano sovrapposti, invece di creare un segmento come nel caso precedente, il programma ci chiederà se vogliamo creare un angolo vivo o arrotondato (e qui entrano in gioco le impostazioni di angolo della palette "traccia" di cui parlavo prima)

tutorial_13.jpg

14 A questo punto, con "l'inchiostrazione" sistemata a dovere possiamo decidere di esportare il nostro disegno e colorarlo ad esempio in Photoshop. Anche per questo possiamo adottare un paio di metodi diversi, il sistema che preferisco consiste nel crearsi in Photoshop un documento delle dimensioni desiderate e fare un semplice copia/incolla direttamente da Illustrator. Photoshop ci chiederà in che "forma" vogliamo inserire i nostri dati (pixel, tracciati, ecc.), selezioniamo pixel e il programma rasterizzerà il tutto ponendolo su di un livello suo e noi possiamo iniziare ad impiastricciarlo con i colori (magari lo vedremo in un altro tutorial). Con il sistema alternativo, invece, da Illustrator andiamo sul menù File>Esporta e scegliamo il formato che più ci aggrada, mettendo ad esempio TIF ci verrà chiesto anche quanti DPI dovrà avere l'immagine.

N.B. con i disegni per ora non mi è mai capitato, ma andando ad esportare immagini particolarmente grandi o complesse (chessò... un impaginato per un depliant, una locandina) c'è la possibilità di non ottenere nulla (un messaggio di errore nel caso migliore, un crash in quello peggiore)

Ma dato che siamo qui vediamo anche una colorazione veloce, sempre con Illustrator.

Semplicemente in questo caso creiamo un nuovo livello al di sotto di quello "INK" (che andremo a "lucchettare") e iniziamo a seguire i contorni con lo strumento pennino, stando attenti a rimanere all'interno della traccia nera (niente paura, possiamo aggiustare le sbavature in seguito con i sistemi visti sopra) e a chiudere ogni area. Ad ognuna di queste poi assegneremo il colore di riempimento che vogliamo e nessun colore per la traccia.

tutorial_14.jpg

15 Vediamo anche un'altra funzione. Ogni singolo oggetto in Illustrator viene gestito come se fosse creato su un sotto-livello. Per capirsi: creiamo il livello "Colore" e all'interno di questo disegnamo due quadrati, cliccando sulla freccetta grigia a fianco del nome livello possiamo vedere che al suo interno ci sono due sotto livelli contenenti ciascuno un quadrato. Da qui possiamo organizzare l'ordine di sovrapposizione degli oggetti all'interno dell'immagine, quello che sta sotto nello stack, sta sotto nella visualizzazione. Per quanto comodo, questo può diventare un metodo complicato quando abbiamo tanti oggetti (tracciati, forme, tratti) nella scena. Nel mio caso ad esempio mi sono accorto di aver tracciato per primo il riempimento della "P" sul torace e poi quello dell'area circostante, andando a coprire il primo tracciato. Senza ammattire a cercare il riempimento della "P" nello stack (dove tutti gli oggetti vengono chiamati automaticamente <tracciato>) sono entrato in modalità "contorno" (Ctrl+Y o menù Visualizza>modalità contorno. Premere di nuovo per tornare in modalità normale), ho selezionato il riempimento che volevo stesse sopra e dal menù Oggetto>Ordina gli ho dato il comando "Porta in primo piano". Le funzioni degli altri comandi di questo menù sono semplici da capire, "primo piano" e "sotto" posizioneranno la vostra selezione completamente davanti o dietro a tutti gli oggetti, mentre "avanti" e "dietro" terranno conto di eventuali oggetti intermedi.

tutorial_15.jpg

16 Parlando di selezione invece, uno strumento che può esserci utile è la selezione "simile". Dal menù Selezione>simile possiamo accedere ad una serie di comandi che ci permetteranno di selezionare, ad esempio, tracciati accomunati dallo stesso spessore di traccia, colore di riempimento ecc. ecc. In questo caso l'ho utilizzato per selezionare in una sola volta tutti i pezzi rossi della tuta per variarne leggermente il colore.

tutorial_16.jpg

17 Per rendere un po' più gradevole l'illustrazione ho deciso di fare un veloce effetto di Cel shading, ottenuto semplicemente disegnando, sempre con il pennino, le varie ombreggiature e assegnandogli un colore un poco più scuro di quello base. A completamento del tutto una bella ombra "blob" che evita l'impressione di "svolazzamento" di un personaggio colorato sulla tavola completamente bianca e una firmettina ;)

tutorial_17.jpg

18 La stessa immagine mostrata in modalità contorno per far vedere come con pochi tracciati sia possibile realizzare una cosa simile.

tutorial_18.jpg

Buona inchiostrazione!!! :hello::hello:

Giulio

post-3829-1140088832_thumb.jpg


Modificato da gurugugnola

Condividi questo messaggio


Link al messaggio
Condividi su altri siti

Complimenti,ottimo tutorial,scritto molto bene (e finalmente un tutorial "tradizionale":non so perchè ma i

videotutorial cominciano a starmi sulle p***e! :P

Cmq simpaticissimo il personaggio,viene voglia di farlo in 3d... :rolleyes:

:TeapotBlinkRed:

Condividi questo messaggio


Link al messaggio
Condividi su altri siti
Complimenti,ottimo tutorial,scritto molto bene (e finalmente un tutorial "tradizionale":non so perchè ma i

videotutorial cominciano a starmi sulle p***e! :P

Vedo che non sono l'unico!!! :Clap03::Clap03:

Comunque ottimo... proverò a rifarlo con il fidato CorelDRAW ;) ... e vedo che qui si ritorna un'altra volta a un soggetto per gli over 25 :D

Condividi questo messaggio


Link al messaggio
Condividi su altri siti

@Guru Grazie, spero possa anche essere utile ai vari frequentatori della sezione 2D

@Pillus se decidi di rifarlo in 3d fammi un fischio, magari ti butto giù un paio di reference. (Avevo anche pensato ad un paio di redesign più seriosi per un vecchio concorso di CGChat ma per ora sono rimasti nel cassetto

@Macphisto ehehe sai com'è..... ormai mi manca qualche mese per entrare a pieno titolo negli "'enta" tendo a cadere in nostalgia... :crying:

Condividi questo messaggio


Link al messaggio
Condividi su altri siti
(pillus @ Feb 16 2006, 12:28 PM)

Complimenti,ottimo tutorial,scritto molto bene (e finalmente un tutorial "tradizionale":non so perchè ma i

videotutorial cominciano a starmi sulle p***e!

Vedo che non sono l'unico!!!

Anche io nn li sopporto!! :D

Complimenti!!! Ottimo Tutorial!!!!

:Clap03::Clap03::Clap03:

:TeapotBlinkRed::TeapotBlinkRed::TeapotBlinkRed:


Modificato da Thedonmakaveli

Condividi questo messaggio


Link al messaggio
Condividi su altri siti
@Macphisto ehehe sai com'è..... ormai mi manca qualche mese per entrare a pieno titolo negli "'enta" tendo a cadere in nostalgia... :crying:

Mica s'era capito... poveretti chi non se ne sono accorti!! :devil:

Condividi questo messaggio


Link al messaggio
Condividi su altri siti

Bel tutorial!

non vorrei aver letto male, ma per i riempimenti, se i tracciati sono chiusi, non possono essere fatti selezionando la casella riempimento senza ripassare tutto?

Condividi questo messaggio


Link al messaggio
Condividi su altri siti
Bel tutorial!

non vorrei aver letto male, ma per i riempimenti, se i tracciati sono chiusi, non possono essere fatti selezionando la casella riempimento senza ripassare tutto?

Si se i tracciati sono chiusi puoi anche selezionare la casella riempimento, solo che in quel modo non hai più la traccia di inchiostro da poter gestire separatamente. (Il tutorial è principalmente volto all'inchiostrazione, la colorazione è un piccolo extra in questo caso). Inoltre puoi aver bisogno di un riempimento in due o più colori in un area e quindi dovresti ricorrere a tracciati aggiuntivi comunque. (A meno di non usare sfumature o altro che però non sempre danno l'effetto desiderato).

Condividi questo messaggio


Link al messaggio
Condividi su altri siti

Per chiudere definitivamente il problema sollevato da Simmons: Illustator non ha quindi uno strumento riempimento analogo a photoshop? non sono mai riuscito a venirne a capo, tanto che mi ritrovo costretto ad usare Flash per il riempimento, per non perdere il formato vettoriale! Illustrator è eccezionale, ma questa cosa proprio non la digerisco!

ciaociao

Condividi questo messaggio


Link al messaggio
Condividi su altri siti

Il "secchiello" c'è anche in illustrator ma funziona diversamente, con questo praticamente ti imposti i colori di traccia e riempimento e li applichi a tutti i tratti che vuoi, ma non fa un riempimento vero e proprio, non nel senso in cui lo fa flash (che gestisce separatamente traccia e riempimento).

Condividi questo messaggio


Link al messaggio
Condividi su altri siti

complimenti per il tutorial, chiaro e con un magnifico esempio caro a chi ha più di 26 anni :Clap03: :Clap03: :Clap03:

@angel1981

questo forum si regge anche sulla presenza dei tutorial in rete; se li si converte in pdf vengono meno alcuni dei presupposti su cui si basa questa comunità ovvero la partecipazione

uno arriva; imbraccia il suo downloader di fiducia, si scarica tutti i pdf in un colpo solo e ciao ciao treddi :hello:

Condividi questo messaggio


Link al messaggio
Condividi su altri siti
@angel1981

questo forum si regge anche sulla presenza dei tutorial in rete; se li si converte in pdf vengono meno alcuni dei presupposti su cui si basa questa comunità ovvero la partecipazione

uno arriva; imbraccia il suo downloader di fiducia, si scarica tutti i pdf in un colpo solo e ciao ciao treddi :hello:

Effettivamente hai ragione, anche se in pdf è più semplice seguire tutti i passaggi perchè si potrebbero stampare o semplicemente tenere in archivio sul pc, poi la partecipazione per chi è davvero interessato all'argomento ci dovrebbe essere in ogni caso, inoltre volendo il pdf si potrebbe mettere solo quando il tutorial è terminato nello specifico topic...ihihihi :lol:

comunque se non si può non è un problema ^_^ la mia partecipazione ci sarà sempre, perchè voi siete i miei amichetti virtuali! ;)

:hello: ciao, Adele

Condividi questo messaggio


Link al messaggio
Condividi su altri siti

Crea un account o accedi per commentare

Devi essere un utente per poter lasciare un commento

Crea un account

Registrati per un nuovo account nella nostra comunità. è facile!

Registra un nuovo account

Accedi

Hai già un account? Accedi qui.

Accedi ora

  • Navigazione recente   0 utenti

    Non ci sono utenti registrati da visualizzare in questa pagina.

×