Ieviesiet skaistu tipogrāfiju skicē

Kā dizaineri un izstrādātāji mēs zinām, ka lieliska tipogrāfija ir vairāk nekā tikai patīkama fonta izvēle. Bet kādas ir praktiskās metodes, kuras mēs varam izmantot, lai mūsu tekstu pārceltu uz nākamo līmeni? Un kā mēs varam izpildīt šīs metodes dizaina rīkā, piemēram, Sketch, vai ieviest tos vietnē?

kā no birstēm dabūt akrila krāsu

Šajā rakstā es aplūkošu trīs paņēmienus, kā uzlabot jūsu tipogrāfijas spēli: teksts uz ceļa, slēptās OpenType fontu funkcijas un īpašās rakstzīmes. Šie paņēmieni ir aizraujoši, jo maz cilvēku zina, kā tos izmantot skicē, un tie var palīdzēt padarīt jūsu darbu profesionālāku. Esmu pievienojis šo rakstu ar veltīta tīmekļa lapa resursu un skaistu piemēru galerija, no kuriem smelties iedvesmu un kodu. Nepieciešama lieliska tipogrāfija? Skatiet mūsu apkopojumu par labākajiem bezmaksas fonti .

Teksts uz ceļa

Šie padomi ir daļa no Pītera Novela Sketch Master kursiem - apskatiet, vai vēlaties padziļināt savas prasmes



Šie padomi ir daļa no Pītera Novela Sketch Master kursiem - apskatiet, vai vēlaties padziļināt savas prasmes

“Teksts uz ceļa” ir tad, kad teksta virkne vairs neatrodas uz līdzenas līnijas, bet tā vietā ietinās pielāgotu līniju vai formu. Tas ir visefektīvāk, ja ceļš ir ideāls aplis vai ļoti smalks loks. Jo sarežģītāks vai izliektāks ir jūsu ceļš, jo lielāka iespēja, ka jūsu teksts izskatīsies bērnišķīgs - šo funkciju ir viegli pārspīlēt!

Programmā Sketch teksts uz ceļa ir veca un nedaudz izsmalcināta funkcija, kuru var izjaukt patstāvīgi. Galvenais ir saprast, kā vektora ceļi darbojas zem pārsega, kas attiecas gan uz līnijām, gan uz slēgtajām formām. Katram vektora ceļam ir sākuma punkts un beigu punkts, kā arī virziens datoram
pārvietoties, zīmējot šo ceļu.

Kad izmantojat rīku Sketch’s Vector (pazīstams arī kā pildspalvas rīks), ir viegli atcerēties, kur sākāt zīmēt un kurā virzienā esat novilcinājis savu pielāgoto ceļu. Bet tādām formām kā aplis, kuras, šķiet, ir nepārtraukts ceļš, nav acīmredzama veida, kā uzzināt sākuma punktu vai ceļa virzienu.

Ievadiet rediģēšanas režīmu, atlasot ceļa slāni un nospiežot atgriešanās taustiņu. Skice automātiski izvēlas vektora punktu pa ceļu, un tas ir jūsu sākuma punkts. Nospiežot tabulēšanas taustiņu, Sketch atlasīs nākamo vektora punktu, virzoties pa ceļu (un tādējādi atklājot) ceļa virzienu.

Tas ir svarīgi ceļa tekstam, jo ​​ceļa virziens ir virziens, kurā teksts virzās. Ja ceļš nepārvietojas no kreisās uz labo pusi, jūsu teksts tiks parādīts otrādi. Lai mainītu ceļa virzienu, izvēlņu joslā dodieties uz sadaļu ‘Slānis> Ceļi> Apgrieztā secība’.

Tagad jūsu ceļš ir gatavs, ir pienācis laiks to savienot ar teksta slāni. Teksta slānim jābūt tieši virs ceļa slāņa Slāņi, un es iesaku grupēt abus slāņus, lai nodrošinātu, ka tas nemainās. Atlasiet teksta slāni un pēc tam pārejiet uz “Tips> Teksts uz ceļa”. Pēc tam velciet, lai mainītu teksta slāni ap audeklu, līdz teksts atrodas tieši tajā vietā, kur vēlaties.

Galvenie padomi

Tas var aizņemt nedaudz laika, jo šķiet, ka teksta slāņa pozīcija ir maz saistīta ar vietu, kur tā parādās pa ceļu. Turklāt Sketch renderēšanas dzinējs var paklupt, strādājot ar tekstu ceļā, šķiet, ka tas tiek apgriezts dīvainās vietās. Ātra tuvināšana un tālināšana atkal novērsīs šo renderēšanas kļūdu.

