Progetta una scatola di cereali a tema vettoriale in Adobe Illustrator

Cosa starai creando

Il pasto più importante della giornata è Adobe Illustrator. Sono piuttosto sicuro che la colazione arriva secondo. In quanto tale, combineremo i due e renderemo omaggio alle scatole di cereali della nostra infanzia con questo design a cartoni animati.

1. Inizia con uno schizzo

Passo 1

È importante capire il personaggio centrale e il layout all'interno del tuo schizzo. Mi piace disegnare dentro Adobe Illustrator CC stesso (sebbene sia possibile importare anche uno schizzo). Usando il Pennello Strumento (B) con Fedeltà impostato Liscio nel Opzioni dello strumento pennello pannello e un valore predefinito Calligrafico pennello selezionato, ho disegnato un cartone animato eccitato e bloccato nel nome del cereale sopra di lui. 

Per una guida dettagliata su come disegnare le mani, dai un'occhiata a Cartoon Fundamentals: How to Draw Hands di Carlos Gomes Cabral.

Passo 2

Poiché si tratta di una scatola di cereali, non dimenticare di mostrare la ciotola di cereali. In questo caso, disegneremo (principalmente) pezzi di cereali a forma di O con il personaggio che salta fuori (o presenta) la ciotola (che è stata riempita fino all'orlo). Gruppo (Control-G) insieme le linee del disegno e bloccare il gruppo nel Livelli pannello, come li traccerai quando creerai il tuo progetto finale.

2. Forma la testa

Passo 1

Costruire ogni frammento di anatomia non è necessario in questo progetto. 

1. Inizia con il viso tracciando il tuo schizzo con il Strumento penna (P). 
2. La faccia comprende metà della testa e un orecchio. È possibile disegnare parti di esso (testa, mascella e orecchio) separatamente e Unire nel esploratore pannello.
   
3. Impostare il colore del tratto su marrone scuro per creare un contorno o Copia (Control-C) e Incolla (Control-V) la forma del viso, imposta il colore del riempimento e del tratto su marrone scuro, Peso del colpo a 2 pts, e Allineare dietro la faccia originale.
4. Disegna una piccola forma a D per l'altro orecchio, in una tonalità più scura (relativa a qualsiasi tonalità di carne che hai scelto) e posizionala dietro le altre forme della testa. Per maggiori informazioni su vari toni della pelle, dai un'occhiata a questo suggerimento.

Passo 2

1. Dopo aver scoperto i capelli durante la fase di disegno, ora posso semplicemente rintracciarlo con il Strumento Penna.  Pensa ai capelli come se fossero sezioni: frangette (frangia), lati e schiena. Se vuoi che il tuo design dei capelli sia un po 'più fluido, usa il Pencil Tool (N) per disegnarlo velocemente e arrotondare i bordi manipolando Angoli vivi.
2. Usando lo stesso tono di carnagione scura usato per l'orecchio, disegna una forma che imita i bordi dei capelli. Questo servirà a gettare un'ombra dai capelli sul viso. Posiziona la forma sotto i capelli nella Livelli pannello.
3. Non dimenticare una forma a C per l'interno dell'orecchio sinistro.

Passaggio 3

Il volto è in gran parte costituito da semplici forme combinate per formare un volto davvero, davvero eccitato.

1. Disegna due cerchi sovrapposti usando il Strumento ellisse (L). Se si imposta il colore di riempimento su null e il tratto sullo stesso marrone scuro utilizzato per i contorni, è possibile modificare la larghezza dei cerchi sui bordi esterni con Width Tool (Shift-W). La bocca, disegnata con il Strumento Penna, è come una gelatina laterale.
2. Il naso è come un punto interrogativo capovolto, o semicerchio con una piccola gamba su di esso.
3. Per la lingua, ho scelto un rosa chiaro e ho disegnato una forma che occupa la metà inferiore della bocca.
4. I denti sono forme curve che seguono il contorno della bocca.
5. copia e Incolla i cerchi creati per gli occhi e li riempiono di un azzurro. Assicurati che l'occhio sinistro si sovrapponga alla destra.
   

Passaggio 4

Continuando con gli occhi:

1. Disegna cerchi bianchi che si sovrappongono a quelli blu chiaro del passaggio precedente. Se selezioni il cerchio celeste e la sua controparte bianca sovrapposta, puoi usare il Strumento di creazione forme (Shift-M) per separare la parte non intersecante del cerchio bianco (selezionandolo), Deseleziona, e Elimina.
2. Utilizzare il Width Tool per aumentare la larghezza del tratto dell'occhio. In questo caso, I incollato il cerchio del contorno dal passaggio precedente e lo ha posizionato sopra le forme bianche e blu chiare che formano l'occhio destro.
3. Anche la bocca ha bisogno di un contorno. copia e Incolla la forma della bocca di base (quella lateralmente di gelatina) e impostare il colpo su 1 peso.
4. In modo che il naso non appaia trasparente, disegna un semicerchio e posizionalo sotto la linea del naso, ma sopra gli occhi nel Livelli pannello.
5. Aumenta anche il contorno dell'occhio sinistro e disegna due piccoli cerchi per le pupille degli occhi.
6. Usando il Strumento pennello, Ho disegnato due piccole sopracciglia e allargato loro sotto Oggetto.

Passaggio 5

Quando sei soddisfatto della testa del tuo personaggio dei cartoni animati, Gruppo tutto insieme. Per aggiungere un contorno più spesso attorno all'intera cosa (pur mantenendo quello disegnato in precedenza, che aiuta a definire dove finisce la testa e inizia a malapena l'orecchio a destra), copia, Incolla, e Unire la testa copiata in esploratore. Impostare il colore del riempimento e del tratto su marrone scuro e il peso del tratto su 2-3pts, dipende da cosa preferisci. Allineare la testa e la sua silhouette e Gruppo loro insieme. 

