Kaip įvaldyti maketavimo dizainą

Kaip įvaldyti maketavimo dizainą
Rick Davis

Išsamus vizualinio dizaino pagrindų mokymosi vadovas.

Milijono dolerių vertės klausimas: kokia yra gero dizaino paslaptis?

Apie tai galime kalbėti filosofiškai, bet apskritai gero dizaino "paslaptis" slypi tame, kaip organizuojate vaizdinius elementus savo drobės ir vienas kito atžvilgiu. Iš esmės ką tik aprašėme maketavimo dizainą, kuris, kai apie jį pagalvojate, yra visur, kur tik pažvelgsite.

Pavyzdžiui, žurnalo išdėstymas. Jų dizainas atitinka klasikinę tinklelio sistemą (apie tinklelius tuoj sužinosime viską). Viskas paprastai lygiuojama kairėje, dešinėje ir apačioje. Ypač stulpeliai yra aiškiai išlyginti, todėl puslapis yra ne tik vizualiai patrauklus, bet ir lengvai skaitomas bei autoritetingas. Didelės antraštės patraukia žiūrovo dėmesį.dėmesį, o paantraštė yra kontrastingo dydžio, kad būtų sukurta vizuali informacijos hierarchija.

Linda Gaom, Behance

Dėl visų šių savybių puslapio dizainas yra švarus, struktūrizuotas ir lengvai skaitomas, o tai atitinka patarimus, apie kuriuos kalbėsime toliau. Tačiau pirmiausia daugiau sužinokime apie patį maketavimo dizainą.

Kas yra maketavimo dizainas?

Maketavimo dizainas yra susijęs su grafinių elementų išdėstymu, siekiant patraukti skaitytojo dėmesį ir vizualiai patraukliai perteikti tam tikrą žinutę.

Čia kalbame ne apie logotipų dizainą, o apie spausdintinės medžiagos, pavyzdžiui, laikraščių, žurnalų, plakatų, ir jų skaitmeninių atitikmenų dizainą, taip pat apie žiniatinklio, programėlių ar UX/UI dizainą.

Žodis "maketas" mums pateikia daug užuominų. Jis reiškia iš anksto nustatytų elementų išdėstymą puslapyje.

Kai maketavimas yra veiksmingas, jis gerai atrodo ir padeda žiūrovui suprasti žinutę, kurią siekiama perteikti dizainu. Todėl maketavimo supratimas yra labai svarbus kuriant patrauklias, veiksmingas, patogias naudoti ir malonias kompozicijas.

Jei maketas gerai neperteikia savo žinutės auditorijai arba, kitaip tariant, jis "blogai skaitosi", dizainas bus neveiksmingas, kad ir kaip madingai jis atrodytų. Maketavimo dizaino srityje turinys yra svarbesnis už tendencijas ir gudrybes.

Maketavimo dizaino paskirtis

Greitai perduoti žinutę

Tai labai svarbu. Maketavimo dizainas nustato ryšį tarp grafinių priemonių, kad būtų pasiektas sklandus akių judesių srautas, užtikrinantis didžiausią veiksmingumą ir poveikį.

Sukurti pusiausvyrą

Naudojimasis maketavimo principais yra paprasčiausias būdas dizaino projektuose sukurti pusiausvyros ir simetrijos pojūtį ir netapti nuobodžiam.

Sukurti darną

Maketavimas padeda išdėstyti daugybę dizaino elementų taip, kad jie būtų lengvai įsisavinami, nuoseklūs ir logiški.

Kurti grožį

Pusiausvyra ir struktūra natūraliai sukuria grožį. Jei maketavimo dizainas sukurtas teisingai, jis automatiškai taps vizualiai patrauklus žiūrovui. Kuo mažiau pastangų žiūrovams reikės įdėti, kad suprastų pranešimą, tuo patrauklesnis atrodys jūsų dizainas.

Frank Philippin knygos "I Used to Be a Design Student: Then - Now" dizaineris. Šaltinis: DesignBoom

Maketavimo dizaino elementai

Tekstas

Tai apima ne tik pagrindinį tekstą ar pastraipas, bet ir antraštes, paantraštes, antraštes ir paraštes. Pasirinkę tipografiją, spalvą ir dydį pasieksite skirtingą poveikį, kaip jūsų maketą supras jūsų auditorija.

