Композиційні засоби зручності в інтерфейсах

Графічні інтерфейси користувача — по свої суті графічні композиції. І тому засоби композиційної будови, як і принципи забезпечення її гармонійного сприйняття, тут діють ті самі. 

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

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

А наразі — зосередимось лише на деяких важливих аспектах роботи з композицією.

Закони композиції у дизайні інтерфейсів

Щоби графічна композиція (і, відповідно, графічний інтерфейс) сприймався гармонійним, мають бути дотримані три закони композиції:

  • закон цілісності,
  • закон рівноваги,
  • закон ієрархії (супідрядності).

Розгляньмо, як ці закони діють в межах інтерфейсів!

Закон цілісності

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

З точки зору стилістики, для цього необхідні:

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

Змістовна цілісність в контексті інтерфейсів передбачає цілісне розуміння змісту екрану користувачем. Тобто, якщо ви проєктуєте, скажімо, форму реєстрації, кнопка «Готово» не має губитись та надто відриватись від полів форми. А якщо в даній області перегляду вони не вміщуються, композиція має передавати чітко, що робити користувачеві, щоб побачити решту інтерфейсу — застосувати свайп, гортати сторінку тощо.

6
9419

Ця стаття недоступна в безплатній версії

Щоб отримати до неї доступ, оберіть комфортну опцію:
Тиждень повного доступу
Безплатно
Всі можливості платформи
без обмежень
Навчайтесь з нами
від 500 ₴/міс.
Доступ до десятків курсів про графічний дизайн, вебдизайн, UI/UX та фронтенд
Підібрати тариф
Спільнота
Відеотека
Про нас