3. Aggiungiamo un corpo

Passo 1

Ancora una volta, la forma del corpo è stata individuata durante la fase di disegno.

1. Le sezioni del corpo sono le seguenti: due mani, due braccia, un collo, una camicia e l'interno della camicia. L'ho trovato più facile, per me, per copia, Incolla, e Riflettere il braccio sinistro (oltre a Asse verticale) per ottenere il braccio destro. L'ho ridimensionato e ruotato per adattarlo allo schizzo.
2. Usando la tecnica della sezione precedente, dare il collo e le braccia a 2pt peso schema.
3. Usando lo stesso tono di pelle scura usato nelle ombre sul viso, disegna le forme d'ombra per i palmi delle mani, sul collo e sulle braccia (dove vengono proiettate le ombre dalle maniche).

Passo 2

Utilizzare il Strumento Penna disegnare linee sulla camicia che denotano polsini, cuciture e colletto. Gruppo tutto insieme e ancora una volta, copia, Incolla, Unire nel il esploratore pannello, applicare un peso di corsa spesso alla forma e Allineare dietro il personaggio principale. Gruppo tutto questo insieme e passeremo a creare il resto del design della scatola.

4. Disegno di cereali tridimensionale

Passo 1

Disegna un cerchio all'interno di un grande cerchio usando il Strumento ellisse. Con entrambi selezionati, colpisci Fronte meno nel esploratore pannello. Seleziona la tua forma di ciambella piatta e vai a Effetto> 3D> Estrusione e smusso ... . Gioca con la rotazione o inserisci i seguenti dettagli per ottenere la stessa forma 3D di seguito:

• Asse X: 3 °
• Asse Y: 6 °
• Asse Z: -2 °
• Profondità di estrusione: 34 pt
• Superficie: Ombreggiatura plastica

Passo 2

Con la forma della ciambella 3D selezionata, vai a Oggetto> Espandi Aspetto. Utilizzare il Strumento di selezione diretta (A) per selezionare la faccia della forma di cereali e impostare il colore di riempimento su un'abbronzatura leggera. Seleziona tutto tranne la faccia dell'oggetto e imposta il colore di riempimento su un'abbronzatura più scura. Segui i passi da Sezione 3, Passaggio 2 per dare alla forma di cereali un contorno spesso. Gruppo queste forme insieme. Utilizzerai questo processo per disegnare un'immagine piatta, estrudendola, cambiando i colori di riempimento e dandole un contorno per le altre parti di cereali più avanti in questo tutorial.

Passaggio 3

copia e Incolla molti dei "Vector O". Ruotare guardali come meglio credi, o persino creane nuove versioni 3D per una varietà extra nella prospettiva di ogni oggetto di cereali. Selezionare un gruppo di loro e nel Opzioni del modello pannello, crea un nuovo motivo. Scegliere Esadecimale per colonna o qualunque cosa ti darà la maggior copertura. Salvare il tuo modello e vai al prossimo passo.

Passaggio 4

1. Disegna una grande ellisse che servirà come cima della ciotola. Imposta il colore di riempimento su una crema leggera (questo servirà da latte).
2. copia eIncolla quell'ellisse e applica il tuo nuovo modello ad esso (per favore ignora la mancanza di forma marshmallow, dato che si avvicina a breve).
   
