Mundarija
Vizual dizayn asoslarini o'rganish uchun to'liq qo'llanma.
Million dollarlik savol: yaxshi dizayn siri nimada?
Bu haqda falsafiy fikr yuritishimiz mumkin. , lekin umuman olganda, yaxshi dizaynning maqol "siri" sizning vizual elementlaringizni tuvalingizga va bir-biriga bog'lab tartibga solishda yotadi. Asosan, biz hozirgina maket dizaynini tasvirlab berdik. Buni o‘ylab ko‘rsangiz, qayerga qaramang.
Masalan, jurnalning tartibini olaylik. Ularning dizayni klassik grid tizimiga amal qiladi (bir daqiqada panjara haqida hamma narsani bilib olamiz). Odatda hamma narsa chapga, o'ngga va pastki qismga mos keladi. Ustunlar, ayniqsa, aniq asosli hizalanishga ega bo'lib, bu sahifani nafaqat vizual, balki o'qishni osonlashtiradigan va obro'li qiladi. Katta sarlavhalar tomoshabin e'tiborini tortadi, pastki sarlavha esa ma'lumotlarning vizual ierarxiyasini yaratish uchun kontrast sifatida keladi.
Linda Gaom, Behance
Bu fazilatlarning barchasi sahifani yaratadi. dizayn toza, tuzilgan va o'qish oson va ular biz keyingi muhokama qiladigan maslahatlarga mos keladi. Biroq, avvalo, maket dizaynining o'zi haqida ko'proq bilib olaylik.
Layout Design nima?
Layout dizayn o'quvchi e'tiborini jalb qilish va ma'lum bir xabarni vizual jozibador tarzda etkazish uchun grafik elementlarning joylashishiga tegishli. .Demak, biz gaplashmayapmizdam olish joyi, boshqa elementlar esa yo'nalish beradi.
Buni tushunishning oddiy usuli, masalan, bizning veb-saytimizni misol qilishdir. Grafika matndan aniq ajratilgan va harakatga chaqiruvlar ham shunday bo'ladi, shuning uchun tomoshabinning diqqati bir ma'lumot to'plamidan ikkinchisiga o'tadi.
Prinsip. #5. Kontrastdan foydalaning
Dizayningizda yetarlicha kontrast borligiga ishonch hosil qiling.
Kontrast dizayningizni tartibga solishga yordam beradi va juda zarur bo'lgan ierarxiyani o'rnatadi va muhim narsaga urg'u beradi.Bundan tashqari, kontrastdan yaxshi foydalanish dizayningiz davomida vizual qiziqishni ham oshiradi. Keling, hamma narsa bir xil o'lcham, shakl yoki rangga ega bo'lgan tartib zerikarli ko'rinishini tan olaylik. Kontrast ziravorlar beradi.
Sizning birinchi fikringiz rang kontrasti bo'lishi mumkin, masalan, issiq va sovuq, to'q va och, ko'k va to'q sariq. Ammo rang kontrastning juda muhim printsipi bo'lsa-da, tur, hizalama va o'lchamdagi kontrastlar ham mavjud. Va esda tutingki, kontrast ham nisbiydir. U faqat boshqa elementlar bilan yonma-yon joylashganda ma'noga ega.
Mana bu qoidadan oqilona va chiroyli tarzda foydalanadigan maketlarning ba'zi misollari. Tipografiya, rang va hatto elementlar orasidagi o'lchamdagi kontrastga e'tibor bering.
Manba: IAGning yarashuv bo'yicha harakatlar rejasi
Prinsip №6. Takrorlash, naqsh, ritm
Biz takrorlash haqida o'ylaganimizda, biz o'ylaymiz.qayta-qayta bir xil element.
Lekin u dizayn jihatidan farq qiladi. Bu, albatta, unchalik zerikarli emas. To'g'ri qo'llanilganda, takrorlash dizayningizni chindan ham kuchaytirishi mumkin.
Turli joylar bir-biriga bog'langan va bir xil kompozitsiyaning bir qismi bo'lib tuyulishi uchun motifni butun tuzilishda aniqlashga va qayta ishlatishga harakat qiling. Bu sizning dizayningizga mavzuga ega bo'lishiga yordam beradi. Elementlarni takrorlash orqali siz nafaqat auditoriyangizning kutganlariga ko'ra yetkazib berasiz, balki foydalanuvchi tajribasini ham yaxshilaysiz. Izchil bo'lish foydalanuvchilarga o'zini qulayroq his qiladi.
Buni shakllar yoki belgilarni takrorlash orqali qilishingiz mumkin. Yoki hatto rang sxemasi, shrift va umuman bir xil uslub.
Yaxshi odat - bu katta oila bilan shriftdan foydalanish. Turli xil naqshlar, chiziq og'irliklari/uslublari va ranglarini cheklang va butun davomida takrorlang. Bundan tashqari, tasvirlar va grafikalar uslubini bir xil saqlashga harakat qiling. Masalan, xuddi shu rassomning rasmlaridan foydalaning.
Manba: Thepentool.co
Hammasi. Bular sizning dizayningizni tartibga solish va yanada toza, professional va muvozanatli tartibga erishishingizga yordam beradigan oltita tamoyil.
Ammo sayohatingiz shu bilan tugamaydi. Grafik dizayn aniq fan emas va u maslahatlar va tamoyillar bilan cheklanib qolmasligi kerak. Yaratilishning barcha sohalarida bo'lgani kabi, hech qanday qattiq qoida yo'q. Ushbu maslahatlardan nozik yo'llar bilan chiqib ketish sizga chuqurlik va rang-baranglikni qo'shadidizaynlaringiz.
Shunga qaramay, ular ajoyib boshlanish nuqtasidir va biz ularni sinab ko'rishingizni tavsiya qilamiz. Va ular qanday ishlaganini bizga xabar bering!
Ishga kirishish uchun Vectornator-ni yuklab oling
Dizaynlaringizni keyingi bosqichga o'tkazing.
Faylni yuklab oling
Bu yerda logotip dizayni haqida. Lekin gazetalar, jurnallar, plakatlar va ularning raqamli hamkasblari kabi bosma materiallar dizayni, shuningdek, veb, ilova yoki UX/UI dizayni.“Tartib” so‘zi bizga ko‘p maslahatlar beradi. Bu sahifada oldindan belgilangan elementlarning joylashishini bildiradi.
Tuzilish samarali bo'lsa, u yaxshi ko'rinadi va u tomoshabinni dizayn yetkazmoqchi bo'lgan xabarni tushunishga yo'naltiradi. Demak, maketni tushunish jozibali, samarali, foydalanuvchilarga qulay va yoqimli kompozitsiyalarni yaratishda muhim ahamiyatga ega.
Agar maket o‘z xabarini tinglovchilarga yaxshi yetkazmasa yoki boshqacha qilib aytganda, u "yaxshi o‘qimaydi". ", dizayn qanchalik zamonaviy ko'rinmasin, samarasiz bo'ladi. Dizayn dizayni sohasida kontent tendentsiyalar va nayranglar o'rnini bosadi.
Layout dizayn maqsadi
Xabarni tez etkazish
Bu asosiy. Layout dizayni maksimal samaradorlik va ta'sir uchun ko'z harakatining silliq oqimiga erishish uchun grafik aktivlar o'rtasidagi munosabatni o'rnatadi.
Muvozanat yaratish
Tuzilish dizayni tamoyillaridan foydalanish yaratishning eng oddiy usuli hisoblanadi. dizayn loyihalaringizda zerikarli bo'lmasdan muvozanat va simmetriya hissi.
Yaxshilikni yaratish uchun
Tuzilish dizayningizning ko'plab elementlarini oson hazm bo'ladigan, uyg'un va mantiqiy tarzda tartibga solishga yordam beradi.
Go'zallikni yaratish uchun
Muvozanat va tuzilish tabiiy ravishda go'zallikni yaratadi.Agar sizning dizayningiz to'g'ri bajarilgan bo'lsa, u avtomatik ravishda tomoshabinni ingl. Xabarni tushunish uchun tomoshabinlar qanchalik kam harakat qilishlari kerak bo'lsa, dizayningiz shunchalik jozibali ko'rinadi.
Dizayner Frenk Filippin o'zining "Men dizayn talabasi bo'lganman: Keyin -" Endi.' Manba: DesignBoom
Layout dizayn elementlari
Matn
Bu faqat matn tanasi yoki paragraflarni emas, balki sarlavhalar, sarlavhalar, sarlavhalar va altbilgilarni ham o'z ichiga oladi. Siz tanlagan tipografiya, rang va o'lchamlar sizning dizayningiz auditoriyangizga qanday tarjima qilinishiga turli effektlarni beradi.
Rasm
Tasvirlarning eng keng tarqalgan turlari fotosuratlar, illyustratsiyalar yoki infografikadir.
Shakllar
Shakllar geometrik bo'lishi mumkin, ular juda burchakli yoki ular tabiiy dunyoga taqlid qiluvchi organik bo'lishi mumkin. Ular mavhum bo'lishi ham mumkin. O'tgan yili mavhum shakllar juda moda bo'ldi, chunki biz veb-dizaynerlar ularni murakkab va keng tarqalgan kompozitsiyalarga qo'shganini ko'rdik.
Shakllar tasvirni almashtirishi mumkin. Yoki ular sahifaga grafik elementlar qo‘shish, matnni ajratib ko‘rsatish yoki boshqa vizual elementlar orasidagi bo‘shliqni belgilash uchun ishlatilishi mumkin.
Oq bo‘shliq
Har qanday maket dizaynida ma’lum miqdorda oq bo‘sh joy bo‘ladi. Bu sizning elementlaringizning nafas olishiga va o'z-o'zidan ajralib turishiga imkon beradi.
Reytingni loyihalashning oltin tamoyillari
Siz ko'rasizki, printsiplarmaket dizayni dizaynning ko'plab asosiy tamoyillariga amal qiladi. Rangni ma'lum bir tarzda ishlatish kabi, tipografiya, takrorlash, kontrast, ierarxiya va muvozanat.
1-sonli tamoyil. To'rlardan foydalaning
To'rlar dizaynerlarga matn va tasvir kabi turli dizayn elementlarini izchil va kuzatib borish oson bo'lgan tarzda joylashtirishga yordam beradi.
Ular tartib tuyg'usini ta'minlaydi, elementlarni bir-biridan ustun qo'yishdan saqlaydi. , va eng muhimi, panjaralar ham sizning hizalanishingizni to'g'rilaydi. Ishingizni toza va professionalroq qilish.
Manba: hgmlegal.com
To'rlar anatomiyasi
Siz buni faqat vertikal va gorizontal chiziqlar deb o'ylashingiz mumkin, lekin panjara bir necha qismlardan iborat. Ko'pchilik, aslida. Bu erda asosiy tarmoqda bilishingiz kerak bo'lgan eng muhim terminologiya:
- Format - bu yakuniy dizayningizning to'liq maydoni. Shunday qilib, agar siz chop etish uchun biror narsani loyihalashtirsangiz, format sahifadir va agar siz veb-dizayner bo'lsangiz, format veb-sahifa yoki brauzer oynasidir.
- Chetlar - bu format va dizayn o'rtasidagi ataylab bo'sh bo'shliqlar.
- Oqim chiziqlari - bu sizning tartibingizni parallel qismlarga ajratadigan gorizontal chiziqlar. Oqim chiziqlari dizayningizning o‘qilishiga yordam beradi va o‘quvchini tarkibni to‘g‘ri kuzatishga yo‘naltiradi.
- Modullar gorizontal va vertikal chiziqlardan tashkil topgan bloklardir.har qanday gridning oqim chiziqlari. Agar siz o'ylab ko'rsangiz, ular har qanday tarmoqning qurilish bloklari. Barcha vertikal modullaringiz ustunlaringizni yaratadi, barcha gorizontal panjaralaringiz esa satrlaringizni yaratadi.
- Hududlar vertikal yoki gorizontal ulangan modullar guruhidir. Bularni qanday tashkil qilish haqida hech qanday qoidalar yo'q.
Manba: Radversity
Tarmoqlar turlari
Tuzatish tarmoqlari birinchi marta tartibga solish uchun ishlatilgan. qog'ozdagi qo'l yozuvi.
Ular 13-asrda, frantsuz rassomi Villard De chekkalari bo'lgan bosma sahifa maketlarini yaratish uchun oltin nisbat bilan panjara tizimini birlashtirganda paydo bo'lgan. Ushbu tarmoq tizimini bugungi kungacha ko'rishingiz mumkin, chunki bosma kitoblar va jurnallarning ko'pchiligi tasdiqlaydi. Nashriyotchilar, muharrirlar va dizaynerlar standart to‘rlardan nafaqat yaxshi ko‘rinishga ega bo‘lgani uchun, balki o‘quvchilar ma’lum bir dizayn elementlarining ma’lum bir joyda bo‘lishini kutishgani uchun ham foydalanishni afzal ko‘radilar.
To‘rlarni ikki usulda loyihalash mumkin: simmetrik yoki assimetrik. Simmetrik katakchalar vertikal va gorizontal hududlar bir-biriga teng bo'lgan markaz chizig'ini kuzatib boradi; va ustunlar bir xil kenglikka ega.
assimetrik to'r da, nomidan ko'rinib turibdiki, chekkalar va ustunlar hammasi bir xil emas.
>Ushbu tasnifga asoslanib, siz ishonishingiz mumkin bo'lgan butun dunyo bo'ylab qo'llaniladigan beshta asosiy sxema turlari mavjud:
Qo'lyozmakatakchalar hujjatlar uchun eng keng tarqalgan panjara turidir. Ular sarlavha, altbilgi va chekkalarni ajratib turadi va asosan format (yoki sahifa) ichida matningiz chegaralarini ta'minlaydigan to'rtburchaklar hosil qiladi. Ular jurnallar, gazetalar va kitoblar uchun asosdir. Demak, bu sizga eng yaxshi tanish bo'lgan maketdir.
Manba: UXplanet
Manba: Radversity
Ustunlar panjaralari jurnal nashrida yana bir sevimli. Jurnalning odatiy tartibi matnni oson o'qiladigan bo'limlarga ajratish uchun ustunli panjaralardan foydalanadi. Lekin ular veb-saytlar uchun ham juda mashhur. Siz ikkitadan oltitagacha bo'lgan hamma narsani ishlatishingiz mumkin. Ko'proq mumkin, lekin keng tarqalgan emas. Ustun panjaralari haqida juda muhim narsa shundaki, ustunlar orasidagi masofa yoki oluklar bir-biridan teng masofada joylashgan.
Nosimmetrik ustunli panjaralar gazetalar tomonidan qo'llaniladi, masalan, assimetrik ustunli panjara veb-dizaynda afzallik beriladi. .
Manba: UX Planet
Manba: Radversity
Modulli tarmoqlar ustunlar panjarasiga oʻxshaydi, lekin ular gorizontal oqimlarni ham hisobga oladi. Ushbu turdagi to'r sizning tartibingizda turli elementlarni tartibga solish kerak bo'lganda va ustunlar to'rlari etarli bo'lmaganda kerak bo'ladi.
Modulli to'rlar teng o'lchamdagi modullarga ega, bu sizning fazoviy zonalaringizni turli yo'llar bilan ko'rishni osonlashtiradi.
Manba: UXSayyora
Manba: Radversity
Asosiy tarmoqlar matnga asoslangan kompozitsiyalar uchun ajoyib. Asosiy chiziq - siz kiritganingizda matn turadigan chiziq va bosh chiziq - ikkita asosiy chiziq orasidagi masofa. Sarlavha yoki sarlavhalaringiz qanchalik katta boʻlishi kerakligi qiziqmi?
Matningizga oqimli ritm berish uchun asosiy toʻrlar shu yerda.
Manba: UX Planet
Manba: Fragaria
Ierarxik to'rlar barchaga qaraganda kamroq tarmoqqa o'xshaydi hamkasblar. Shunga qaramay, ular dizayn elementlarini muhimlik tartibida tartibga solishda juda foydali. Ierarxik to'rlar modulli tarmoqlarga asoslangan bo'lishi mumkin yoki hatto o'zingizni yaratishingiz mumkin. Veb-saytlar ushbu tarmoqdan ko'p foydalanadi, ayniqsa raqamli jurnallar va gazetalar raqamli bo'lishga o'tishda ustunlar panjaralariga emas, balki ierarxik tarmoqlarga ko'proq tayanadi.
Shuningdek qarang: 2022-yil uchun eng yaxshi veb-sayt dizayni tendentsiyalari
Manba: UX Plane
Prinsip #2. Salbiy bo'shliqdan foydalaning
Biz ko'pincha bo'shliq, sukunat yoki rangning etishmasligi yomon narsa deb o'ylaymiz. Lekin biz ular qanday qilib kontrastning mustahkam poydevori ekanligini hisobga olmaymiz.
Oq bo'shliq deb ham ataladi, salbiy bo'shliq dizayndagi haqiqiy elementlarga ega bo'lmagan joydir. Bu bo'sh qolgan maydon. U nafaqat sizning aktivlaringizni o'rab oladi, balki ular o'rtasida kerakli aloqalarni ham yaratadi. Shu sababli, salbiy joy to'g'ri dizayn elementi bo'lib, sizning joylashuvingiz qanchalik samarali bo'lishiga katta ta'sir ko'rsatadidizayn hisoblanadi.
Yaxshi va yomon salbiy bo'shliq
Salbiy bo'shliq dizayndagi turli sohalarni ajratishga yordam beradi, shu bilan birga tartibingiz nafas olishiga imkon beradi. Bu vizual ierarxiya va vizual muvozanat bilan yordam beradi; u asosiy elementlarga foydalanuvchining e'tiborini belgilaydi; bu chalg'itish darajasini pasaytiradi; va nihoyat, u dizayningizga uslub va nafislik qo'shadi.
Tajribasiz dizaynerlar matnni kattalashtirish yoki logotip yoki rasmni portlatish orqali o'zlarining tuvallarini iloji boricha to'ldirishga moyil bo'lishlari mumkin. Ammo elementlarga xona berish tomoshabinga maʼlum maʼlumot signallarini tezroq va qulayroq tanlash imkonini beradi.
Agar hamma narsa tomoshabinning eʼtiborini jalb qilish uchun qichqirsa, hech narsa eshitilmaydi.– Aaron Valter, “Dizayn uchun his-tuyg'u'
Salbiy bo'shliqni aniqlashning oson yo'li modulli tarmoqdan foydalanishdir. Uni dizayningizning ustiga qo‘yib, qaysi modullar bo‘sh qolishi va qaysi biri to‘ldirilishi kerakligini osongina tasavvur qilishingiz mumkin.
Dizayner Brunswicker, Manba: Codesignmag.com
Shuningdek qarang: Barcha davrlarning 20 ta eng yaxshi albom muqovalari№3 tamoyil. Yagona markazlashtirilgan nuqtani tanlang
Mijoz sizdan logotipni kattalashtirishni iltimos qilganmi? Keyin sarlavhani yanada kattaroq qilish uchunmi?
Siz hamma narsani ta'kidlay olmaysiz. Bu yaxshi dizayn nuqtasini mag'lub qiladi. Vaqt kabi, diqqat nisbiydir. Bir element ajralib turishi uchun boshqasi fon sifatida xizmat qilishi kerak. Dizayningiz namoyish etilishi uchun ba'zi elementlar boshqalardan ustun bo'lishi kerakvizual ierarxiya.
Dizayndagi fokus nuqtasi eng katta vizual vaznga ega bo'lgan elementdir. Bu sizning dizayningizdagi hamma narsadan ko'ra birinchi navbatda ko'zni tortadigan element.Asosiy nuqta auditoriyangizga dizayningizdan boshlab ularning tomosha qilish sayohati qayerdan boshlanishini e'lon qiladi. Demak, bu siz aytayotgan hikoyaning boshlanishi.
Bu odatda katta rasm yoki katta tipografiya manbasidan foydalanish orqali erishiladi. Quyidagi fokus nuqtasi qanchalik samarali ekanligiga e'tibor bering
Bloomberg Businessweek uchun Braulio Amado tomonidan ishlab chiqilgan, Manba: Bu juda yaxshi
Ammo fokus nuqtasi auditoriyangiz e'tiborini jalb qilsa-da, keyingi qoida uni boshqarishga yordam beradi.
Prinsip №4. Yaqinlik va oqim haqida o'ylab ko'ring
Yaqinlik printsipi oddiy. Bir-biriga bog'liq bo'lgan elementlar bir-biriga joylashtirilganligiga ishonch hosil qiling.
Yaqinlik vizual ob'ektlar ulanganligini va joylashuvingizni tartibga solishga yordam beradigan vizual birlik bo'lishini ko'rsatadi.Shunday qilib, faqat bir-biri bilan aloqador bo'lgan klaster dizayn aktivlari va auditoriyangizni ular iste'mol qilishi kerak bo'lgan tegishli kontentga yo'naltirish uchun dizayningizdagi ma'lumotlardan foydalaning. Bu oqim printsipi deb ham ataladi.
Manba: Satori Graphics
Yaxshi oqimga ega dizayn tomoshabinlarning ko'zini butun sxema bo'ylab, elementdan elementgacha osonlik bilan olib boradi. Sizning markazlashtirilgan nuqtalaringiz ko'zni tortadi va bo'ladi