Pēdējais padoms darbam ar Tekstu uz ceļa: Es atklāju, ka šī funkcija vislabāk darbojas, ja ceļš ir atvērts kā līnija, nevis ir slēgts un nepārtraukts kā aplis. Skices šķēres jums tur palīdzēs, un es esmu uzrakstījis viss raksts par to, kā to izmantot.

Savā vietnē varat ievietot tekstu ceļā, izmantojot SVG elementu. Sketch pašlaik neatbalsta šo funkciju eksportētajos SVG, taču pats elementa pievienošana nevar būt vienkāršāka. Resursu lapā atradīsit CodePen veidni, kas to atvieglos.

Iedomātā fonta funkcijas

MacOS fontu panelī ir slēpta izvēlnes opcija, lai parādītu tipogrāfijas paneli, nodrošinot piekļuvi papildu fontu funkcijām

MacOS fontu panelī ir slēpta izvēlnes opcija, lai parādītu tipogrāfijas paneli, nodrošinot piekļuvi papildu fontu funkcijām

Kad izvēlaties fontu un sākat rakstīt, redzat tikai daļu no tā, uz ko fonts spēj. Mazie vāciņi, diskrecionārās ligatūras un aizstājējzīmes - bieži vien pazīstamas kā OpenType funkcijas - ir tikai dažas no slēptajām iespējām.

kā gleznot uguni ar akvareļu

Lielākā daļa cilvēku nezina, ka OpenType funkcijas ir pieejamas Sketch un pat citās MacOS lietotnēs, piemēram, iWork. Izmantojot skici, teksta slānī ievadiet rediģēšanas režīmu un atlasiet visu. Pēc tam atveriet noklusējuma macOS fontu paneli, pārejot uz augšu ‘Skatīt> Rādīt fontus’. Fontu paneļa rīkjoslā ir zobrata ikonas izvēlne netālu no kreisās puses, un tajā ir noslēpumaini nosaukta opcija “Tipogrāfija ...”. Tur notiek burvība!

Tipogrāfijas panelis parāda, kuras izdomāto fontu funkcijas ir pieejamas jūsu atlasītajam tekstam. Piemēram, augšpusē jūs bieži atradīsit izvēles rūtiņu “Reti Ligatūras”, kas iespējo dekoratīvākas burtu kombinācijas, piemēram, “Qu” vai “ity”.

Ir daudz aizraujošu tipogrāfisku funkciju, kuras var iekļaut fontu, bet šeit ir vēl viens no maniem izlases veidiem: mazie vāciņi. Mazie vāciņi ir miniatūru lielo burtu kopums, kas parasti ir vienādā augstumā ar mazo burtu “x”. Izmantojot paneli Typography, visus mazos burtus var pārveidot par maziem burtiem, kas lieliski izskatās pēc īsiem parakstiem vai raksta pirmās rindas.

Lietas, kas jāatceras

Lai gan šīm fontu funkcijām var piekļūt no skices, tās var būt nedaudz izsmalcinātas. Lūk, kas jums jāzina: Pirmkārt, kad tipogrāfijas panelī ieslēdzat un izslēdzat funkcijas, pirms izmaiņu veikšanas, iespējams, būs jāgaida brīdis vai virziet kursoru virs atlasītā teksta.

Otrkārt, ja maināt fonta lielumu vai svaru, izmantojot Sketch’s Inspector, visas izdomātās tipogrāfiskās funkcijas tiks atiestatītas uz noklusējuma iestatījumiem; Es iesaku tā vietā pielāgot šos divus atribūtus Fontu panelī. Citu ar fontu saistītu atribūtu (piemēram, krāsu, rakstzīmju atstarpes vai līnijas augstuma) maiņa Sketch's Inspector neietekmēs jūsu tipogrāfiskās funkcijas.

Šo iedomāto fontu funkciju ieviešana jūsu vietnē ir tikpat vienkārša kā dažu CSS rekvizītu pievienošana, ko tagad atbalsta visas galvenās pārlūkprogrammas.

Īpašās rakstzīmes

Fontu grāmata Šajā lietotnē ir visu fontu iekļauto rakstzīmju repertuārs, kurus pēc tam varat vilkt un nomest skicē

Fontu grāmata Šajā lietotnē ir visu fontu iekļauto rakstzīmju repertuārs, kurus pēc tam varat vilkt un nomest skicē

Papildus izdomātām funkcijām, piemēram, ligatūrām un maziem vāciņiem, daudzos fontos ir īpašas rakstzīmes, piemēram, dingbats, uzplaukumi un simboli. Šī raksta sākuma attēlā pudele, saules ikona un rokas žests ir daļa no dažādiem fontiem.

