Autor @jonathanzwhite

Tipografija može učiniti ili razbiti vaš dizajn: postupak odabira vrste

Jedna od najvažnijih vještina koju možete naučiti kao dizajner je kako odabrati vrstu. To je zato što je tekst jedan od glavnih načina na koji dizajneri mogu komunicirati s korisnicima. Tipografija može stvoriti ili pokvariti dizajn.

Tu je ljepota i složenost tipografije. Neki posvećuju cjelokupnu karijeru tipu. Srećom, njihov je rad dobro dokumentiran, pa imamo tipove mrežnih resursa za tipografiju.

Ovaj je članak zamišljen da vam pomogne da naučite kako odabrati vrstu dizajna. Potaknut će vas da istražite kombinacije fontova i kombinacija slova izvan onih koje znate.

Odredite svoju svrhu

Prije nego što učinite bilo što drugo, prvo identificirajte svrhu svog dizajna. Koje informacije želite prenijeti? Koji je medij za vaš dizajn?

Dobar dizajn usklađuje svoju tipografiju s njegovom namjenom. To je zato što je tipografija ključna za postavljanje raspoloženja, tona i stila u vašem dizajnu.

Na primjer, ako dizajnirate čestitku tešku ilustraciju, odaberite font koji odgovara stilu vaše ilustracije. Uskladite svoj tip s ostatkom vašeg dizajna.

Odaberite font koji odgovara stilu vaše ilustracije

Ako dizajnirate odredišnu stranicu koja se temelji na slikama, odaberite jednostavan font koji ne uništava vaše slike. Upotrijebite vrstu kao način da naglasite informacije kako biste prenijeli značenje.

Ako su slike fokus vašeg dizajna, odaberite jednostavne fontove tako da se slike ističu

Prepoznajte svoju publiku

Nakon što odredite svrhu vašeg dizajna, identificirajte svoju publiku. Ovaj je korak presudan jer će dob i interes utjecati na vaše mogućnosti slova.

Nakon što razjasnite svrhu svog dizajna, identificirajte svoju publiku. Ovaj je korak presudan jer informacije o vašim korisnicima kao što su dob, zanimanja i kulturni odgoj mogu utjecati na odluke koje donosite za svoj tip.

Na primjer, neki su fontovi prikladniji za djecu. Kad uče čitati, djeca trebaju vrlo čitljive fontove sa velikodušnim oblicima slova. Dobar primjer za to je Sassoon Primary. Sassoon Primary razvila je Rosemary Sassoon i na temelju njezinog istraživanja o tome koja su slova djeca lako čitala.

Sassoon Primary razvio je Rosemary Sassoon

Ostali fontovi su prikladniji za starije osobe. Seniorima prilagođeni fontovi koriste čitljive veličine, visoke kontrastne boje i izbjegavaju skripte i ukrasne stilove.

Prilikom odabira vrste uzmite u obzir svoju publiku i njihove potrebe. Jednostavno rečeno, suosjećajte sa svojim korisnicima.

Potražite inspiraciju

Pogledajte rad drugih dizajnera. Pokušajte shvatiti kako su donosili odluke o vrsti.

Inspiracija fonta

Za inspiraciju fonta, 100 najboljih besplatnih fontova CreativeBloq sjajan je članak koji će vas staviti u pravi način razmišljanja o odabiru vrste. U članku CreativeBloq objašnjava motivaciju koja stoji iza svakog slova.

Još jedan koristan resurs je kolekcija 100 najvećih besplatnih fontova za 2015. godinu od Awwwards.

Invision je također sakupio ogroman repo resursa za tipografiju. Tamo ćete pronaći puno izvora za inspiraciju.

Typ.io njeguje inspiraciju slova iz cijelog weba

Za inspiraciju sa stvarnih web stranica, pogledajte Typ.io. Web-lokacija njeguje inspiraciju slova s ​​cijelog weba. Pored toga, na dnu svakog uzorka inspiracije web mjesto nudi CSS definicije fonta.

Osim što ćete pogledati posvećena web mjesta za nadahnuće fonta, posjetite omiljene stranice i provjerite koje fontove koriste. Dobar alat za to je WhatTheFont. WhatTheFont je proširenje za Chrome koje vam omogućuje pregled web-fontova lebdanjem iznad miša.

Uparivanje nadahnuća

Osim fontova, također pogledajte inspiraciju za uparivanje fontova. Uparivanje fontova jednako je važno kao i sami fonti. Dobro uparivanje fonta pomaže vam uspostaviti vizualnu hijerarhiju i poboljšati čitljivost vaših dizajna.

Uparivanje fontova jednako je važno kao i sami fonti

Za inspiraciju, započnite s Typewolfom. Typewolf njeguje inspiraciju za uparivanje fontova s ​​različitih stranica. Osim toga, oni također imaju preporuke za font i detaljne vodiče za tipografiju. To je riznica za tipografe.

FontPair također inspirira inspiraciju za uparivanje fontova, posebno za Google Fontove. Možete sortirati po vrstama kombinacija stilova, poput sans-serif i serif, ili serif i serif.

I na kraju, dizajneri na mreži stvaraju tone kolekcija fontova za uparivanje. Na primjer Tipografija: Kombinacije Google fontova i tipografija: Kombinacije Google fontova Volume 2. Jednostavno pretražite "uparivanje fontova" na web lokacijama poput Behance i Dribbble.

Odaberite svoje fontove

Ooružani istraživanjem i inspiracijom spremni ste odabrati svoj tip. Kad je u pitanju odabir vrste, imajte na umu sljedeća načela: čitljivost, čitljivost i svrha.