Vaizdas

Dažniausiai pasitaikantys vaizdų tipai yra nuotraukos, iliustracijos arba infografikos.

Formos

Formos gali būti geometrinės, t. y. labai kampuotos, arba organinės, imituojančios gamtos pasaulį. Jos taip pat gali būti abstrakčios. Abstrakčios formos pastaraisiais metais buvo labai madingos, nes žiniatinklio svetainių dizaineriai jas įtraukė į sudėtingas ir išsiplėtusias kompozicijas.

Formos gali pakeisti paveikslėlį arba gali būti naudojamos puslapiui papildyti grafiniais elementais, tekstui paryškinti ar erdvei tarp kitų vaizdinių elementų apibrėžti.

Baltoji erdvė

Bet kokiame maketo dizaine bus tam tikra balta erdvė, kuri leis elementams kvėpuoti ir išsiskirti.

Auksiniai maketavimo dizaino principai

Pastebėsite, kad maketavimo principai atitinka daugelį pagrindinių dizaino principų, pvz., tam tikros spalvos, tipografija, kartojimas, kontrastas, hierarchija ir pusiausvyra.

Principas Nr. 1. Naudokite tinklelius

Tinkleliai padeda dizaineriams išdėstyti įvairius dizaino elementus, pvz., tekstą ir vaizdus, taip, kad jie atrodytų nuoseklūs ir lengvai suprantami.

Jie suteikia tvarkos pojūtį, neleidžia elementams užgožti vieniems kitų, o svarbiausia - tinkleliai taip pat padės išlyginti jūsų darbą, todėl jis atrodys švaresnis ir profesionalesnis.

Šaltinis: hgmlegal.com

Tinklelių anatomija

Galbūt manote, kad tai tik vertikalios ir horizontalios linijos, tačiau tinklelį sudaro kelios dalys. Tiesą sakant, daugybė. Štai svarbiausi terminai, kuriuos reikia žinoti apie pagrindinį tinklelį:

  • Formatas tai visas galutinio dizaino plotas. Taigi, jei kuriate dizainą spaudai, formatas yra puslapis, o jei esate žiniatinklio dizaineris, formatas yra žiniatinklio puslapis arba naršyklės langas.
  • Maržos tai sąmoningai tuščios erdvės tarp formato ir dizaino.
  • Srautotiekiai tai horizontalios linijos, atskiriančios jūsų maketą į lygiagrečias dalis. Srauto linijos padeda užtikrinti dizaino skaitomumą ir padeda skaitytojui teisingai sekti turinį.
  • Moduliai tai blokai, kuriuos sudaro bet kurio tinklelio horizontalios linijos ir vertikalios srautinės linijos. Jei pagalvojate, tai yra bet kurio tinklelio sudedamosios dalys. Visi jūsų vertikalūs moduliai sukuria stulpelius, o visi horizontalūs tinkleliai - eilutes.
  • Regionai tai vertikaliai arba horizontaliai sujungtų modulių grupės. Nėra jokių taisyklių, kaip nuspręsite jas organizuoti.

Šaltinis: Radversity

Tinklelių tipai

Maketavimo tinkleliai pirmą kartą buvo naudojami ranka rašytiems tekstams popieriuje išdėstyti.

Jie atsirado dar XIII a., kai prancūzų dailininkas Villardas De sujungė tinklelių sistemą su aukso pjūviu ir sukūrė spausdintų puslapių maketus su paraštėmis. Šią tinklelių sistemą galima matyti iki šiol, nes tai įrodo dauguma spausdintų knygų ir žurnalų maketų. Leidėjai, redaktoriai ir dizaineriai nori naudoti standartinius tinklelius ne tik todėl, kad jie gerai atrodo, bet ir todėl, kad skaitytojai įpratotikėtis, kad tam tikri dizaino elementai bus tam tikroje vietoje.

Tinkleliai gali būti projektuojami dviem būdais: simetriški arba asimetriški. Simetriniai tinkleliai atitinka centrinę liniją, kurioje vertikali ir horizontali sritys yra vienodos, o stulpeliai yra vienodo pločio.

Į asimetrinis tinklelis , kaip matyti iš pavadinimo, ne visos paraštės ir stulpeliai yra vienodi.