Strādājot ar savu dizainu, ir divi veidi, kā piekļūt īpašajām rakstzīmēm, kas iekļautas fonā. Pirmais ir izmantot Apple iebūvēto lietotni Fontu grāmata, kas ļauj jums apskatīt katra fonta ‘Repertuāru’ (burtu un burtu režģi), rīkjoslā noklikšķinot uz režģa ikonas. Ritinot garām visizplatītākajām rakstzīmēm (A – Z), jūs sāksit redzēt paplašināto ligatūru, mazo vāciņu, diakritiku (akcentu zīmju) un īpašo simbolu kopu, ko tipa dizainers ar mīlestību ir izveidojis tādiem nerdiem kā mēs.

Pārvietojot kursoru virs rakstzīmes, jūs redzēsiet nelielu rīka padomu ar rakstzīmes nosaukumu un Unicode vērtību. Vislabākais ir tas, ka šo rakstzīmi varat izvilkt no Fontu grāmatas un uz jebkuru citu lietotni (piemēram, Skice), kur rediģējat tekstu. Pirms velciet un nometiet, vienkārši pārliecinieties, vai skicē jūsu teksta slānis ir rediģēšanas režīmā - apzīmēts ar mirgojošu teksta kursoru.

kā pievienot pielāgotas otas klipu studijas krāsai

Raksts Rakstzīmes

Tas atklāj īpašu rakstzīmju visumu - ieskaitot retus burtus, piktogrāfus un Unicode simbolus

Tas atklāj īpašu rakstzīmju visumu - ieskaitot retus burtus, piktogrāfus un Unicode simbolus

Fontu grāmata nav vienīgais veids, kā piekļūt šīm īpašajām rakstzīmēm; lielāko daļu no tām var ievietot, izmantojot paneli Rakstzīmes. Šim panelim var piekļūt Sketch un visā MacOS, izvēlnes joslas izvēlnes Rediģēt apakšdaļā (tagad to sauc par “Emocijas un simboli”). Ja rakstzīmju panelis izskatās mazs, augšējā labajā stūrī noklikšķiniet uz mazās ikonas, kas izskatās kā logs ar simbolu ⌘ iekšpusē - tas pārslēdzas starp kompaktu un izvērstu paneli.

Paplašinātais rakstzīmju panelis ir spēcīgs, ļaujot piekļūt neskaitāmiem simboliem, pieturzīmēm un piktogrammām. Vienkārši veiciet dubultklikšķi uz vienas no šīm rakstzīmēm, lai to ievietotu blakus tekstam. Mans personīgais favorīts ir skaitlis (‘Nē’), kas ir daudz elegantāks par “#” un kompaktāks par “Number:” rakstīšanu.

Lai pielāgotu kategoriju sarakstu sānjoslā, noklikšķiniet uz zobrata ikonas paneļa Rakstzīmes augšdaļā. Jūs pat varat pievienot Unicode sarakstam, kas ļauj pārlūkot katru no tūkstošiem ar Unicode saderīgo rakstzīmju. Citiem vārdiem sakot, tas ļauj piekļūt gandrīz ikvienam varonim, kuru jūs kādreiz varētu iedomāties! Es arī uzskatu, ka ir lietderīgi ievilkt īpašās rakstzīmes, kuras bieži lietoju, izlases sarakstā, kas novērš nepieciešamību meklēt šo rakstzīmi katru reizi, kad vēlaties to izmantot.

Kad runa ir par dizaina ieviešanu tīmeklī, īpašu rakstzīmju ievietošana ir vienkārša. Jebkuru Unicode rakstzīmi vietnē var izmantot, vai nu atsaucoties uz rakstzīmes atbilstošo HTML vērtību, vai izmantojot CSS ģenerēto saturu ar rakstzīmes Unicode hex vērtību. Resursu lapā esmu izveidojis saiti ar lielisku vietni, kur ātri atrast šīs vērtības jebkuram rakstzīmei, un citu vietni, kurā paskaidrots, kā tās ieviest CSS.

Secinājums

Kā jūs varat pateikt, šis raksts tikai noslīpē katras tēmas virsmu. Tāpēc es tik daudz pieminēju resursu lapu! Tajā ietilpst skaistu piemēru galerija, atlasīti bezmaksas fonti, kas aprīkoti ar izmēģināšanas OpenType funkcijām, savi Sketch projekta faili, kurus izdalīt, kā arī daudzas citas noderīgas vietnes un veidnes. Laimīgu drukāšanu!

Šis raksts sākotnēji tika publicēts net žurnāls 284. izdevums. Pērciet to šeit.