Kujundustrend: viilutatud tekst ja tüpograafia
Puristid väidavad, et te ei tohiks kunagi tüpograafiat muuta. Tähed peaksid ilmuma tüübikunstniku kavandatud viisil või peaksite valima mõne muu fondi. Kuigi see on enamasti tõsi, on erandiks viilutatud teksti trend.
Tore efekt muudab tüübi elemendid välja nägema sellised, nagu nad oleks lõigatud täpsustööriistaga ja võivad lisada logotüüpidele, pealkirjadele ja lihtsatele tekstiplokkidele visuaalse huvi. Viilutatud tekstiefektid võivad varieeruda ülimalt peenetest (näiteks puuduva tähega pisikesest tähest) kuni sõnade suurema osa puudumiseni.
Viilutatud teksti kasutamisel tuleks silmas pidada seda, et sõnad peavad alati olema loetavad - mis mõte seal muidu on? - ja peaksite tähelepanelikult jälgima, et soovimatud tähekombinatsioonid või sõnad ei ilmu viilutamise tõttu. Siin on mõned näited disainilahendustest, mis teevad seda hästi, kuidas muuta see teie jaoks töötavaks.
Uurige Envato elemente
Traditsiooniline viil
Viilutatud tekst sisaldab peaaegu kihilist välimust ühe tekstielemendiga, näiteks sõnaga või väikese sõnagrupiga, mis on lõigatud ja kattuvad kahe tasapinnaga. See efekt loob sügavuse ja võib lihtsa märkide komplekti visuaalselt huvitavaks muuta.
Resoluut kasutab seda efekti koos ampersandiga, et juhtida kasutajad disaini keskmesse. Viilutatud tekst peegeldab allpool olevat sõnumit, mille kohaselt keskendub ettevõte “suhtumise digitaalsele kujundusele”, kuna viilutatud tekst annab teatud sirge kirjaga erilise vibe.
See tehnika töötab kõige paremini siis, kui märkide komplektid on lihtsad (mõelge kõigepealt sans-serif-kirjatüüpidele) ja sõnadel on loomulik murdepunkt, kus neid saab lõigata ja säilitada loetavus.
Teksti viilutamine ja fotod
Kihiline efekt ei piirdu fondi ja ruumi kombinatsiooniga. Disainerid saavad ka pilte ja teksti kasutada ka laheda viilutatud efekti loomiseks, nagu näiteks ülaltoodud näites raamatust The Shift.
Üksiku pildi (ka viilutatud) kaldus viilukombinatsioonid koos kirjaga tõmbavad kasutaja kujundusse.
Ehkki mõnda sõna on alguses pisut raskem eristada, on animatsioonide vahel piisavalt aega, et sõnum hõlpsalt välja mõelda.
See suundumus sobib hästi digitaalsete agentuuride ja portfellisaitide jaoks, kuna see on moodsa väljanägemise ja olemuse tutvustamise võimalus, aga ka loominguliste osade esiletoomine.
Viil animatsiooniga
Viilutatud teksti efekti saab kombineerida ka teiste trendikate kujunduselementidega. Viilutamise segamine animatsiooniga võib anda kena visuaalse elemendi.
Ülaltoodud näites on kõik viilutatud tekstielemendid tegelikult navigeerimine. Kasutajad saavad klõpsata mõlemal elemendil, kuid muljetavaldavam on hõljutav toiming, mis viilutatud teksti kokku paneb.
Logotüüpide jaoks
Viilutatud tekst võib olla lõbus viis logo loomiseks, kui ainsad elemendid, millega peate töötama, on tekst. Lõbus logotüüp võib olla midagi enamat kui kaubamärgi tuntuse märk; see võib olla ka väga graafiline element mitmel otstarbel kasutamiseks, näiteks ülaltoodud särgi kujundus.
Viilutatud tekstiga töötades otsige viilutamiseks loomulikku kuju ja kalle, et seda oleks huvitav vaadata, säilitades samas lugemismugavuse.
Pöörake tähelepanu sellele, kuidas viilutamine loob tühja ruumi. Ülaltoodud kujundus kasutab selle sees suurt osa lisateavet. Viilutamise tavalisem kasutamine on sageli õhuke joon, kuid lähenemisviisid (nagu näete selle postituse näidetest) võivad üsna dramaatiliselt erineda.
Loo interaktiivsus
Luba kasutajatel viilida oma tekst interaktiivse teksti ja harjakombinatsiooni abil, näiteks ülaltoodud näites. Kuigi tekst pole iseenesest täpselt viilutatud, luuakse efekt kunstitegemise protsessis.
Kõik tööriistad, mis võimaldavad kasutajatel kujundust muuta, võivad interaktiivse komponendi tõttu viibida saidil kauem.
Viilutatud vertikaalsed löögid
Vertikaalsed viilud kipuvad olema lühemad, kuna iga lõige on ühe tähe osa.Ehkki tundub, et enamik disainereid kasutab suundumust samal viisil horisontaalselt orienteeritud viiluga, võivad jaotustükid olla ka vertikaalsed.
Vertikaalsed viilud kipuvad olema lühemad, kuna iga lõige on ühe tähe osa. Vertikaalsete viilude toimimise trikk on järjepidevus. Lõikamisviisid peaksid üksteist jäljendama, nii et tähed näeksid välja nagu käiksid koos. See viilutamismeetod peaks välja nägema nii, nagu see oleks peaaegu trükitud kirja osa. (Mitte ülaltoodud näites, et viilud on tähelt ühesuurused ja samadel tähtedel on samad viilud.)
Luua visuaalne voog
Lõiked loovad peaaegu lugemise kiireloomulisuse, nii et tõmbad tähed üle ekraani peamise visuaali.Viilutatud teksti - olgu see siis mõeldud või mitte - tagajärg on see, et see loob visuaalse voo. Kasutajasilm jälgib seda ümbritseva viilu ja valge ruumi suunda.
Vaadake logotüüpi ülaltoodud näites. Kui viilud on R- ja O-s Robocathis (pluss tavaline puuduv c-osa), on ilmne suunatu tõmbamine üle ekraani vasakult paremale.
Tõmme on tugevam kui see, mida seostate tavalise lugemisega (ka vasakult paremale), sest lõigud lükkavad teid tähemärgid kiiresti läbi. Lõiked loovad peaaegu lugemise kiireloomulisuse, nii et tõmbad tähed üle ekraani peamise visuaali.
Lisage kirjatähtedele rõhuasetus
Lõplik - ja võib-olla kõige kaalukam - põhjus viilutatud teksti kujundamise suundumuse kasutamiseks on rõhu lisamine kirjadele või sõnumile. Lõikamine võib tähendada suurt hulka tähtede muutmist, kui kujundis puudub mõni märk.
Ülaltoodud MJND kasutab peitmiseks rohkem kihtidefekti või kirjavormide viilutamist, et sõnumile rõhku panna. Pilt võib hõlpsalt kogu siin toimuva suhelda, kuid see efekt aitab kasutaja põhisõnumite juurde tagasi tuua. Kombinatsioon on lihtne, tõhus ja visuaalselt huvitav.
Õppematerjalid
Projektide jaoks viilutatud tekstirefektide loomiseks on mõned viisid, sõltuvalt sellest, mida täpselt proovite luua. Kõige populaarsemateks valikuteks on teksti-efekti loomine käsitsi redigeerimistarkvara abil või CSS-i abil veebiprojektide efekti loomiseks.
Siin on kõigi nende võimaluste õpetused, nii et võite proovida luua trendikat viilutatud teksti efekti:
- Video: kuidas viilutatud teksti luua Adobe Illustratoris
- Lõika tekstiefektilõik CSS-i abil
Järeldus
Viilutatud teksti suundumuse kasutamine võib olla pisut keeruline, kuna see hõlmab tüübi elementide muutmist. On oluline, et loetavus ei läheks kaduma või võite selle efektiga kasutajad kaotada.
Viilutatud tekstiefektid võivad siiski olla lõbus lahendus ja aidata luua fookuspunkti. Animatsiooni lisamine võib aidata ka selle uuele tasemele viia. (Paljud selles postituses sisalduvad näited teevad just seda; külastage kindlasti neid veebisaite ja klõpsake ümber.)