Remiantis šia klasifikacija, pasaulyje naudojami penki pagrindiniai išdėstymo tinklelių tipai, kuriais galite pasikliauti:

Rankraščių tinkleliai Tai labiausiai paplitęs dokumentų tinklelio tipas. Jie atskiria antraštę, poraštę ir paraštes ir iš esmės sukuria stačiakampį formato (arba puslapio) viduje, kuris apibrėžia jūsų teksto ribas. Jais remiasi žurnalai, laikraščiai ir knygos. Taigi, tai tikriausiai jums geriausiai pažįstamas maketavimas.

Šaltinis: UXplanet

Šaltinis: Radversity

Stulpelių tinkleliai Tai dar vienas mėgstamiausias žurnalų leidybos būdas. Tipiniame žurnalo makete stulpelių tinkleliai naudojami tekstui suskirstyti į lengvai skaitomas dalis. Tačiau jie labai populiarūs ir interneto svetainėse. Galima naudoti nuo dviejų iki šešių tinklelių. Galima naudoti ir daugiau, tačiau tai nėra įprasta. Labai svarbu, kad tarpai tarp stulpelių, arba latakai, būtų vienodai nutolę vienas nuo kito.kita.

Pavyzdžiui, laikraščiuose naudojami simetriški stulpelių tinkleliai, o žiniatinklio dizaine pirmenybė teikiama asimetriškam stulpelių tinkleliui.

Šaltinis: UX Planet

Šaltinis: Radversity

Moduliniai tinkleliai yra panašūs į stulpelių tinklelį, tačiau juose taip pat atsižvelgiama į horizontalias srauto linijas. Šio tipo tinklelio reikia, kai reikia sutvarkyti įvairius maketo elementus, o stulpelių tinklelių tiesiog nepakanka.

Moduliniai tinkleliai turi vienodo dydžio modulius, todėl labai lengva įvairiais būdais vizualizuoti erdvines zonas.

Šaltinis: UX Planet

Šaltinis: Radversity

Baziniai tinkleliai Tai puiki priemonė teksto kompozicijoms. Pagrindinė linija - tai linija, į kurią rašomas tekstas, o tarpas tarp dviejų pagrindinių linijų. Svarstote, kokio dydžio turėtų būti jūsų antraštės ar paantraštės?

Pagrindinės linijos tinkleliai padeda suteikti tekstui sklandų ritmą.

Šaltinis: UX Planet

Šaltinis: Fragaria

Hierarchiniai tinkleliai atrodo mažiau panašūs į tinklelį nei visi jų atitikmenys. Nepaisant to, jie labai naudingi organizuojant dizaino elementus pagal jų svarbą. Hierarchiniai tinkleliai gali būti pagrįsti moduliniais tinkleliais arba netgi galite sukurti savo. Interneto svetainėse šis tinklelis naudojamas dažnai, ypač skaitmeniniai žurnalai ir laikraščiai linkę labiau pasikliauti hierarchiniais tinkleliais, o ne stulpelių tinkleliais, pereidami prie tapimoskaitmeninis.

Šaltinis: "UX Plane

Principas Nr. 2. Naudokite neigiamą erdvę

Dažnai manome, kad tuštuma, tyla ar spalvų trūkumas yra blogas dalykas. Tačiau nepagalvojame, kad jie yra tvirtas kontrasto pagrindas.

Neigiama erdvė, dar vadinama baltąja erdve, yra ta dizaino sritis, kurioje nėra jokių faktinių elementų. Tai palikta tuščia sritis. Ji ne tik supa jūsų objektus, bet ir sukuria būtinus ryšius tarp jų. Dėl šios priežasties neigiama erdvė yra teisėtas dizaino elementas ir turi didžiulę įtaką tam, koks veiksmingas yra jūsų maketo dizainas.

Gera ir bloga neigiama erdvė

Neigiama erdvė padės atskirti įvairias dizaino sritis ir leis maketui kvėpuoti. Ji padeda užtikrinti vizualinę hierarchiją ir vizualinę pusiausvyrą, sutelkia naudotojo dėmesį į pagrindinius elementus, sumažina dėmesio blaškymo lygį ir, galiausiai, suteikia dizainui stiliaus ir elegancijos.

