Share
Con questo tutorial mi piacerebbe mostrarti come creare un set di font ispirato al tema del tema nautico usando Sketch. Utilizzeremo forme semplici e lo strumento Vettore insieme a Bordi e Preset di stile per creare rapidamente l'alfabeto.
Con Schizzo aperto, la vista predefinita ha già un infinito tavola da disegno. Dato che non stiamo creando nulla di una dimensione specifica, possiamo lasciarlo così com'è. Lavoreremo comunque con una griglia, quindi accendiamola in questo momento.
Sulla cima Toolbar selezionare Visualizza> Impostazioni griglia quindi modificare i valori come mostrato di seguito.
Per semplificare il mio lavoro ho abbozzato alcune idee su cui mi piacerebbe lavorare. Ciò contribuirà a mantenere il tema del font anche e fornire un punto di partenza per avviare il processo vettoriale.
Non è perfetto ma non ha bisogno di esserlo. Durante il processo vettoriale ho persino cambiato idea su alcuni rigonfiamenti e forme. Questi schizzi ci sono solo per fornire una guida.
Dai miei schizzi posso vedere che tutti i miei personaggi sono costituiti da una barra ampia e un tratto per completare le forme. Ho deciso di volere che questa barra larga fosse di due quadrati sulla mia griglia di larghezza e di otto quadrati di altezza. Realizzandolo 50 x 200 px.
Nel caso della lettera "A" questa barra sarà leggermente inclinata quindi ho trovato più facile creare una forma personalizzata usando il Vettore strumento (V). Con il Vettore strumento selezionato clicca su un punto griglia intersecante per iniziare la tua forma. Successivamente, conta due quadrati a sinistra e fai clic per creare un altro punto. Vai su due quadrati e su otto e fai clic per creare un altro punto. Ora conta più di due quadrati a destra e fai clic per creare un punto. Infine, fai clic sul punto iniziale per chiudere la forma.
Ora creiamo l'altra linea diagonale che costituisce la "A". Lo schizzo ha un Linea strumento che sarebbe bello da usare, tuttavia questo strumento non sembra funzionare bene con la griglia e le linee disegnate con questo strumento non scattare automaticamente in posizione. Quindi salteremo usando questo strumento e renderemo le nostre linee usando il Vettore strumento (V).
Con il Vettore strumento (V) selezionato ancora una volta clicca sulla parte superiore della griglia dove la forma larga arriva ad un punto, poi scendi verso il basso e su tre quadrati e clicca ancora una volta. Puoi quindi premere Ritorno sulla tastiera per impostare il percorso.
Ora creeremo la nostra traversa e i nostri serif. Usando il Vettore strumento (V) di nuovo, fai clic e crea linee orizzontali nel mezzo della forma piramidale. Dato che è alto otto quadrati di griglia, questo significa che il centro sarà quattro quadrati di griglia in alto o in basso. Per quanto riguarda i Serif, questi consegneranno un quadrato di griglia su ciascun lato.
La maggior parte della nostra forma di lettera è un semplice tocco, ma l'ampia barra deve essere stilizzata per rimanere in tema con il nostro tema del tatuaggio retro nautico. Lavorerò con un bel colore blu acqua, ma sentitevi liberi di usare qualsiasi colore che scegliete. Nel Elenco Strati (lasciato più riquadro) seleziona tutti i livelli di tratti semplici, quindi nel Ispettore (a destra più riquadro) regola il frontiere sezione come visto sotto. Se ci sono dei riempimenti, assicurati di rimuoverli in questo momento.
Con i tratti ancora selezionati, torna al puntoElenco dei livelli e in basso vedrai Preset di stile. Clicca il "+"icona in quella sezione per salvare il tratto come preset per un accesso più semplice in seguito.
Ora seleziona la forma della barra larga e questa volta regoleremo il Riempire, frontiere, e Ombre interiori elementi.
Il Riempire sarà un gradiente. Se si fa clic sull'icona di riempimento il Colore di riempimento il pannello entrerà in volo ed è possibile regolare queste impostazioni. Da questo pannello selezionare Pendenza e un gradiente preimpostato apparirà sulla forma.
Per modificare un gradiente dovrai guardare sul tavola da disegno nella forma e noterai due icone circolari nella parte superiore e inferiore della forma in linea retta. Per impostazione predefinita, l'icona del cerchio superiore è selezionata, quindi se cambi il colore / l'opacità avrà effetto solo su quel punto. Per ora mettiamolo in bianco piatto con 100% opacità. Sul tavola da disegno fai clic sull'icona del cerchio in basso e regola il colore con lo stesso tratto del tratto precedente.
Ingrandisci il tuo tavola da disegno quindi sei al centro della forma della barra e trascina le icone del cerchio dalla parte superiore e inferiore del gradiente verso il centro. Se tieni premuto Cambio l'icona si sposta verticalmente senza deviare. Fatelo in modo che si incontrino e formate una linea orizzontale del colore del bordo e bianco.
Si noti nello screenshot che questa linea non è esattamente al centro della griglia. Volevo che il colore si fermasse in linea con il bordo della barra trasversale.
Con il gradiente nel modo in cui lo vogliamo, premete il tasto Indietro pulsante nella parte superiore del Ispettore quindi regolare il frontiere e Ombre interiori sezioni come indicato di seguito.
Con queste impostazioni sul posto salvalo come a Preset di stile come hai fatto con il semplice colpo.
Usando il nostro schizzo iniziale come guida e il nostro recente Preset di stile creati continueremo a creare le nostre altre lettere. Dovresti trovare questo un compito facile e veloce poiché molto sarà la ripetizione dei passaggi sopra menzionati.
Immagino che tu sappia come appare l'alfabeto piuttosto che camminare attraverso ogni lettera. Mi attaccherò alle forme delle lettere principali che usano diversi strumenti e tecniche.
Per creare la "B" avremo bisogno di creare un rettangolo che sia 50 x 200 px. Questo sarà il gambo principale della "B". Per fare ciò selezionare il Forma icona del menu e scegliere il Rettangolo strumento (R) e disegna la tua forma quindi aggiungi il Preset di stile con il riempimento sfumato.
Per creare la ciotola della "B" useremo il arrotondato strumento (U) e disegnare un rettangolo arrotondato che è 150 x 100 px con un raggio di almeno la metà dell'altezza quindi 50. Puoi regolarlo nel Ispettore sidebar.
Con il rettangolo arrotondato che abbiamo appena creato ancora selezionato abilita il modificare strumento dal nostro Toolbar in alto e fai clic sul punto in alto a sinistra per selezionarlo. Ora nel Toolbar sarà disponibile una nuova serie di opzioni. Tra questi vedrai il nostro angolo di 50px. Fare clic in quella casella di testo e cambiarlo in 0. Questo rimuoverà l'angolo arrotondato da quell'angolo in alto a sinistra. Vai avanti e ripeti anche questo per il punto in basso a sinistra.
Vai a Modifica> Percorsi> Forbici e fai clic sul bordo piatto sinistro a sinistra per rimuoverlo. Useremo molto questo strumento perché potrebbe essere nel tuo miglior interesse salvarlo su Toolbar. Per fare ciò, fare clic con il tasto destro del mouse su Toolbar o visita Visualizza> Personalizza barra degli strumenti ... e trascinare lo strumento su Toolbar in una posizione che ti fa sentire a tuo agio.
Seleziona il modificare strumento ancora una volta e fare clic sul punto in basso a sinistra e trascinarlo in modo che non intersechi più il gambo della nostra "B". Ora applica il nostro semplice tratto Preset di stile. Ora puoi terminarlo ripetendo questi passaggi per creare la forma della ciotola inferiore e usare il Vettore strumento per aggiungere un extra serif nel mezzo dello stelo "B".
La nostra "C" è piuttosto semplice. È fondamentalmente un cerchio ma abbiamo aggiunto nel nostro gambo per riempirlo un po '. Seleziona il Ovale strumento (O) e creare un cerchio che è 200 x 200 px.
Con il Rettangolo strumento (R) disegnare la forma del rettangolo principale come prima e allinearla a sinistra del cerchio. Adesso Shift-click entrambe le forme e andare a Modifica> Combina> Interseca o scegliere intersecare dall'alto Toolbar. Ora puoi riempirlo con il nostro gradiente Preset di stile.
Disegna un altro cerchio delle stesse dimensioni dell'ultima volta e posizionalo sopra la forma appena creata. Seleziona il modificare attrezzo e passa il mouse sopra il bordo del cerchio e vedrai il cursore cambiare su un'icona a forma di penna con un "+". Dove il percorso si interseca con la griglia clicca per creare un nuovo punto sia sopra che sotto il punto centrale. Seleziona il Forbici strumento e rimuovi i percorsi tra questi due punti che hai appena creato per creare un'apertura. Ora puoi applicare il tratto semplice Preset di stile e aggiungi i tuoi serif.
Seguendo i passaggi precedenti dovresti essere in grado di creare le lettere da "A" a "R". È praticamente solo schiuma, risciacquo, ripetere seguendo il tema e le forme di lettera di base. La "S" tuttavia è un po 'diversa, quindi te lo spiego ora.
Per mantenere le cose in linea ho deciso di usare lo stesso angolo della lettera "A" per tutte le altre lettere oblique come "V", "W" e "X", tuttavia, questo angolo era un po 'troppo duro per la "S" e la "Z". Quindi ho disegnato una nuova angolazione per la "S" in questo passaggio. Il blocco ha ancora due quadrati di griglia, ma invece di essere tre su di esso è ora quattro. Quindi, come abbiamo fatto per la "A" selezionare il Vettore strumento (V) e crea il tuo blocco angolato come visto di seguito.
Seleziona il arrotondato strumento (U) e disegnare un rettangolo arrotondato che è 150 x 200 px con un raggio di almeno la metà della larghezza 75. Adesso Shift-click entrambe le forme e andare a Modifica> Combina> Interseca o scegliere intersecare dall'alto Toolbar. Ora puoi riempirlo con il nostro gradiente Preset di stile.
Abilita il Ovale strumento (O) e creare due cerchi che sono 150 x 150 px e posizionarli direttamente sopra la forma precedente allineando uno verso l'alto e uno verso il basso. Quindi selezionare il modificare attrezzo e passa il mouse sopra il bordo del cerchio e vedrai il cursore cambiare su un'icona a forma di penna con un "+". Dove il cerchio si interseca con la forma sottostante clicca per creare un nuovo punto. Seleziona il Forbici strumento e rimuovi i percorsi tra questi due punti che hai appena creato per creare un semicerchio. Ora puoi applicare il tratto semplice Preset di stile e aggiungi i tuoi serif. Fatelo per il cerchio superiore e quello inferiore e la vostra "S" dovrebbe essere completa.
La "Y" è una forma personalizzata disegnata con il Vettore strumento (V). Puoi vedere i passaggi seguenti su come crearlo.
Infine, per la "Z" ho sentito che l'angolo era troppo ripido quindi l'ho allungato come abbiamo fatto per la "S", solo che l'ho reso un po 'più pronunciato. Sentiti libero di giocare con esso a tuo piacimento, ma per me sono andato oltre cinque quadrati di griglia, poi ho aggiunto i gambi e i fermi per terminarlo.
Spero di essere stato in grado di mostrarti un po 'di tempo risparmiando le tecniche per riutilizzare gli stili semplici. Dopo aver creato le lettere, puoi raggruppare i diversi elementi in modo da poter copiare / incollare le lettere per formare parole e frasi. Restate sintonizzati per le esercitazioni future su come utilizzare questo font appena creato in modi divertenti e furbi.
Accentsconagua