Share
Cosa starai creandoSegui questo tutorial e impara come trasformare un sito web in un paese delle meraviglie invernale. Puoi creare le barre dei menu e i pulsanti da zero, oppure puoi prendere queste tecniche e decorare i tuoi oggetti. All'inizio creerai una barra dei menu di base, e poi imparerai come aggiungere la neve e i ghiaccioli, i fiocchi di neve, le scintille e altre decorazioni a tema invernale. Alla fine, sperimenteremo più colori e disegni, quindi iniziamo!
Lanciare Adobe Illustrator e vai a File> Nuovo per aprire un documento vuoto. Digita un nome per il file e imposta le dimensioni, quindi seleziona pixel come unità e RGB come Modalità colore. Avanti, vai a Modifica> Preferenze> Generale e impostare il Incremento della tastiera a 1 px e mentre là, vai a Unità e prestazioni di visualizzazione per assicurarsi che il unità sono come nell'immagine seguente. Di solito lavoro con queste impostazioni e ti aiuteranno durante il processo di disegno.
Prendi il Strumento rettangolo arrotondato e disegna la prima forma con le dimensioni mostrate. Seleziona viola come colore di riempimento.
Con il rettangolo ancora selezionato, vai su Aspetto pannello e con il viola Riempire attributo selezionato, premere il tasto Duplica elemento selezionato icona in basso. Di conseguenza otterrai un secondo Riempire attributo sopra. Utilizzare un gradiente lineare da bianco a nero in a -Angolo di 90 gradi, e impostare il Modalità di fusione a Luce soffusa.
Con il rettangolo ancora selezionato, duplica il viola Riempire attribuire nuovamente. Seleziona il nuovo Riempire attributo dal basso, mantieni lo stesso colore di riempimento, quindi vai a Effetto> Stilizzazione> Sfalsa ombra e applicare questo effetto quattro volte. Diamo un nome a questa forma "bar-base".
Queste sono le impostazioni per Ombra esterna effetti:
Il prossimo, copia e Incolla davanti (Control-F) il "bar-base" e quindi rimuovere tutte le apparenze esistenti premendo il tasto Chiara apparenza icona nella parte inferiore del Aspetto pannello. Seleziona il nero come colore di riempimento, quindi vai a Oggetto> Crea mesh sfumata, selezionare 3 file e 6 colonne e colpisci ok. Di conseguenza otterrai una griglia come nell'immagine seguente.
Ora, prendi il Strumento di selezione diretta (A) e usarlo per selezionare solo i tre punti di mesh indicati sotto e cambiare il loro colore di riempimento da nero a quello corrispondente. Al termine, imposta questa forma su Modalità di fusione Luce morbida. Diamo un nome a questa forma "bar-mesh".
Prendi il Strumento rettangolo (M) e disegna un rettangolo con la stessa altezza della barra dei menu e posizionalo al centro. Seleziona blu chiaro come colore di riempimento.
Con il rettangolo blu ancora selezionato, vai a Oggetto> Percorso> Aggiungi punti di ancoraggio per aggiungere quattro punti extra sui lati (1). Utilizzare il Strumento di selezione diretta (A) per selezionare solo i punti sinistro e destro dalla metà e spostarli 10 px verso l'interno premendo il tasto Sinistra e Tasti freccia destra sulla tastiera (2).
Quindi, vai al Aspetto pannello e duplicare il blu esistente Riempire attributo. Per il nuovo Riempire in alto, seleziona un gradiente lineare da bianco a nero a a -Angolo di 90 gradi e impostare il Modalità di fusione a Luce soffusa (3).
Dai un'occhiata più da vicino al lato destro della forma blu. Prendi il Strumento penna (P), tracciare un percorso a V seguendo i punti di ancoraggio della forma blu e dargli un a 1 punto bianca Ictus. copia e Incolla davanti (Control-F) questo percorso e quindi spostare la copia 1 px a destra premendo il Tasto freccia destra una volta. Seleziona un 1 punto nero Ictus per il secondo percorso. Adesso, Gruppo (Control-G) i due percorsi e impostare il gruppo a Modalità di fusione Luce morbida.
Non dimenticare di fare la stessa cosa sul lato sinistro della forma blu o semplicemente riflettere il gruppo esistente.
Ora che la nostra semplice barra dei menu è pronta, possiamo procedere con la neve e le altre decorazioni. Per aggiungere la neve, ti consiglio di usare il Pencil Tool (N) invece del Strumento penna (P) perché è più facile e otterremo anche quel look a mano libera / naturale, che in termini di neve è una buona cosa. Fare doppio clic sul Pencil Tool (N) per aprire il Preferenze finestra e modificare le impostazioni. Puoi vedere sotto quelli che ho usato, ma sentiti libero di adattare il Fedeltà e il levigatezza a tuo piacimento.
Una volta impostato, ingrandire il lato destro della barra dei menu e tracciare un percorso simile a quello sottostante. Non devi essere troppo preciso: più casuale è, meglio è.
Ancora usando il Pencil Tool (N), disegnare un altro percorso casuale sotto il primo e assicurarsi di coprire solo un po 'della barra dei menu. Se i punti finali dei due percorsi non si sovrappongono, puoi usare il Strumento di selezione diretta (A) per spostarli uno sopra l'altro come mostrato in primo piano.
Successivamente, è il momento di unire i due percorsi in uno. Trascina una selezione con il Strumento di selezione diretta (A) oltre i due punti finali da destra (assicurati di bloccare prima la barra dei menu) e premi Control-J a Aderire loro. Controlla il Angolo opzione e colpisci ok. Quindi, trascinare una selezione sui due punti finali da sinistra e Aderire anche loro. Riempi la forma risultante con il bianco.
Ancora usando il Pencil Tool (N), disegnare un nuovo percorso sotto la forma bianca ma molto vicino ad esso. La lunghezza di questo percorso dovrebbe essere all'incirca uguale alla forma bianca (1). A questo punto, passa a Strumento penna (P) e chiudi i due punti finali nella parte superiore per ottenere una forma (2). copia e Incolla davanti (Control-F) la forma bianca, quindi premere Maiusc-Control-] portarlo davanti a tutto. Seleziona questa nuova copia bianca insieme alla forma blu e premi Sottrarre nel esploratore pannello. Otterrai un percorso composto (3) ma vai a Oggetto> Percorso composto> Rilascio ed elimina le forme più piccole in alto (4).
Riempi la forma che hai ottenuto nel passaggio precedente con il colore indicato, e a questo punto il primo "pezzo" di neve è pronto.
Prendi il Pencil Tool (N) di nuovo e disegnare una forma più piccola all'estremità destra della barra dei menu piena di bianco (1). Disegna un altro percorso sotto di esso e assicurati che i punti finali destro e sinistro si sovrappongano (2), quindi richiudi il percorso in alto come hai fatto in precedenza, utilizzando il Aderire funzione o il Strumento penna (P) (3). copia e Incolla davanti (Control-F) la piccola forma bianca e premere Maiusc-Control-] portarlo davanti a tutto. Seleziona questa copia bianca insieme alla forma blu e premi Sottrarre nel esploratore pannello. Riempi la forma risultante con lo stesso colore (4). Questo è il secondo "pezzo" di neve.
Aggiungiamo altra neve sul lato sinistro della barra usando la stessa tecnica. Per prima cosa disegna la forma bianca con il Pencil Tool (N) (1), quindi creare la forma sotto di essa sottraendo (2) e riempirla con lo stesso colore blu chiaro (3).
Continua ad aggiungere altri "pezzi" di neve, alcuni più grandi, altri più piccoli, fino a coprire completamente la parte superiore della barra dei menu. Puoi vedere nella prossima immagine il risultato finale.
Utilizzare il Pencil Tool (N) o il Strumento penna (P) disegnare una forma come quella sottostante e riempirla con il gradiente lineare mostrato. È inoltre possibile disegnare accanto ad alcune forme più piccole riempite con lo stesso gradiente, quindi selezionare tutte le forme e Gruppo (Control-G) loro.
Usa il gruppo di forme che hai appena creato per aggiungere più dettagli sulla neve. Crea più copie del gruppo e ridimensiona, ruota e disponili in cima alla neve.
Utilizzare il Pencil Tool (N) per disegnare una forma casuale nell'angolo in basso a destra della barra dei menu e selezionare bianco come colore di riempimento. Ora, prendi il Aggiungi strumento Punto di ancoraggio (+) e usalo per aggiungere alcuni punti extra nella parte inferiore di questa forma (1). Quindi passare al Strumento di selezione diretta (A) e trascina verso il basso solo tre di questi punti per creare i primi ghiaccioli (2). Aggiungi più punti usando il Aggiungi strumento Punto di ancoraggio (+) lungo i ghiaccioli e gioca con le maniglie per creare l'aspetto ondulato (3).
Disegna una nuova forma casuale accanto alla prima, quindi aggiungi più punti in basso con il Aggiungi strumento Punto di ancoraggio (+) (1). Utilizzare il Strumento di selezione diretta (A) trascinare verso il basso due di questi punti per creare due nuovi ghiaccioli (2). Aggiungi più punti di ancoraggio lungo la lunghezza dei ghiaccioli e muovi le loro maniglie per creare l'aspetto ondulato (3).
Ho aggiunto un'altra forma bianca accanto alla seconda, ma puoi aggiungerne quante ne vuoi. In questo tutorial il design spetta a te.
Ora seleziona le tre forme bianche dal lato inferiore destro della barra dei menu, e copia e Incolla sul retro (Control-B). Sposta leggermente verso il basso queste tre copie premendo il tasto Giù chiave di freccia sulla tastiera una o due volte e seleziona l'azzurro come colore di riempimento.
Per aggiungere più profondità, disegna con Pencil Tool (N) o il Strumento penna (P) una forma più sottile sulla parte superiore di ogni ghiacciolo e riempire tutti con il gradiente mostrato.
Per aggiungere ulteriori dettagli, disegna alcune forme più piccole in cui hai spazio libero e riempili con il colore indicato.
Il lato inferiore destro della barra è pronto, ma è possibile aggiungere altri ghiaccioli sul lato sinistro. Questi sono più piccoli, quindi non ci vorrà molto tempo per farlo. Usa la stessa tecnica descritta sopra. Innanzitutto, disegna la forma bianca (1), quindi copia e Incolla sul retro (Control-B) questa forma, spostala leggermente e modifica il colore di riempimento (2). Alla fine, usa forme più piccole riempite con la stessa sfumatura per aggiungere tutti i dettagli che vuoi (3).
Usando la stessa tecnica, aggiungi altri ghiaccioli nell'angolo in basso a sinistra della barra dei menu e a questo punto hai finito con la neve ei ghiaccioli.
Vai a Snowflake e scarica il set di fiocchi di neve vettoriali creato da All-Silhouettes. Quindi apri il file di Illustrator dall'archivio e copia il fiocco di neve evidenziato in blu nel documento. Seleziona il bianco come colore di riempimento e trascina il fiocco di neve nel Spazzole pannello per salvarlo come a Nuovo pennello di dispersione. Nel Opzioni del pennello di dispersione finestra, impostare il Rotazione relativa al percorso e lascia il resto delle impostazioni così come sono. Digita un nome per il pennello e premi ok.
Ora prendi il Pencil Tool (N) di nuovo e disegnare alcuni percorsi sopra la neve come nella prossima immagine. Ictus questi percorsi con il Spazzola di dispersione del fiocco di neve salvato in precedenza e aprire il Opzioni del tratto finestra dal Aspetto pannello. Cambia le impostazioni come mostrato e premi ok. Impostare il Peso della corsa per questi percorsi a 0,25 pt, 0,3 pt, 0,35 pt e 0,5 pt per ottenere fiocchi di neve di varie dimensioni.
Copia i fiocchi di neve evidenziati con il blu e il verde dai fiocchi di neve impostati nel documento. Quindi riempili di bianco, ridimensionali e disponili sul lato sinistro della barra dei menu.
Successivamente, dal simboli pannello aperto Menu Librerie simboli e nel Natura categoria trova "Alberi 1”. Trascina il simbolo nella tua tavola da disegno e premi il tasto Interrompi collegamento al simbolo icona nella parte inferiore del simboli pannello per espanderlo. Scala e disponi gli alberi sopra la neve e moltiplicali se vuoi aggiungerne altri.
Ora, dai uno sguardo più da vicino agli alberi. Prendi il Pencil Tool (N) e traccia dei brevi sentieri seguendo i rami dell'albero più grande. Ictus questi percorsi con il Pennello Artico-Sottile che puoi trovare in Menu Librerie di pennelli> Artistico> Artistic_ChalkCharcoalPencil. Impostare il Peso della corsa a 0,5 pt e il colore al bianco per tutti loro.
Ripeti lo stesso processo per gli altri alberi ma riduci il Peso della corsa ancora di più visto che gli alberi sono più piccoli.
Moltiplicare gli alberi coperti di neve che hai creato e disporne altri sull'altro lato della barra dei menu.
Per creare la casetta, inizia disegnando una semplice forma di casa piena di bianco. Per il tetto, traccia un percorso con a 1 punto rosso Ictus e aggiungi una piccola forma rossa come il camino. Perché la porta e le finestre usano il Strumento rettangolo (M) e il gradiente mostrato. Per creare la neve sul tetto, basta disegnare due percorsi sulla parte superiore del tetto e Ictus loro con il Pennello Artico-Sottile come hai fatto prima per gli alberi.
Quindi, prendi il Strumento ellisse (L) e disegna tre ellissi per creare il pupazzo di neve. Riempili con il gradiente radiale mostrato, quindi aggiungi piccoli cerchi neri come gli occhi e i pulsanti. Utilizzare il Strumento penna (P) disegnare un naso e la sciarpa, e hai finito.
A questo punto puoi organizzare la casetta e il pupazzo di neve dove vuoi.
Sembra obbligatorio aggiungere un sacco di scintillii, giusto? Ho già spiegato come crearne uno nel tutorial Glitter Text Art Effect. Moltiplica lo scintillio e disponi tutti quelli che desideri per migliorare il tuo design.
Se sei riuscito ad arrivare a questo punto, sarai in grado di creare e decorare un semplice pulsante anziché una barra. Inizia disegnando un rettangolo arrotondato più piccolo (1), quindi crea la griglia come spiegato all'inizio del tutorial (2). Aggiungi "pezzi" di neve nella parte superiore e ghiaccioli nella parte inferiore (3) e usa il Spazzola di dispersione del fiocco di neve aggiungere più neve (4). Disporre le decorazioni che hai creato (5) e infine aggiungere alcune scintille (6). Tutte le tecniche rimangono le stesse.
Duplica o moltiplica il primo pulsante e riorganizza semplicemente le decorazioni esistenti per ottenere più pulsanti.
Duplica la barra dei menu viola con la neve in alto, i fiocchi di neve e i ghiaccioli, ma senza le altre decorazioni. Seleziona "bar-base" e sostituisci il viola con la tonalità di verde indicata. Mantieni il resto delle impostazioni così come sono.
Quindi, seleziona la forma dal centro e sostituisci l'azzurro con il verde chiaro. Disporre tutte le decorazioni in un modo diverso e otterrai una nuova barra dei menu.
Per creare la barra dei menu grigiastra, duplicare nuovamente la barra viola. Seleziona "bar-base" e sostituisci il viola con la sfumatura di grigio indicata. Successivamente, seleziona la forma dal centro e sostituisci l'azzurro con il rosa questa volta. Il resto delle impostazioni rimane lo stesso. Infine, organizza tutte le decorazioni come vuoi.
Queste barre e pulsanti di menu sono piuttosto semplici e aiutano nella dimostrazione, ma sentitevi liberi di utilizzare qualsiasi altro elemento del sito Web per creare questo look da inverno delle meraviglie. Puoi iniziare da zero o puoi utilizzare solo alcuni elementi per decorare i tuoi menu e pulsanti. È assolutamente obbligatorio divertirsi molto mentre lo fai, e se vuoi condividere la tua creazione del mondo delle meraviglie invernali, mi piacerebbe vederlo.
Accentsconagua