11 принципів дизайну

Я вже неодноразово натикався на дискусії скільки існує принципів дизайна. Хтось опирається на Дітера Рамса (10) , хтось каже 7. Але я виділив для себе основні принципи і здається цифри тут немають ніякого значення.

11 принципів дизайну, з якими повинен ознайомитися кожен графічний дизайнер:

  1. Ієрархія

  2. Баланс

  3. Вирівнювання

  4. Наголос

  5. Пропорція

  6. Рух

  7. Негативний простір

  8. Контраст

  9. Повторення

  10. Різноманітність

  11. Єдність

1. Ієрархія

Візуальна ієрархія є важливою частиною хорошого дизайну. Якщо все на вашій сторінці виглядає однаково важливим, тоді нічого не здається важливим. Ви повинні використовувати візуальні підказки, щоб підказати людям, на що звернути увагу в першу чергу, вдруге, втретє тощо.

Створіть візуальну ієрархію за допомогою таких речей, як масштаб (відносний розмір елементів) і колір. Друкарську ієрархію можна створити, використовуючи різні гарнітури, розміри та щільність шрифту.

Найважливіший елемент на повенен виділятися серед інших.
Outcrowd
Outcrowd

2. Баланс

Балансу в композиції можна досягти кількома способами. Симетричний баланс є найбільш простим. Це досягається, коли елементи по обидва боки від центральної вертикальної осі в основному однакові. Наприклад, два текстові блоки з обох боків сторінки створять симетричний баланс, навіть якщо вміст цих блоків не буде ідентичним.

Асиметричний баланс, коли елементи по обидва боки від центра не однакові. Наприклад, у вас може бути велике зображення з одного боку, урівноважене помітним текстом з іншого. Це також можна досягти, коли вертикальна вісь, яка розділяє два елементи, не розміщується безпосередньо в центрі сторінки. У цьому випадку для досягнення збалансованого вигляду вужчий елемент повинен мати «важчу» візуальну вагу, ніж ширший.

Яку б техніку рівноваги ви не використовували, результат має бути правильний. Це повинно давати глядачеві відчуття гармонії, а не викликати у нього почуття тривоги.

Седрік Лашо
Седрік Лашо

3. Вирівнювання

Вирівнювання означає, як текст або графічні елементи розташовані на сторінці. Це може стосуватися їх вирівнювання по відношенню до всієї композиції (зліва, по центру чи справа), а також їх вирівнювання одне щодо одного.

Коли елементи не вирівняні належним чином, особливо відносно один одного, це додає відчуття хаосу до композиції. Це виглядає хаотично і безладно.

Що стосується практики, то завжди включайте лінійки. Наприклад в After Effects (Ctrl+R або Cmd+R)

Володимир Груєв
Володимир Груєв

4. Наголос

Акцент — це частина дизайну, яка привертає увагу користувача, іншими словами, фокусна точка. В ідеалі це має бути найважливіша частина дизайну, будь то заголовок, зображення чи CTA. Але так буває не завжди.

Недосвідчені дизайнери можуть ненавмисно підкреслити неправильні частини сторінки, викликаючи плутанину у користувача.

Обов’язково підкресліть ті частини, на які ваші користувачі повинні дивитися в першу чергу. Ви можете зробити це за допомогою таких речей, як масштаб, пробіл, колір, тінь, візерунок або інші методи.

Outcrowd
Outcrowd

5. Пропорція

Пропорція, яку також називають масштабом, — це відносний розмір об’єктів у дизайні. Елементи, які є більшими по відношенню до інших, більше виділятимуться та матимуть більше значення для користувачів.

Використовуйте пропорції, щоб створити візуальний інтерес, привертаючи увагу глядача до певних візуальних елементів у вашому дизайні.

Стефано Песк’єра
Стефано Песк’єра

6. Рух

Рух — це те, як очі користувача переміщаються по вашій композиції. Динамічний дизайн заохочує багато рухів очей, а статичний — менше. Найкращі дизайнери можуть певною мірою контролювати, на яких елементах користувачі зосереджуються, розміщуючи їх уздовж траєкторії найбільш природного руху очей.

Важливо ознайомитися з найпоширенішими візерунками руху очей, візерунками F і Z, а також з візерунком шарового пирога . F- та Z-шаблони частіше зустрічаються на сторінках із великою кількістю зображень, тоді як візерунок шарового пирога полегшується завдяки великій кількості тексту із заголовками та підзаголовками.

Джейсон Кіртлі
Джейсон Кіртлі

7. Негативний простір

Негативний простір у дизайні, також званий білим простором, — це простір, який не має елементів дизайну (окрім, можливо, кольору фону чи тонкого малюнка чи текстури).

