Как вырезать объект в фигме пером

Вырезать объект (создавать сложные выделения) в Figma с помощью пера - это одна из ключевых техник. Если вы знакомы с Photoshop, этот процесс очень похож на работу с инструментом «Перо» (Pen Tool). Вот подробное руководство, как это сделать.

Основной принцип

Инструментом «Перо» вы создаете векторную маску. Вы не "вырезаете" часть объекта в привычном смысле, а создаете контур, который либо показывает, либо скрывает части нижележащего слоя (например, изображения). В отличие от ластика, который безвозвратно удаляет пиксели, маска - это гибкий контур-трафарет, который определяет области видимости слоя.

Всё, что находится внутри замкнутого контура, становится видимым, а всё, что снаружи, - скрывается, но при этом не удаляется. Этот подход неразрушающий - вы в любой момент можете отредактировать точки контура, чтобы изменить границы видимости, или даже вовсе отключить маску, чтобы вернуть исходное изображение.

 

С помощью пера вы не «вырезаете» объект в прямом смысле, а создаёте для него точные, редактируемые границы.

 

Вырезка объекта на изображении

Это самый частый случай - когда вам нужно отделить кота от фона или вырезать человека. Вот основные этапы этого метода:

Подготовка

• Поместите изображение на холст.
• Выделите его.

Создание маски

• На панели инструментов вверху нажмите на значок маски (прямоугольник с кружком внутри) или используйте горячую клавишу Ctrl+/ (Cmd+/ на Mac).
• Рядом с изображением появится пустой контур маски. Он пока что просто скрывает все изображение.

Работа с Пером

1. Убедитесь, что контур маски выделен (он должен быть с синей обводкой).
2. На панели инструментов выберите Инструмент «Перо» (значок пера) или нажмите P.
3. Теперь начинайте обводить объект, ставя опорные точки.

Простое нажатие создает точку с острыми углами. Нажатие и перетаскивание создает точку с изгибом (кривую Безье). Вы увидите "рычаги" - управляющие линии, которые регулируют кривизну.

Советы по обводке:

1. Ставьте точки в ключевых местах изгиба объекта.
2. Чтобы замкнуть контур, кликните на самую первую точку. Рядом с курсором появится значок кружка.
3. Не стремитесь сделать идеально с первого раза. Контур всегда можно отредактировать.

Редактирование контура

Инструмент "Курсор" (V): Позволяет перемещать отдельные точки. Потяните за точку, чтобы сдвинуть ее. Инструмент "Перо" (P):

• Клик по точке: Удаляет ее.
• Клик по отрезку контура: Добавляет новую точку.
• Alt (Option на Mac) + клик по точке: Переключает тип точки (острая/сглаженная).
• Ctrl (Cmd на Mac) + перетаскивание точки или "рычага": Позволяет управлять одним "рычагом" кривой независимо от другого.

Настройка маски

• На панели "Design" (Свойства) справа вы можете настроить заливку и обводку для самого контура маски (это не относится к изображению).
• Чтобы изображение внутри маски отображалось правильно, у контура маски должна быть любая заливка (обычно оставляют черную).

Результат: Все, что находится внутри вашего контура, будет видимым. Все, что снаружи, - скрыто.

Другие способы использования пера для вырезания

Вы можете не только работать с масками, но и создавать уникальные фигуры с нуля. Перечислим некоторые способы:

Создание сложной фигуры с нуля

1. Возьмите инструмент «Перо» (P) на чистом холсте.
2. Начните ставить точки. Figma автоматически будет заливать область между точками, создавая фигуру.
3. Замкните контур, кликнув на первую точку.
4. Теперь вы можете работать с этой фигурой как с любым другим векторным объектом: менять заливку, обводку и т.д.

Объединение и вычитание фигур (Boolean Operations)

Это мощный метод для создания сложных форм без кропотливой обводки.

1. Создайте две фигуры: одну основную (например, прямоугольник), а вторую - ту, которой вы хотите "вырезать" (например, круг).
2. Наложите круг на ту область прямоугольника, которую хотите вырезать.
3. Выделите обе фигуры.
4. На панели свойств в разделе "Boolean Operations" выберите Subtract (Вычесть).

Теперь круг "вырезан" из прямоугольника. Это неразрывная операция. Чтобы ее отредактировать, выделите получившуюся фигуру и на панели слоев раскройте группу - внутри вы увидите исходные фигуры, которые можно перемещать и изменять.

После создания базовых векторных фигур вы можете комбинировать их для получения сложных форм. Для этого выделите несколько фигур и выберите одну из операций на панели свойств.

Операция	Результат	Описание
Union (Объединение)	Единая фигура	Объединяет несколько фигур в один объект.
Subtract (Вычитание)	Фигура с вырезом	Верхняя фигура вырезается из нижней.
Intersect (Пересечение)	Область пересечения	Остается только та часть, где фигуры перекрывались.
Exclude (Исключение)	Обратное пересечению	Остаются все части фигур, кроме области их пересечения.

 

Этот метод идеально подходит для быстрого создания сложных иконок и геометрических форм без необходимости кропотливого рисования контуров. Например, чтобы нарисовать лунный серп, достаточно просто сдвинуть два круга и применить операцию вычитания (Subtract), что займет буквально несколько секунд.

Ключевые горячие клавиши для вырезания пером

• P - Включить инструмент «Перо».
• V - Включить инструмент «Курсор» (для перемещения точек).
• Ctrl+/ (Cmd+/) - Создать маску.
• Alt (Option) + клик по точке - Переключить тип точки.
• Ctrl (Cmd) + перетаскивание "рычага" - Управлять "рычагами" кривой независимо.

Запомните всего несколько основных комбинаций, чтобы ваш workflow стал намного эффективнее. Например, используйте P для быстрого выбора пера, а V - для мгпенного возврата к курсору. Клавиша Enter незаменима для завершения работы с разомкнутым контуром.

Вывод

Для вырезки изображения используйте Маску + Перо. Чтобы создать сложные векторные фигуры с нуля, используйте Перо. Для геометрического "вырезания" одной фигуры из другой применяйте Boolean Operations (Subtract). Инструмент «Перо» требует некоторой сноровки, но он невероятно мощный и является основой для работы с векторной графикой в Figma.