Prije nego što odaberete font, istražite njegovu namjenu

Odaberite fontove koji su konvencionalni i lako se čitaju. Izbjegavajte izrazito ukrasne fontove u korist jednostavnih i praktičnih fontova. Također, imajte na umu svrhu fonta. Na primjer, neki su fonti više prikladni za zaglavlja, a ne za tekst.

Iz tog razloga, prije nego što odaberete font, istražite njegovu namjenu.

Uparite fontove koji se međusobno suprotstavljaju

U pogledu uparivanja fonta, držite ga jednostavnim s najviše tri različita slova. Osim toga, uparite fontove koji se međusobno suprotstavljaju. Na taj način pomoći ćete usmjeriti oči čitatelja, prvo u zaglavlja, a zatim i u tekstove tijela. Takođe možete stvoriti vizualni kontrast pomoću različitih veličina, boja i težina fonta.

Za web-fontove možete koristiti Google Fontove, Typekit i Wirver Font. Google Fontovi su besplatni, a Typekit i Font Squirrel imaju besplatne i plaćene fontove.

Odredite veličine fonta

Sljedeći korak nakon podmirivanja kombinacije fontova je određivanje veličine. Odličan alat za to je modularna vaga Tim Brown-a, voditelja tipografije u Adobeu. Modularna vaga je sustav za prepoznavanje povijesno ugodnih omjera za izradu vaga za određivanje veličina tipa.

Modularna vaga je sustav za prepoznavanje povijesno ugodnih omjera za izradu vaga za određivanje veličina tipa

Na primjer, možete upotrijebiti ljestvicu na temelju zlatnog omjera. Evo prvih pet izračunatih veličina fonta:

Zlatni omjer (1: 1.618)
1.000 x 1.618 = 1.618
1.618 x 1.618 = 2.618
2.618 x 1.618 = 4.236
4.236 x 1.618 = 6.854
6,884 x 1,618 = 11,089

Jedno od pitanja s kojima biste mogli naići je da je vaš omjer prevelik. Pogledajte što se događa s kasnijim intervalima naše skale na temelju zlatnog omjera.

Zlatni omjer (1: 1.618)
...
11.089 x 1.618 = 17.942
17.942 x 1.618 = 29.03
29.030 x 1.618 = 46.971
46.971 x 1.618 = 75.999
75.999 x 1.618 = 122.966

Kao što vidite, intervali između brojeva počinju postajati preveliki. Za većinu sučelja potrebni su vam manji intervali. Srećom, Modularna ljestvica ima različite omjere na temelju geometrije, prirode i glazbe.

Minor Drugi 15:16
Glavni II 8: 9
Malo treće 5: 6
Glavni treći 4: 5
...

Dakle, umjesto zlatnog omjera, možete koristiti omjere koji daju manje intervale kao što je Savršena Četvrta.

Savršena četvrtina (3: 4)
...
9.969 x 1.333 = 13.288
13.288 x 1.333 = 17.713
17.713 x 1.333 = 23.612
23.612 x 1.333 = 31.475
31.475 x 1.333 = 41.956
41.956 x 1.333 = 55.927

Nakon što se smjestite na skali, možete odabrati veličinu fonta sa svog popisa i zaokružiti ih na najbliži decimalni broj.

Veličine fonta
Zaglavlje 1: 55 px
Zaglavlje 2: 42 px
Zaglavlje 3: 31 px
Zaglavlje 4: 24 px
Zaglavlje 5: 14px
Tijelo: 17px
Natpis: 14px

Metoda Modularna skala koristi matematičku preciznost kako bi se generirale veličine slova. Međutim, to je samo vodič. Ovu metodu koristite kao početnu točku, a zatim prilagodite veličine oku.

Napravite tipografski stilski vodič

Posljednji korak postupka je kreiranje vodiča stilova za vašu tipografiju kako bi se standardizirao tip preko vaših dizajna.

Dijeljeni stilovi u Sketch-u

U programima kao što je Sketch možete stvoriti zajedničke stilove teksta za brzo umetanje teksta sa stilovima koji su već primijenjeni iz vaše smjernice.

U ovom koraku možete prilagoditi i dovršiti tekstualne atribute kao što su boja, težina i veličina.

Riječ o boji: pri odabiru boje uzmite u obzir paletu boja. Odaberite boje za svoj tip koje se podudaraju s vašom paletom boja.

Koristite vodiče za stil da biste standardizirali vrstu u svim svojim dizajnom

U svoj stilski vodič svakako uključite sljedeće stvari: definicije fonta, veličine fonta, boje slova i primjere upotrebe.

Googleove smjernice za tipografiju materijala dizajna dobar su primjer što treba uključiti u stilski vodič. Nekoliko drugih primjera uključuje vodiče za tipografiju Mailchimpa, Applea i Focus Labosa.

Tipografija se odnosi na eksperimentiranje. To je i znanost i umjetnost.

Izazivam vas da izađete iz svoje zone komfora i istražite vrstu vašeg dizajna.

Koji su vaši omiljeni fontovi? Ostavite mi bilješku ili mi pošaljite tweet na Twitteru.

Ako vam se svidio ovaj članak, možda će vam se svidjeti i CSS u Javascriptu s Afroditom, bibliotekom Khan Academy.

Možete me naći na Mediumu gdje objavljujem svaki tjedan. Ili me možete pratiti na Twitteru, gdje objavljujem ne-senzitivne svađe oko dizajna, razvoja frontova i virtualne stvarnosti.

p.s. Ako ste uživali u ovom članku, to bi vam značilo puno ako kliknete i podijelite s prijateljima.