Як принцип дизайну, негативний простір є важливим, оскільки він дає елементам вашої композиції простір для дихання. Без пробілу сторінки виглядають захаращеними, і на них важко орієнтуватися.

Обов’язково залишайте простір навколо елементів на своїх сторінках, особливо найважливіших. Цей пробіл робить їх більш помітними та сприяє кращій взаємодії з користувачем.

Імран Ашрафа
Імран Ашрафа

8. Контраст

Контраст може бути досягнутий за допомогою кольору, форми, розміру або подібних властивостей елементів і відноситься до відмінностей між ними. Контраст кольорів часто є першим, про що люди думають, але відмінності в розмірах елементів, їх формі чи інших властивостях також створюють контраст.

Контраст виконує дві дуже важливі функції. По-перше, це дозволяє виділити елементи один з одного. Повна відсутність контрасту призведе до того, що дизайн буде лише одним фоновим кольором.

Друга важлива функція контрасту — доступність. Достатній контраст між елементами, особливо текстом і його фоном, життєво важливий для створення доступного дизайну. Людям із вадами зору може бути важко читати текст на екрані, який замалий або має недостатню кольорову контрастність.

Георгій Грдзелішвілі
Георгій Грдзелішвілі

9. Повторення

Повторення означає використання однакових або схожих елементів у всьому дизайні, у регулярних або нерегулярних візерунках. Він використовується для підсилення певних елементів, а також створює відчуття єдності та безперервності вашого дизайну. Повторення можна використовувати для створення ритму, який допомагає рухатися користувачам через ваш дизайн.

Експериментуйте з повторенням, зокрема нерегулярним повторенням, щоб створити рух, але пам’ятайте, що занадто часте регулярне повторення може мати протилежний ефект і зробити ваш дизайн статичним.

AGILITY
AGILITY

10. Різноманітність

Різноманітність — це приправа життя, чи не так? Те саме стосується дизайну. Хоча повторення додає вашому дизайну відчуття гармонії, різноманітність робить його цікавим і не дає користувачам нудьгувати.

Створюйте різноманітність, додаючи унікальні або несподівані елементи до своїх дизайнів. Різноманітність можна використовувати, щоб привернути увагу користувача до певних елементів або областей дизайну та виділити їх.

Лолa Кекенадзе
Лолa Кекенадзе

11. Єдність

Єдність створює дизайн і відчуття гармонії, як візуально, так і концептуально. Єдність важлива, оскільки вона дозволяє користувачам почуватися невимушено під час навігації вашим дизайном. Здається, що все знаходиться на своїх місцях, і немає жодних різких елементів, які виділяються в негативному ключі.

Єдність можна створити кількома способами. Основними методами є:

  • Близькість — елементи, близькі один до одного, здаються єдиною групою

  • Вирівнювання — елементи, вирівняні один з одним, здаються пов’язаними

  • Повторення — елементи, які повторюються, також створюють відчуття єдності, особливо якщо це повторення виконується за регулярним шаблоном.

Шакіра
Шакіра

Як застосовувати принципи дизайну

Вивчення та дотримання встановлених принципів дизайну в графічному дизайні дозволяє створювати більш цілісні проекти, які захоплюють користувачів і пропонують виняткову взаємодію з ними.

Нехтувати цими принципами проектування слід з обережністю і лише після того, як ви повністю зрозумієте їх і цілі, яким вони служать.


🖤Дякую за увагу!

Блог Motion Richy — Створюй інакше!

Поділись своїми ідеями в новій публікації.
Ми чекаємо саме на твій довгочит!
Мам! Я моушн-дизайнер
Мам! Я моушн-дизайнер@motionrichy

7.1KПрочитань
0Автори
30Читачі
На Друкарні з 30 квітня

Більше від автора

  • 10 сайтів безкоштовних ілюстрацій

    У цій статті, я зібрав для вас 10 веб-сайтів, які вам точно стануть у нагоді, отож не шкодуйте часу і пристигайте ремені.

    Теми цього довгочиту:

    Ілюстрації
  • Правило банана в UX/UI дизайні

    «Правило банана» в дизайні UX/UI — це простий, але потужний принцип, який може допомогти переконатися, що веб-сайт або додаток є простими для розуміння та використання.

    Теми цього довгочиту:

    Дизайн
  • Закон читабельності: проектування типографіки

    Щодня ми стикаємося з сотнями текстів, навіть не усвідомлюючи складного процесу, який стоїть за ними, щоб здаватись читабельним.

    Теми цього довгочиту:

    Ui-ux

Вам також сподобається

Коментарі (0)

Підтримайте автора першим.
Напишіть коментар!

Вам також сподобається