salta alla navigazione

Creare scritte 3D con Illustrator Luglio 13, 2007

1 Star2 Stars3 Stars4 Stars5 Stars (3 votes, average: 5 out of 5)
Loading ... Loading ...
Inviato da Carlos in : Fondamenti (che parolona), Grafica, Illustrator CS2, Tutorials , trackback
Potete vedere il video del tutorial a questo indirizzo (you can view video tutorial at this link):
VIDEO TUTORIAL

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…):

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):

type tool
Cliccate sullo Strumento Testo

font
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:

selection
Cliccate sul Selection Tool

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

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

arc

Nella finestra che vi apparirà impostate i seguenti valori:

warp

Ecco come dovrebbe apparirvi il testo:

textwarp

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

ex&bav

Nelle regolazioni impostate Extrude Depth a 30pt:

extrude

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

expappearence

after

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:

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):

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:

gradient

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:

out

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:

eyedropper

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

out grad

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

end

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

end1

Altri articoli che potrebbero interessarti:

Commenti»

1. giuly - Luglio 13, 2007

davvero bello

2. Andrea Opletal - Luglio 17, 2007

domanda ?

lavori con il Mac tu?

3. Carlos - Luglio 17, 2007

No, purtroppo ancora no :(
Questo è il buon Windows XP :P

4. Dogdav - Luglio 19, 2007

hai mai pensato di usare andhe 3ds max? anche li si fanno bei lavori di grafica..

5. Carlos - Luglio 22, 2007

Già ma è un programma enorme e con tante altre opzioni che la semplice scrittura di testo 3d :)
Forse un giorno..

6. Marcoz - Luglio 24, 2007

carlos faresti 1 tutorial x rendere le immagini a fumetto?? vorrei fare 1 video sullo stile di questo http://www.youtube.com/watch?v=pHnoG3hoO3Q , con immagini a fumetto. GRAZIE (se possibile è, nn è urgente!!)

7. Carlos - Luglio 24, 2007

Effetti come quello probabilmente sono fatti con ampie conoscenze di vettorializzazione in illustrator o disegnati a mano da qualche fumettista; ricrearli con il software non è molto semplice :(
Comunque se riesco ad ottenere un simile effetto stai tranquillo che un tutorial ci scappa :D
Ciao

8. Marcoz - Luglio 25, 2007

grazie carlos!!! infinatamente!! anche perchè qualcuno m aveva dtt k c’erano dei filtri particolari da applicare, ma io nn ne trovo :| bo…!

9. Marcoz - Luglio 25, 2007

x l’esattezza mitico carlos, intendo l’effetto della terza e ultima figura del viso della ragazza in qst foto http://www.melissaclifton.com/images/tutorials/popart/popheader.jpg

spero che tu abbia capito meglio ora!!! a presto!!

10. Carlos - Luglio 25, 2007

Capito benissimo :D

11. Marcoz - Luglio 26, 2007

ecco ora ho trovato proprio qll ke cercavo:
http://tn3-2.deviantart.com/fs18/300W/f/2007/148/f/7/Chloe_Sullivan_by_Tenaga.jpg
+ o - è proprio così ke la vorrei!!! se è possibile, te ne sarei grato.
le tue guide sono così dettagliate e ricche che è impossibile non riusciure nell’impresa!! bravo, davvero!!

12. Tenaga - Agosto 14, 2007

quel disegno è mio XDD

saluti a tutti!

13. leonardo - Agosto 14, 2007

dodo .t$…?

14. Carlos - Agosto 14, 2007

@ Tenaga:
A quale disegno ti riferisci???

@ leonardo:
complimenti per la semplicità del messaggio O_o

15. Tenaga - Agosto 15, 2007

questo di Chloe Sulivan,è della mia galleria

http://tn3-2.deviantart.com/fs18/300W/f/2007/148/f/7/Chloe_Sullivan_by_Tena

16. Carlos - Agosto 22, 2007

ah è vero :D, complimenti bel lavoro!

17. Marcus - Agosto 29, 2007

noto molte somiglianze:
http://www.ndesign-studio.com/resources/tutorials/3d-logo/

18. Carlos - Agosto 29, 2007

Si, io ne noto molte altre anche qui:

http://grafica.html.it/guide/lezione/600/modellazione-3d-prima-parte/

qui:

http://www.illustratortechniques.com/3d-text-effect.html

e qui:

http://www.designershelp.com/articles/1/1/Easy-3d-Text-Illustrator-Tutorial/Page1.html

e potrei continuare all’infinito.

E’ come se io ti chiedessi di scrivere un articolo che tratta della storia d’Italia e ti dicessi che trovo molte somiglianze con un libro di storia..

Credo che sia impossibile fare qualcosa che altri non abbiano già fatto; quello che distingue una fonte da un’altra è il come viene trattato l’argomento.

Ciao

19. carlosweb.net - Tutorial Photoshop, Grafica, Computer » Blog Archive » Trasformare una foto in fumetto: ovviamente con Photoshop ;) - Gennaio 31, 2008

[...] post nasce dalla gentile richiesta di un lettore del blog chiamato Marcoz; egli ha più volte chiesto come fosse possibile ottenere un effetto cartoon un po’ [...]

20. Andrea - Febbraio 22, 2008

credo di essere l unico che ha seguito il tutorial ma non è riuscito :(

21. Carlos - Febbraio 23, 2008

Ciao Andrea, che problema hai avuto? Se provi a spiegarcelo cerchiamo di aiutarti :)

22. Cristian - Febbraio 25, 2008

ciao Carlos!un domanda…la scritta carlosweb in alto nel banner del sito l’hai fatta con illustrator?!

23. Cristian - Febbraio 25, 2008

moooooooolto piu facile impostare i colori del gradiente in photoshop!!!!!!!!!

24. Carlos - Febbraio 28, 2008

Ciao Cristian, no la scritta 3d è fatta con Xara 3D:

http://www.xara.com/downloads/xara3d/

Poi è stata sistemata con Photoshop ;)

25. Mauro - Marzo 31, 2008

Ciao! io usa illustrator cs3 in italiano e non riesco a trovare il comando wrap > arc..

26. Carlos - Aprile 22, 2008

Ciao e scusa per il ritardo della risposta :(

Il comando che cerchi è sotto Effetto>Altera>Arco…

Ciao