Creare la propria identità grafica non è mai un'impresa facile. In effetti, potrebbe essere la cosa più difficile che tu abbia mai fatto. Di solito non c'è una scadenza: solo un cliente pretenzioso con aspettative irrazionali: te stesso.
Nel cercare di trovare il look giusto, non sono andato a scavare tra caratteri tipografici e schemi di colori di tendenza. Poiché la maggior parte del mio lavoro è sperimentale e completamente autodidatta, perché non dovrebbe esserlo anche il mio logo?
La prima cosa che dovresti sapere è che creare forme di lettera non è per tutti. Per la maggior parte, si consiglia di utilizzare un carattere tipografico esistente. Infatti, si potrebbe chiedere "se il tuo segno di parola è così semplice, perché preoccuparsi? Perché non usare solo un carattere?" Sono sicuro che ci siano tonnellate di caratteri migliori dall'aspetto. Ma nessuno di loro mi rende felice come questo. Vedi, l'ho fatto. Se sei un uomo pratico come me, essere felice con qualcosa significa farlo soddisfare le tue esigenze. Allora, cosa vuoi uscire dal tuo logo?
In questo tutorial, ti insegnerò come creare un logo che soddisfi le seguenti esigenze. Prima di tutto, sono un creatore di immagini che mostra prevalentemente lavori in formato digitale. Questo è già un indicatore del fatto che il mio font deve apparire bene sullo schermo. I caratteri Sans-Serif hanno un buon risultato digitale, quindi è già un buon motivo per andare in quella direzione.
In secondo luogo, il mio lavoro richiede una firma, un simbolo, qualcosa che identifichi un particolare lavoro come il mio. Nel mondo digitale, si chiama watermark. Molto presto, ho deciso che il simbolo sarebbe stato un monogramma. Sono sempre stato attratto da cose antiquate, e questo potrebbe davvero essere più di una scelta sentimentale. I monogrammi occupano poco spazio, possono essere visualizzati sia in formati grandi che piccoli, ma offrono informazioni sufficienti per essere riconoscibili. In un lunghissimo processo di disegno, ho realizzato che il mio monogramma poteva diventare un ambigramma (si legge allo stesso modo quando viene ruotato con il lato superiore verso il basso). Questo è il +1 per la bellezza. :)
Bene, quindi voglio un semplice marchio di parole sans-serif e relativo ambigramma. Ora come trasformarlo in più di uno schizzo? Ci sono diversi modi per creare un font. Dato che sono un maniaco del controllo nel mio lavoro, ho scelto di farlo attraverso la costruzione geometrica. Ciò significa che nulla è approssimativamente stimato a vista. Le curve vengono create allineando una serie di cerchi proporzionati in scala. I loro raggi sono determinati da linee ad angolo e i pesi dei caratteri sono specificati meticolosamente. In poche parole, nulla è lasciato al caso.
Prima di entrare, ho pensato di mostrare una delle mie lettere rispetto a Futura Std, in questo modo hai un senso delle proporzioni su quanto è grande creare le tue cerchie. Questa è anche la griglia che stiamo per fare.
Nei seguenti passaggi lascerò la lettera "e" sul posto. Questo servirà da guida, sempre per proporzione, anche se lo stiamo ricreando da zero. Questa ciotola di lettere che stiamo per creare verrà successivamente trasformata in una "a", una "e" e una "c".
Per iniziare, crea la tua prima cerchia. Questo sarà l'angolo della ciotola, per così dire. In questa sezione, assicurati di avere l'opzione Guida intelligente di Illustrator attivata (Comando + U) e lo snap attivato (Opzione + Comando + "). Non è solo un risparmio di tempo in questa situazione, ma anche necessario.
Crea una linea orizzontale che si estende da un lato all'altro del cerchio.
Vai a Oggetto> Trasforma> Ruota e ruota la linea con un angolo di -25 gradi.
Trascina la linea lungo il suo percorso verso il lato sinistro. In questo modo, hai una chiara intersezione di percorsi con il cerchio.
La linea è ora sopra il cerchio, poiché è stata creata in seguito. Vogliamo che il cerchio sia in cima, poiché stiamo cercando di aggiungere un punto di intersezione al percorso del cerchio. Cambiare la disposizione portando il cerchio in cima, oppure tagliare e incollare il cerchio in posizione (comando + F). Quindi posiziona il mouse sopra l'intersezione e aggiungi un punto con lo strumento Penna (P).
Copia e incolla la linea in posizione (Comando + F) Vai a Oggetto> Trasforma> Rifletti. Giralo attraverso l'asse verticale.
Ripeti il processo di linea (trascina la linea lungo il percorso, porta il cerchio in cima, aggiungi un punto di intersezione al cerchio).
Copia e incolla il cerchio in posizione e vai su Oggetto> Trasforma> Scala. Rendilo più grande del 225%.
Trascina l'angolo superiore di 15 gradi del cerchio grande direttamente sopra il punto più piccolo. Dovrebbero scattare insieme sul posto.
Copia e incolla il cerchio più piccolo. Trascina questo come hai fatto con il primo, eccetto il punto più basso del cerchio grande.
Questo è quello che dovrebbe essere la tua costruzione ora. Questo completa il bordo esterno della lettera. Il prossimo è il bordo del raggio interno.
Copia e incolla in posizione il piccolo cerchio del raggio esterno. Riducilo al 50%.
Utilizzando l'opzione Guide intelligenti, aggiungi un punto con lo strumento Penna sul cerchio del raggio interno a 135 gradi (la guida verrà visualizzata automaticamente). Fondamentalmente, questa è una diagonale di 45 gradi.
Copia e incolla la piccola circonferenza (chiameremo questa nuova di medie dimensioni). Ridimensionalo al 130%.
Ancora una volta, crea il diametro per il cerchio come hai fatto prima, ma questa volta ad un angolo di -15 gradi.
Copia e incolla uno dei cerchi più grandi. Dagli un diametro di -15 gradi pure.
Sposta il cerchio grande in modo che corrisponda al punto di angolo di 15 gradi del cerchio medio.
Copia e incolla i due cerchi (piccolo e medio). Girali verticalmente (riflesso orizzontale) e scoccali sul punto inferiore di 15 gradi del cerchio grande (se non ne hai creato uno, fallo ora).
Copia e incolla un altro cerchio grande e attaccalo al punto più alto del cerchio medio. Fai lo stesso per quello in basso.
Ora crea un tratto di 37 pt più grande della lettera. Inoltre, crea un tratto sottile che utilizzerai come guida (visibile in nero). Inserisci la linea guida nel punto giusto del cerchio medio.
Selezionando il tratto più grande, vai su Oggetto> Espandi.
Crea alcune linee guida su ciascun lato di questo tratto spesso.
Elimina il tratto spesso e invia le guide appena create sul retro dell'area di disegno.
dove le guide si intersecano con i grandi cerchi esterni e interni, aggiungi punti di intersezione.
La nostra costruzione è ora completa. Iniziamo a mettere insieme il bordo esterno. Copia solo gli elementi del bordo esterno in un nuovo livello e nascondi il precedente.
Ecco come funziona. Ogni cerchio è rilevante solo fino a quando tocca un altro cerchio. Quindi dal grande cerchio superiore esterno (ancora mantenuto come una linea bianca per riferimento) tutto ciò di cui abbiamo bisogno è il minuscolo, in alto. Dato che abbiamo aggiunto punti di intersezione a tutti loro, tutto ciò che dobbiamo fare è tagliare gli extra eliminando i punti non necessari con lo strumento di selezione diretta (A - freccia bianca). Elimina tutto, ma la parte evidenziata sotto.
Dal raggio dell'angolo, lascia altrettanto per collegare il cerchio grande in alto a sinistra.
Fai lo stesso per il cerchio grande sinistro e poi il fondo.
In questo momento, questo è il modo in cui dovrebbe apparire il tuo cerchio. Non preoccuparti che la parte superiore sia più lunga. In realtà non è - la lettera 'e' è leggermente meno ampia di quella 'a' in alto.
Il percorso può sembrare continuo, ma in realtà è suddiviso in tanti pezzi che abbiamo creato. Ora dobbiamo unire tutti i punti di intersezione. Con lo strumento di selezione diretta (A), trascina i due punti sovrapposti e unisci i percorsi insieme (Comando + J). Fallo per tutte le doppie punte.
Il tuo profilo esterno ora è finito. Fai attenzione a non perdere nessuna estremità libera.
La ripetizione del processo per il contorno interno dovrebbe darti questo risultato. Ricorda anche di unire i due percorsi insieme.
Ricorda le due guide verticali che abbiamo inserito? Chiudi la ciotola 'a' con lo strumento Rettangolo (M).
Riempi il percorso della ciotola con un colore a tinta unita, rimuovi il contorno e raggruppalo con il rettangolo. E finalmente abbiamo la nostra prima lettera!
Duplicalo e passiamo alla lettera successiva. Creare una linea angolata a 15 gradi.
Posiziona il punto finale inferiore della linea oltre l'angolo della lettera.
Nella stessa tecnica di posizionamento degli endpoint su percorsi intersecanti, tagliare il fondo della ciotola.
Sposta il rettangolo facendo scattare l'angolo in basso a destra sul punto finale inferiore della lettera.
Riduci il rettangolo con una proporzione verticale del 70%. Ricordarsi di fare questo non conforme, in modo da preservare lo spessore.
Trascina l'angolo in alto a destra del rettangolo finché non scatta sul percorso della vasca.
Taglia l'eccesso della ciotola sul lato destro del rettangolo, come mostrato sotto.
Duplicare il rettangolo, ruotarlo con un angolo di 90 gradi e farlo scattare all'angolo del rettangolo precedente.
Duplica il rettangolo verticale e attaccalo all'ancora interna centrale della ciotola.
Trascina i due punti finali del rettangolo orizzontale con lo strumento Selezione diretta (A) fino a quando non scatta sul terzo rettangolo. Elimina quest'ultimo per rivelare il divario.
La 'c' è una semplice modifica rispetto alla 'e'. Basta tagliare il divisore orizzontale mentre usi una guida dalla 'e'. Ora abbiamo le tre lettere più difficili da creare!
Ora inizieremo a creare la dicitura e creeremo nuove lettere dove necessario. Per iniziare, avremo bisogno di una griglia di posizionamento. Crea due linee orizzontali molto lunghe e agganciarle agli ancoraggi verticali più lontani sulla 'a'.
Raggruppa le due linee (Comando + G), taglia e incolla su un nuovo livello, copia e incolla in posizione (Comando + F). Ridimensiona questo nuovo gruppo fino al 94% sul suo asse verticale. Perché il doppio set di guide? Dai un'occhiata veloce a tutti i font professionali nella tua libreria. Noterai che i contatori raggiungono sempre oltre i gambi. Questo perché quando il contatore e il gambo sono a livelli uguali, uno percepisce visivamente il gambo come più alto. Per compensare questa differenza di livello, è necessario aumentare il livello del contatore oltre l'altezza x.
Le linee rosse ora sono la nostra altezza x. Ora abbiamo bisogno di una linea di risalita (contrassegnata da bianco).
Crea una linea verticale che scatta dalla linea di risalita, alla linea di base. Non confondere la linea di base con la linea del contatore. Ricorda i gambi (ciò che stiamo creando in questo momento) non coincide con le contro linee. Potrebbe aiutarti a cambiare il colore della linea di base e l'altezza x in uno diverso.
Aggiungi un'altra guida che scatta sulla punta della lettera "a" (come mostrato sotto). Quindi, sul livello del carattere, aggiungi una linea ad angolo di 20 gradi e fai scattare l'estremità superiore in cui la guida si interseca con lo stelo.
Ora abbiamo bisogno di un componente per la lettera 'l'. Crea un cerchio molto grande sullo stesso livello.
Inserisci l'ancoraggio orizzontale sinistro del cerchio sullo stelo.
Aggiungi ancore ai percorsi in cui si intersecano con le guide. Uno per la contro linea e un altro per la linea di base. Assicurati di bloccare il livello guida, altrimenti tali ancore finiranno sulle guide, piuttosto che sui percorsi.
Taglia il cerchio fino a quando non rimani con la piccola porzione in basso a sinistra. Connetti i percorsi per ottenere una lettera finale 'l'.
Creare una linea verticale lunga 40 pt (spessore della linea) e ruotarla con un angolo di 35 gradi.
Duplica la linea e ruotala orizzontalmente.
Espandilo e ritaglia l'eccesso, ancora una volta, usando la linea di base e l'altezza x come guida. Una volta completata la x, ruota di una "l" di 90 gradi e scatta in fondo alla linea del contatore. Quindi duplica le guide e inseriscile nella parte inferiore della "l" ruotata. In pratica, abbiamo appena creato delle guide per una seconda riga con una spaziatura delle righe identica al peso del font. Questo rende il layout molto stretto, ma impossibile da fare con grandi corpi di tipo.
Vedete, non ho lettere discendenti nel mio nome (ex 'g' - lettere che scendono oltre la linea di base). Con un tale layout, i discensori si sovrapporrebbero alla seconda fila, il che sarebbe ovviamente un problema.
Duplica la 'a' e girala orizzontalmente nella riga in basso.
Espandi lo stelo fino a raggiungere la linea di risalita.
Duplica la 'a' e girala orizzontalmente nella riga in basso.
Espandi lo stelo fino a raggiungere la linea di risalita.
La modifica che stiamo per realizzare è quella che migliora la leggibilità a piccole dimensioni. È il tipo di cosa che si nota dopo la stampa di prova e test di piccole dimensioni sullo schermo. Crea un cerchio che produce un risultato approssimativo come mostrato di seguito. Usando la tecnica spiegata nella prima parte del tutorial, taglia la ciotola.
Puoi vedere la modifica in basso, che migliora la leggibilità, specialmente se di piccole dimensioni.
La nostra prossima lettera sulla lista è 't'. Duplica la 'e' e fai lo snap su una 'l' duplicata come mostrato sotto.
Taglia tutto tranne quello che viene mostrato nello screenshot sottostante.
Aggiungi la barra alla 't' mentre utilizzi gli allineamenti corretti.
Aggiungi una linea da -10 gradi e usala come guida per modificare la barra.
Preservare l'unità visiva di un font può significare riutilizzare parti di una lettera per crearne altre (come abbiamo fatto con "a", e, "c") ma può portare ad estremi. Trasformare una 'b' in una 'h' non è un modo per andare. L'angolo deve essere più nitido e la transizione al secondo stelo attorno a un raggio più stretto. Devi conoscere la tecnica ormai, quindi crearne una usando l'immagine in basso come guida.
E infine, una lettera "i" fatta da una "l" abbreviata. Aggiungi il punto, ma rendi il punto più grande del 105% rispetto al peso del font (o più se lo desideri).
La nostra ultima mossa con il wordmark è sulla spaziatura delle lettere, conosciuta anche come kerning. Per iniziare, metriche spaziamo le nostre lettere usando una lettera 'l' come modello. Inserisci tutte le lettere su questo blocco di spaziatura per ottenere lo stesso risultato.
Ciò che vogliamo veramente è la spaziatura ottica. Quando le lettere sono ugualmente spaziate, si ottengono vuoti indesiderati a causa della diversa forma di ogni lettera. Gli spazi devono essere livellati spostando ogni lettera a sinistra oa destra. Ad esempio, nella sezione "tec", ho spostato la "e" più a sinistra per correggere il divario. Non spostare le lettere finali di ogni parola (a, x; b, i). Sposta il contenuto in giro.
Un modo crudo di spiegare il kerning è questo. Immagina di riempire gli spazi tra ogni lettera con la sabbia. Ogni spazio dovrebbe quindi avere un volume approssimativamente uguale.
E qui c'è il marchio, prima e dopo il kerning.
Creare l'ambigramma è piuttosto facile. Copia e incolla due lettere "b" su un livello diverso.
Capovolgi a sinistra sia verticalmente che orizzontalmente.
Allinea i due come si vede nell'immagine qui sotto.
Crea un tratto di 30 pt e lo espandi. Allinearlo a entrambi i bordi dello stelo.
Afferra il mirino e usa l'opzione Sottrai dall'area della forma per ritagliare l'ambigramma.
Aggiungi un cerchio di 30 pt lasciando abbastanza spazio all'interno. Ridimensionando il simbolo si rivelerà quanto spazio è necessario.
Ed eccoli, ambigramma e parola d'ordine. Spero che questo tutorial ti abbia insegnato una cosa o due sulla tipografia. Non vedo l'ora di vedere i tuoi nomi e le personalità espresse attraverso volti personalizzati!