3. Incolla forme di cereali intorno alla ciotola per coprire qualsiasi bordo del modello e per far apparire la ciotola di cereali come se fosse riempita fino all'orlo con deliziosi "Vector O's". Utilizzare il Strumento Penna disegnare una ciotola poco profonda. Solo i lati e il bordo superiore mostreranno il disegno finale, quindi quanto preciso nella prospettiva della ciotola sei il tuo richiamo completo.
   

5. Forme Marshmallow!

Passo 1

La sezione precedente menzionava alcune forme di marshmallow a tema Illustrator che stiamo aggiungendo alla ciotola di cereali. Lavoriamo su di loro. Iniziamo con a Strumento Penna-marshmallow ispirato. Disegna la metà del disegno, visto sotto, con il Strumento Penna si. copia e Incolla l'oggetto e Riflettere su a Asse verticale. Utilizzando i passaggi da Sezione 4, Passaggio 1, creare una versione 3D dello strumento penna e modificare i colori dell'ombra in verde acqua scuro. Disegna un cerchio al centro della forma e Gruppo insieme. Dagli un contorno spesso come i cereali O's.

Passo 2

Per la prossima forma di marshmallow, creeremo una matita gialla. Utilizzare il Strumento rettangolo (M) disegnare un rettangolo stretto. Arrotondare gli angoli selezionandolo con il Strumento di selezione diretta e tirando il Angoli vivi verso l'interno. Taglia la forma a metà (o più) disegnandone un rettangolo e colpendo Fronte meno nel il esploratore pannello.

Passaggio 3

1. Utilizzare il Poligono Strumento disegnare un triangolo semplice. 
2. Allineare e Scala quindi la sua base ha la stessa larghezza del resto della forma a matita.
3. Usando il esploratore pannello di nuovo, tagliare la punta del triangolo.
4. Da qui, puoi disegnare delle strisce strette sulla matita e procedere alla creazione di un oggetto 3D come fatto con le altre forme di cereali.

Passaggio 4

Le altre forme di marshmallow ottengono una rapida panoramica, poiché è più o meno la stessa nella loro creazione.

1. Nota come i diversi valori nella rotazione su diversi assi ti daranno prospettive diverse per i tuoi marshmallows.
2. La terza forma è un pennello. Lo disegno in base al Strumento pennello icona con il Strumento di matita. 
3. Il marshmallow finale è il Strumento di selezione reso in verde. È fatto di un rettangolo e un triangolo grande e dentellato.

Passaggio 5

Spazza i tuoi marshmallows e "Vector O's" attorno al design, assicurandoti di mettere un po 'vicino e sulla mano del personaggio come se stesse saltando fuori dalla ciotola e gettandoli in giro. Gruppo tutto questo insieme. Noterai anche che l'icona della penna usata per il marshmallow blu è stata aggiunta alla sua maglietta. Chiaramente, questo ragazzo ama la grafica vettoriale.

6. Adesivo e sfondo

Passo 1

Disegniamo quel simpatico adesivo che si trova nella parte in basso a destra della composizione.

• Disegna un cerchio con il Strumento ellisse e riempilo con un colore giallo scuro. Vai a Effetto> Distorci e trasforma> Zig & Zag ... Regola l'effetto a tuo piacimento. Maggiore è la dimensione, più i punti profondi si tufferanno nel centro del cerchio. E più creste per segmento, più punti avrai intorno alla tua cerchia.
• Crea un contorno per la forma del tuo adesivo e assicurati che gli angoli siano arrotondati o manipolando Angoli vivi o scegliendo arrotondato Caps e angoli nel Ictus pannello.
• Per renderlo lucido, disegna un cerchio con a Gradiente lineare andando da giallo chiaro a 100% a 0% Opacità e angolato in alto a sinistra. Elimina le parti non intersecanti del cerchio dalla forma del tuo adesivo usando il Strumento per la creazione di forme.
• Infine, usa un font in stile fumetto come Arch Rival o Toontime per i livelli di testo.

Passo 2

Lo sfondo è abbastanza semplice. Disegna un rettangolo grande sopra la tavola da disegno in "verde acqua" usando il Strumento rettangolo. Con il Strumento Penna, disegnare lunghe forme che si irradiano verso l'esterno dal centro (o giù di lì) del disegno. Unire loro nel esploratore pannello e applica a Radiale gradiente al Forma composta passando dal celeste al centro e verde acqua ai bordi. La maggior parte del tuo disegno coprirà le parti più opache della forma al centro.

