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

11 принципів дизайну, з якими повинен ознайомитися кожен графічний дизайнер:
Ієрархія
Баланс
Вирівнювання
Наголос
Пропорція
Рух
Негативний простір
Контраст
Повторення
Різноманітність
Єдність
1. Ієрархія
Візуальна ієрархія є важливою частиною хорошого дизайну. Якщо все на вашій сторінці виглядає однаково важливим, тоді нічого не здається важливим. Ви повинні використовувати візуальні підказки, щоб підказати людям, на що звернути увагу в першу чергу, вдруге, втретє тощо.
Створіть візуальну ієрархію за допомогою таких речей, як масштаб (відносний розмір елементів) і колір. Друкарську ієрархію можна створити, використовуючи різні гарнітури, розміри та щільність шрифту.
Найважливіший елемент на повенен виділятися серед інших.

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

3. Вирівнювання
Вирівнювання означає, як текст або графічні елементи розташовані на сторінці. Це може стосуватися їх вирівнювання по відношенню до всієї композиції (зліва, по центру чи справа), а також їх вирівнювання одне щодо одного.
Коли елементи не вирівняні належним чином, особливо відносно один одного, це додає відчуття хаосу до композиції. Це виглядає хаотично і безладно.
Що стосується практики, то завжди включайте лінійки. Наприклад в After Effects (Ctrl+R або Cmd+R)

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

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

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

7. Негативний простір
Негативний простір у дизайні, також званий білим простором, — це простір, який не має елементів дизайну (окрім, можливо, кольору фону чи тонкого малюнка чи текстури).
Як принцип дизайну, негативний простір є важливим, оскільки він дає елементам вашої композиції простір для дихання. Без пробілу сторінки виглядають захаращеними, і на них важко орієнтуватися.
Обов’язково залишайте простір навколо елементів на своїх сторінках, особливо найважливіших. Цей пробіл робить їх більш помітними та сприяє кращій взаємодії з користувачем.

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

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

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

11. Єдність
Єдність створює дизайн і відчуття гармонії, як візуально, так і концептуально. Єдність важлива, оскільки вона дозволяє користувачам почуватися невимушено під час навігації вашим дизайном. Здається, що все знаходиться на своїх місцях, і немає жодних різких елементів, які виділяються в негативному ключі.
Єдність можна створити кількома способами. Основними методами є:
Близькість — елементи, близькі один до одного, здаються єдиною групою
Вирівнювання — елементи, вирівняні один з одним, здаються пов’язаними
Повторення — елементи, які повторюються, також створюють відчуття єдності, особливо якщо це повторення виконується за регулярним шаблоном.

Як застосовувати принципи дизайну
Вивчення та дотримання встановлених принципів дизайну в графічному дизайні дозволяє створювати більш цілісні проекти, які захоплюють користувачів і пропонують виняткову взаємодію з ними.
Нехтувати цими принципами проектування слід з обережністю і лише після того, як ви повністю зрозумієте їх і цілі, яким вони служать.
🖤Дякую за увагу!
Блог Motion Richy — Створюй інакше!