Nudge Amount

Описание

Позволяет настроить шаг сдвига объектов. По умолчанию 10, удобно: 4.

Клавиша Mac
Не бывает
Клавиша Windows
Не настроена
Путь
🟡 Главное меню (Mac и Win)
Группа команд
Preferences
1. File Browser

Вариант 1. Главное меню Figma

image
🟡
Движение по меню Figma

System Theme Nudge Amount Libraries

Вариант 2. Quick Actions

Можно ввести запрос nud в поиск по Quick Actions.

image

Почему шаг сдвига важен

Эта настройка очень важна при работе с интерфейсами и определяет шаг сдвига — расстояние в пикселях, на которое будет сдвигаться объект, если нажимать Shift стрелки.

Обычно его делают равным настройке базовой сетки, используемой на проекте.

Крупность клетки влияет на то, насколько гибко и точно можно выравнивать объекты, не отклоняясь от сетки.

По умолчанию шаг сдвига равен 10 px, что неудобно для работы с интерфейсами, поскольку 10 делится на 2 без остатка всего лишь один раз, в то время как 8 — 3 раза. По этой причине для мобильных интерфейсов обычно используются 8 px и 4 px.

Более крупная сетка позволяет ускорить расположение объектов: для презентаций удобно использовать клетку и шаг сдвига по 40 px.

Пример: синхронизируем шаг сдвига и сетку

  1. Открываем окно c настройкой Nudge Amount. Проверяем, что шаг сдвига равен 10. Можно указать другое значение.
  2. Создаём FrameFrame размером 200 х 200.
  3. В нём создаём квадрат инструментом RectangleRectangle размером 100 х 100.
  4. Чтобы сделать сетки видимыми, включаем режим Layout Grids.
  5. Добавляем настройку сетки на фрейм командой Add Layout Grid. Появляется красная клетчатая сетка.
  6. Приближаем квадрат командой Zoom In до масштаба 200%.
  7. Стрелками двигаем квадрат по 1 px, пока он не встанет на сетку.
  8. Shift стрелками двигаем квадрат по фрейму, не отклоняясь от сетки. Пока зажат Shift, мы можем быть уверены, что всё будет по сетке. ⏹️

/designer/designer

— образовательный телеграм-канал о продуктовом дизайне и инструментах для него, о карьере дизайнера и эмиграции. Опечатки и обратную связь → @okunev