7. Il logo

Passo 1

Usando un altro font simile a un fumetto, ho scritto il nome del cereale. Questo font si chiama Helsinki. Raccomando di usare qualcosa di infantile e arrotondato o disegnato a mano. Estrusione e smusso, proprio come le forme marshmallow erano prima.

Passo 2

I passaggi per creare il logo sono piuttosto semplici:

1. Espandere il tuo testo 3D in Oggetto e Separa così puoi spostare ogni lettera su, giù o ruotarla a tuo piacimento.
2. Cambia i volti delle lettere in blu chiaro e i loro colori ombra in verde acqua.
3. Scala alcune delle lettere in alto, come la C e il O, e alcuni di loro in basso, come il E.
4. Gruppo il testo insieme una volta soddisfatto del posizionamento e creare uno schema di copiatura, incollare, e Uniting il gruppo copiato nel esploratore pannello. Imposta il peso della corsa a 3-5pts e Allineare dietro il primo gruppo di loghi. Nota come il testo si curva un po ', pronto per il design della scatola. 

Passaggio 3

Metterli tutti insieme! Ho deciso che il personaggio avrebbe dovuto sovrapporre il logo un po 'e il testo aggiuntivo di "con strumenti marshmallow" è stato impostato nuovamente su Arch Rival. Ho anche aggiunto due contorni extra al carattere, alla ciotola e alle punte di cereali che volavano in giro per distinguerli ulteriormente dallo sfondo. 

A questo punto, con il progetto principale completato, puoi chiamare questo progetto ben fatto. Oppure puoi continuare a creare un mock-up digitale per i cereali.

8. Il pannello laterale

Passo 1

Prima di prenderci la briga di prendere in giro il design, dobbiamo creare il pannello laterale della scatola di cereali. Ho deciso di dedicarmi alla creazione di tutti i dati nutrizionali. Utilizzare il Rettangolo Strumento disegnare un rettangolo stretto pieno di bianco e il colore del tratto impostato su nero e a Peso 2pt. Per le linee, ho usato il Strumento segmento di linea to disegna ogni linea, assicurandosi che la larghezza delle linee corrisponda alla larghezza del rettangolo iniziale. Scopri una vera scatola di cereali (o altri prodotti alimentari) al fine di soddisfare le linee guida della FDA per i fatti nutrizionali. A meno che tu non abbia intenzione di inventare tutto, allora prendi tutte le libertà artistiche che vuoi.

Passo 2

Il carattere utilizzato per "Nutrition Facts" è Franklin Gothic. Per il resto dell'etichetta, ho usato Liberation Sans, come preferisco su Arial o Helvetica. Assicurati di allineare il testo in modo che le vitamine e i principali componenti nutrizionali si allineino mentre i valori e le percentuali si allineano sull'altro lato.

Passaggio 3

Come la parte anteriore della scatola di cereali, anche il pannello laterale è verde acqua (ma senza le forme a gradiente radiante). copia e Incolla il logo e Scala giù così si inserisce nel rettangolo. Incolla i tuoi dati nutrizionali e le varie varianti dei disegni di marshmallow.

Passaggio 4

Avrai bisogno di aprirti Adobe Photoshop CC per il completamento del resto di questo tutorial. Avrai anche bisogno di questo fantastico mock-up di cereali su Graphic River creato da Zeisla. C'è un istruttivo .PDF con il file di download.

Apri il file con l'etichetta 3.PSD nel Photoshop. Noterai che lo strato superiore è intitolato "Box (la tua immagine qui)". Pulsante destro del mouse questo strato e colpisci Modifica contenutoS. Incolla il design della tua scatola anteriore e assicurati che riempia l'intero documento. Colpire salvare e tornare a 3.PSD. Noterai che il tuo design è ora nella casella precedentemente vuota. Ripeti questo passaggio con il secondo livello etichettato "Box Side (Your Image Here) " per il pannello laterale creato in precedenza (puoi anche assemblare il contenuto del pannello laterale direttamente nel file).

Ottimo lavoro, hai fatto!

Getta alcuni marshmallow nell'aria, hai finito! Poi riprendili, dubito che tu voglia le formiche. Per divertirti di più con il packaging design e il cartooning, dai un'occhiata a questi fantastici tutorial:

• Mockup Blister Packaging in Photoshop
• Elementi fondamentali del fumetto: come disegnare correttamente una faccia da cartone animato
• Elementi fondamentali del fumetto: I segreti negli animali da disegno