Nepatyrę dizaineriai gali būti linkę užpildyti kuo didesnę drobės dalį, padidindami tekstą, išpūsdami logotipą ar paveikslėlį. Tačiau suteikdami elementams erdvės, žiūrovas greičiau ir patogiau pastebės tam tikrus informacinius signalus.

Jei viskas šaukia, kad atkreiptumėte žiūrovo dėmesį, nieko neišgirsite.

- Aaronas Walteris, "Dizainas emocijoms

Lengvas būdas nustatyti neigiamą erdvę - naudoti modulinį tinklelį. Uždėję jį ant savo dizaino, galėsite lengvai įsivaizduoti, kurie moduliai gali likti tušti, o kurie turėtų būti užpildyti.

Brunswicker dizaineris, šaltinis: Codesignmag.com

Principas Nr. 3. Pasirinkite vieną pagrindinį tašką

Ar klientas kada nors prašė jūsų padidinti logotipą? O tada dar labiau padidinti antraštę?

Taip pat žr: Kas yra kerningas?

Negalima pabrėžti visko. Tai paneigia gero dizaino esmę. Kaip ir laikas, dėmesys yra santykinis. Kad vienas elementas išsiskirtų, kitas turi tarnauti kaip fonas. Kai kurie elementai turi dominuoti prieš kitus, kad jūsų dizainas būtų vizualiai hierarchiškas.

Pagrindinis dizaino elementas - tai elementas, turintis didžiausią vizualinį svorį. Tai elementas, kuris pirmiausia patraukia akį, labiau nei bet kuris kitas jūsų maketo elementas.

Židinys jūsų auditorijai paskelbs, kur prasideda jų kelionė žiūrint jūsų dizainą. Taigi tai yra jūsų pasakojamos istorijos pradžia.

Paprastai tai galima pasiekti naudojant didelį vaizdą arba didelį tipografinį šaltinį. Atkreipkite dėmesį, koks veiksmingas yra toliau pateiktas centrinis taškas

Sukurta Braulio Amado Bloomberg Businessweek, Šaltinis: Gražu, kad

Nors pagrindinis taškas pritrauks jūsų auditorijos dėmesį, kita taisyklė padės juo vadovautis.

Principas Nr. 4. Galvokite apie artumą ir srautą

Artumo principas yra paprastas. Užtikrinkite, kad vienas su kitu susiję elementai būtų išdėstyti kartu.

Artimumas rodo, kad vaizdinės priemonės yra susijusios ir tampa vienu vaizdiniu vienetu, padedančiu organizuoti maketą.

Todėl grupuokite tik tuos dizaino išteklius, kurie yra susiję tarpusavyje, ir naudokite dizaino informacijos kišenes, kad nukreiptumėte auditoriją į atitinkamą turinį, kurį ji turi naudoti. Tai taip pat vadinama srauto principu.

Šaltinis: Satori Graphics

Gerai sukurtame dizaine žiūrovų akis bus lengvai vedama nuo vieno elemento prie kito. Pagrindiniai taškai patrauks akį ir taps poilsio vieta, o kiti elementai suteiks kryptį.

Paprasčiausias būdas tai suprasti yra mūsų svetainės pavyzdys. Grafika aiškiai atskirta nuo teksto, taip pat ir raginimai atlikti veiksmus, todėl žiūrovo dėmesys nukreipiamas nuo vienos informacijos grupės prie kitos.

Principas Nr. 5. Naudokite kontrastą

Įsitikinkite, kad dizainas yra pakankamai kontrastingas.

Kontrastas padeda sutvarkyti dizainą, sukuria labai reikalingą hierarchiją ir pabrėžia tai, kas svarbu.

Be to, geras kontrasto panaudojimas taip pat prideda vizualinio įdomumo visam dizainui. Pripažinkime, kad maketas, kuriame viskas yra vienodo dydžio, formos ar spalvos, atrodys nuobodžiai. Kontrastas viską paįvairina.

Pirma mintis gali būti spalvų kontrastas, pavyzdžiui, šilta ir šalta, tamsi ir šviesi, mėlyna ir oranžinė. Tačiau, nors spalva yra labai svarbus kontrasto principas, taip pat egzistuoja šrifto, lygiavimo ir dydžio kontrastai. Nepamirškite, kad kontrastas taip pat yra santykinis. Jis turi reikšmę tik tada, kai yra gretinamas su kitais elementais.

