E’ da un pò di tempo che sul web va di moda il disegno a mano libera e uno delle carattarestiche più di tendenza utilizzate da molti web designer è lo Sketch Font, ovvero le scritte abbozzate, come fossero disegnate a mano libera.

Ma come si disegna un disegno a mano libera in digitale? Con quale strumento? E come applicare questa tecnica ad ogni tipo di font o oggetto che vogliamo?

Il tutorial di seguito spiega in semplicissimi passi come fare:

Effetto finale

Passo 1:

Aprire un nuovo documento 800×600 px in Illustrator. Creare una nuova casella di testo e inserire il testo con qualsiasi font vogliate, io ho utilizzato un font standard come Verdana. Aumentiamo la dimensione del font a 72px e lo rendiamo in grassetto (bold).

Passo 2:

Selezionare il testo ed eliminare riempimento e bordo del testo, praticamente rendiamo il testo trasparente andando a selezionare la trasparenza dal pannello del colore.

Passo 3:

Con il colore del bordo e riempimento in trasparenza andiamo a creare un nuovo livello da pannello “Aspetto”. Lasciando come colore di rimepimento il nero di default. Apparirà di nuovo la scritta.

Passo 4:

A questo punto selezioniamo il nuovo livello che abbiamo creato e aggiungiamo un effetto a quest’ultimo cliccando sulla voce in basso “fx”/Stilizzazione/Scarabocchio.

Passo 5:

Settiamo nella nuova finestra pop-up che viene fuori i seguenti valori, oppure deformiamo i valori in base alle nostre esigenze.

Passo 6:

Ora andiamo a disegnare il bordo attorno allo scarabocchio che rappresenta il nostro testo. Nel pannello “Aspetto”, clicchiamo su “Traccia” e impostiamo il valore a 2px.

Passo 7:

Ora tenendo il livello “Traccia” selezionato, andiamo a distorcerlo con un effetto. Quindi clicchiamo su fx/distorci e trasforma/contorni frastagliati. E impostiamo i valori come mostrato in figura.

Il nostro Sketch Font è ultimato. Ma come applicare questa tecnica su qualsiasi altro font o oggetto?

Semplicemente salvando lo stlie grafico (ovvero tutto il lavoro fantto fin ora) in modo da poterlo riutilizzare con un semplice click dove si vuole!

Quindi aprire il pannello “Stili Grafica” aggiungere un nuovo livello, in automatico verrà creato il nuovo stile.

..e quando lo si vuole utilizzare basta selezionare l’oggetto e fare click sullo stile appena creato. Come altri testi, con altri font, forme e oggetti.

Scarica il file Illustrator del tutorial:

Ti potrebbe interessare anche:

1. Nuovi font per un web più attraente! Ci pensa Google! Quante volte siamo stati vincolati dall’utilizzo dei soliti font compatibili per il web, perché gli unici permessi dallo standard  browser, a scapito del design del sito stesso. Infatti i...
2. Typography design e graphic design un mix d’effetto! Ecco un altro fantastico tutorial in Photoshop che ho voluto realizzare prendendo spunto da qualche pubblicità che ho visto in giro. E’ un esplosione di parole che vanno a...
3. Effetto su testo usando l’erbetta Questo tutorial ha l’obiettivo di rendere un semplice testo un po’ più creativo con l’aggiunta di una texture un po’ particolare! In pochi passi si può trasformare qualsiasi testo...