К книге
UX/UI дизайн для создания идеального продукта. Полный и исчерпывающий гидГлава 6 Артефакты UXD. Дизайн-системы. Модульные сетки
88%
Глава 6 Артефакты UXD. Дизайн-системы. Модульные сетки
89

Современные цифровые продукты создаются, как правило, сразу под несколько экранных разрешений.

Соответственно, очень важно для всех элементов выработать правила поведения при адаптации к разным размерам.

При разных шагах адаптивности для каждого элемента выделяются разные доли экрана (модули).

Модульная сетка определяет принцип выравнивания элементов, горизонтальные и вертикальные отступы и поведение при адаптации под разные экранные разрешения.

Paradigm – дизайн-система Mail.ru Group, раздел с модульными сетками

Для старта советую обратить внимание на уже обкатанные дизайн-системы вроде Bootstrap или Google Material Design и строить модульную систему на их основе.

Bootstrap grid – проверенная временем «резиновая», адаптивная модульная сетка

Их модульные сетки и используемые в них принципы адаптивности прошли проверку на огромном количестве экранов, и их внедрение несет минимальный риск с точки зрения качества пользовательского опыта и количества потенциальных проблем, связанных с масштабированием.

Предыдущая главаГлава 89 из 101Следующая глава