Štai keletas maketų pavyzdžių, kuriuose ši taisyklė taikoma protingai ir gražiai. Atkreipkite dėmesį į tipografijos, spalvų ir net elementų dydžio kontrastą.

Taip pat žr: Kaip sukurti savo "Instagram" svarbiausiųjų viršelių dizainą

Šaltinis: IAG suderinimo veiksmų planas

Principas Nr. 6. Kartojimas, modelis, ritmas

Kai galvojame apie pasikartojimą, galvojame apie tą patį elementą vėl ir vėl.

Tačiau dizaine yra kitaip. Tai tikrai nėra taip nuobodu. Tinkamai panaudotas pasikartojimas iš tikrųjų gali sustiprinti jūsų dizainą.

Pasistenkite nustatyti ir pakartotinai naudoti motyvą visame makete, kad įvairios sritys jaustųsi susijusios ir būtų tos pačios kompozicijos dalis. Tai padės jūsų dizainui turėti temą. Kartodami elementus ne tik pateiksite pagal auditorijos lūkesčius, bet ir pagerinsite naudotojų patirtį. Būdami nuoseklūs, naudotojai jausis patogiau.

Tai galite padaryti kartodami figūras ar simbolius. Arba net spalvų schemą, šriftą ir apskritai tą patį stilių.

Geras įprotis - naudoti didelės šeimos šriftą. Apribokite skirtingų raštų, linijų svorių ir (arba) stilių bei spalvų skaičių ir kartokite juos visame tekste. Taip pat stenkitės išlaikyti tą patį paveikslėlių ir grafikos stilių. Pavyzdžiui, naudokite to paties dailininko iliustracijas.

Šaltinis: Thepentool.co

Štai ir viskas. Tai šeši principai, kurie padės jums sutvarkyti dizainą ir sukurti švaresnį, profesionalesnį ir darnesnį maketą.

Tačiau jūsų kelionė čia nesibaigia. Grafinis dizainas nėra tikslus mokslas, todėl nereikėtų apsiriboti vien patarimais ir principais. Kaip ir visose kūrybos srityse, nėra griežtos taisyklės. Subtiliai išsiverždami iš šių patarimų, savo dizainui suteiksite gilumo ir įvairovės.

Nepaisant to, jie yra puikus atspirties taškas, todėl raginame juos išbandyti. Ir praneškite mums, kaip jie pasiteisino!

Atsisiųskite "Vectornator" ir pradėkite

Perkelkite savo dizainą į kitą lygį.

Atsisiųsti failą



Rick Davis
Rick Davis
Rickas Davisas yra patyręs grafikos dizaineris ir vizualinis menininkas, turintis daugiau nei 10 metų patirtį šioje pramonėje. Jis dirbo su įvairiais klientais – nuo ​​mažų startuolių iki didelių korporacijų, padėdamas jiems pasiekti savo dizaino tikslus ir pakelti savo prekės ženklą pasitelkdamas efektyvius ir įspūdingus vaizdus.Rikas, baigęs vizualiųjų menų mokyklą Niujorke, aistringai tyrinėja naujas dizaino tendencijas ir technologijas bei nuolat peržengia ribas, kas įmanoma šioje srityje. Jis puikiai išmano grafinio dizaino programinę įrangą ir visada nori pasidalinti savo žiniomis ir įžvalgomis su kitais.Be dizainerio darbo, Rickas taip pat yra atsidavęs tinklaraštininkas ir yra pasišventęs naujausioms grafinio dizaino programinės įrangos pasaulio tendencijoms ir raidai. Jis tiki, kad dalijimasis informacija ir idėjomis yra labai svarbus norint puoselėti stiprią ir gyvybingą dizaino bendruomenę, ir jis visada nori susisiekti su kitais dizaineriais ir kūrėjais internete.Nesvarbu, ar jis kuria naują logotipą klientui, eksperimentuoja su naujausiais įrankiais ir technikomis savo studijoje, ar rašo informatyvius ir įtraukiančius tinklaraščio įrašus, Rickas visada yra pasiryžęs atlikti geriausią įmanomą darbą ir padėti kitiems pasiekti savo dizaino tikslus.