/designer
/designer

Snap to Pixel Grid

Описание
Тогл-режим, который включает привязку объектов к пиксельной сетке и позволяет избежать дробных значений в координатах.
Клавиша Mac
ShiftCmd'
Клавиша Windows
ShiftCtrl'
Путь
⚪️ Меню клиента macOS🟡 Главное меню (Mac и Win)Редактор: верх🟢 Верхняя панель
Группа команд
PreferencesМеню масштаба
1. File Browser
3. Верхняя панель
71

Вариант 1. Меню масштаба

image

⚪
Движение по меню клиента macOS

←
Zoom to 50%
 Snap to Pixel Grid

Конец пути по командам меню клиента macOS. В начало

.

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

←
Snap to Objects
 Snap to Pixel Grid
Keep Tool Selected After Use
 →

🟢
Движение по верхней панели редактора

←
Pixel Grid
 Snap to Pixel Grid
Layout Grids
 →

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

image

Вариант 3. Можно ввести запрос sn в поиске по командам

.

image

Пример использования Snap To Pixel Grid

  1. Включаем режим.
  2. Создаём прямоугольник инструментом
    Rectangle
    Rectangle
    .
  3. Увеличиваем масштаб командой
    Zoom In
     до 1600% и ставим рабочую область так чтобы было видно угол прямоугольника.
  4. Для наглядности включаем
    Pixel Grid
    , чтобы была видна сетка пикселей.
  5. Двигаем объект и видим, как он сдвигается с шагом в пиксель.

  6. Если отключить режим, сдвигаемый объект будет попадать на полупиксели — дробные значения X и Y.

При экспорте изображения в при плотности @1x это может сделать края объектов размытыми, однако во время рисования иллюстрации может быть полезно отключить привязку к сетке для проработки мелких деталей.

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