Модульні сітки в UI: що таке модульна сітка

Мета цієї статті – дати вам уявлення про сітки: що це таке і як їх застосовувати в дизайні. Розуміння того, як використовувати сітки, сформується на основі практичного досвіду.

Дизайнери всіх типів постійно стикаються з проблемами структури своїх проектів. Одним із найпростіших способів контролю структури макета і досягнення послідовного та організованого дизайну є застосування сітки.

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

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

Сьогодні 90% усіх медіа-взаємодій засновані на екрані, ми переглядаємо контент на мобільних телефонах, планшетах, ноутбуках, телевізорах і смарт-годинниках. Мультиекранність швидко стає нормою, і проектування для декількох екранів стало невід’ємною частиною бізнесу. Ми, дизайнери, хочемо забезпечити чудовий і приємний досвід людям, які використовують наші продукти – і сітки можуть допомогти нам у цьому.

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

У статті зібрано багато інформації про сітки, зокрема:

  • що таке сітки,
  • коротка історія сітки,
  • теорія сіток,
  • чотири види макетів сіток,
  • макет сітки в інтерактивному дизайні.

Що таке сітка?

Сітка являє собою структуру, що містить ряд рядків (вертикальних або горизонтальних), які ділять сторінку на стовпці або модулі. Ця структура допомагає дизайнерам розміщувати контент на сторінці. Хоча лінії сітки самі по собі не обов’язково помітні (хоча в деяких дизайнах їх видно), структура допомагає вам керувати пропорціями елементів, які повинні бути вирівняні на сторінці.

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

Сітки дозволяють дизайнерам створювати міцну структуру і форму дизайну.

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

Книжкова полиця – своєрідна сітка

Далі БУДЕ!

Джерело: www.smashingmagazine.com

Вас також ЗАЦІКАВИТЬ:

Вам сподобалося?

Читайте щотижня наші кращі статі про дизайн!

email рассылки

Корисна розсилка!

Все найцікавіше про дизайн і дизайнерів!
А ще свіжі вакансії і трішки гумору)

Ваш email:
email рассылки
Позначки:

Залишити відповідь