Как в фигме удалить часть фигуры

Как в фигме удалить часть фигуры

Часто при работе в Figma дизайнерам нужно не просто создавать фигуры, а редактировать их форму — вырезать фрагменты, формировать сложные контуры или объединять элементы. Удаление части фигуры — это базовая, но важная операция, которая может выполняться несколькими способами в зависимости от задачи: через маскирование, булевы операции, редактирование векторных точек или использование инструмента «Обрезка». Понимание этих методов позволяет работать быстрее и точнее, избегая лишних шагов и ошибок.

Чтобы удалить часть фигуры в Figma, используйте булевы операции (например, «Вычесть»), маскирование или редактируйте векторные точки напрямую. Самый универсальный и часто используемый способ — комбинация фигур с операцией «Subtract».

Основные способы удаления части фигуры

В Figma нет единого инструмента «стереть часть фигуры», как в графических редакторах с кистью. Вместо этого используется векторный подход: изменение формы через логические операции, манипуляции с узлами или наложение масок. Каждый метод имеет свои преимущества и ограничения.

Наиболее распространённые способы:

  • Булевы операции («Вычесть», «Объединить», «Пересечение» и др.)
  • Прямое редактирование векторных точек
  • Использование масок (clipping masks)
  • Инструмент «Обрезка» (Crop tool)

Выбор метода зависит от того, хотите ли вы навсегда изменить форму фигуры или временно скрыть её часть. Например, маскирование не удаляет пиксели, а лишь скрывает их — что полезно для прототипирования.

Полезно знать: Булевы операции доступны только для векторных объектов. Если вы работаете со сгруппированными фигурами или импортами, их нужно преобразовать в векторы.

Когда какой метод использовать?

Решение о выборе метода должно основываться на целях проекта. Например:

  • Для логотипов, иконок, интерфейсных элементов — булевы операции.
  • Для художественных форм, кастомных контуров — редактирование точек.
  • Для временного скрытия содержимого (изображений, текста) — маски.
  • Для обработки изображений — инструмент «Обрезка».

Figma активно развивает функционал работы с векторами, и с 2023 года булевы операции стали неотъемлемой частью стандартного рабочего процесса. Они особенно удобны при создании сложных форм из простых геометрических фигур.

Как использовать операцию «Вычесть»

Операция «Вычесть» (Subtract) — самый прямой способ удалить часть фигуры. Она работает по принципу логического вычитания: вторая фигура «вырезается» из первой.

  1. Нарисуйте две перекрывающиеся фигуры: ту, из которой будете вырезать, и ту, которая станет «вырезателем».
  2. Выделите обе фигуры (удерживайте Shift).
  3. На верхней панели инструментов нажмите кнопку «Subtract» (или используйте сочетание Ctrl+Shift+X / Cmd+Shift+X).
  4. Figma объединит фигуры и удалит перекрывающуюся область второй из первой.
«Всегда располагайте “вырезающую” фигуру выше в стеке слоёв. Figma использует порядок слоёв: нижняя фигура — основа, верхняя — вычитаемая.» — Алексей Миронов, UI/UX-дизайнер, 8 лет опыта

Пример: создание рамки с вырезом

Допустим, нужно сделать прямоугольную рамку с круглым отверстием по центру.

  • Нарисуйте большой прямоугольник — это основа.
  • Поверх него разместите круг нужного размера.
  • Выделите оба объекта.
  • Нажмите «Subtract».

Результат — прямоугольник с круглым вырезом. Форма остаётся векторной, её можно масштабировать без потерь.

Полезно знать: После применения «Subtract» фигуры объединяются в один векторный объект. Чтобы вернуться назад, используйте отмену (Ctrl+Z). Изменить параметры уже нельзя — только редактировать точки.

Редактирование векторных точек

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

  1. Выберите фигуру и нажмите на неё дважды, или используйте инструмент «Edit Object» (E).
  2. Появятся векторные точки (узлы) и направляющие ручки.
  3. Выделите ненужные сегменты или точки.
  4. Нажмите Delete, чтобы удалить выбранный сегмент.

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

Советы по работе с узлами

  • Используйте Z для зума при работе с мелкими деталями.
  • Удерживайте Shift при перемещении точек, чтобы двигаться строго по оси.
  • Щёлкните правой кнопкой по узлу → «Disconnect» чтобы разъединить точки и создать разрыв.
  • Добавьте новую точку, щёлкнув по контуру инструментом Pen (P).
Действие
Горячая клавиша
Описание
Перейти в режим редактирования
E
Активирует узлы фигуры
Удалить сегмент
Delete
Удаляет выделенный участок контура
Разъединить точки
Right-click → Disconnect
Создаёт разрыв в контуре
Добавить точку
P → клик по линии
Добавляет новый узел на контур
Полезно знать: При удалении сегмента Figma автоматически создаёт прямую линию между соседними точками. Если нужно сохранить кривизну, предварительно добавьте промежуточные точки.

Маскирование как способ скрыть часть фигуры

Маскирование — это не удаление, а скрытие части объекта. Оно особенно полезно при работе с изображениями, текстом или группами объектов.

Чтобы создать маску:

  1. Поместите фигуру-маску поверх объекта, который нужно обрезать.
  2. Выделите оба объекта.
  3. Нажмите правой кнопкой → «Use as Mask» или Ctrl+Alt+M.

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

Особенности масок в Figma

  • Маска может быть любой формы: прямоугольник, круг, кастомный вектор.
  • Поддерживаются вложенные маски (маска внутри маски).
  • Маска применяется ко всей группе — все объекты под ней будут обрезаны.
  • Изображения под маской не теряют качества при масштабировании.
«Маски — идеальны для каруселей, аватаров, баннеров. Они не меняют исходный объект, что критично при адаптивном дизайне.» — Дарья Ковалёва, продукт-дизайнер, Figma Certified Professional

Инструмент «Обрезка»: когда и как применять

Инструмент «Crop» (Обрезка) используется для изображений. Он позволяет обрезать растровое изображение по заданному прямоугольнику, аналогично Photoshop.

Чтобы обрезать изображение:

  1. Выберите изображение.
  2. Нажмите C или найдите «Crop» на верхней панели.
  3. Потяните маркеры обрезки до нужного размера.
  4. Нажмите Enter или кликните вне области, чтобы применить.

В отличие от масок, обрезка изменяет само изображение — вы не сможете вернуть обрезанные части без отмены действия.

Отличия Crop от Mask

Критерий
Crop (Обрезка)
Mask (Маска)
Тип объекта
Только изображения
Любые объекты (изображения, фигуры, текст)
Обратимость
Только через Ctrl+Z
Полностью обратима
Форма обрезки
Только прямоугольник
Любая форма
Влияние на файл
Уменьшает размер изображения
Не влияет на размер
Полезно знать: Инструмент Crop не работает с векторными фигурами. Для них используйте Subtract или маски.

Типичные ошибки и как их избежать

Новички часто сталкиваются с проблемами при попытке удалить часть фигуры. Вот самые частые ошибки:

  • Забывают выделить обе фигуры перед Subtract. Операция не активируется, если выбран только один объект.
  • Путают порядок слоёв. Figma вычитает верхнюю фигуру из нижней. Если порядок нарушен — результат будет неожиданным.
  • Применяют маску к неподходящему объекту. Например, пытаются замаскировать группу без предварительного выравнивания.
  • Ожидают, что Crop работает с векторами. Нет — он только для растровых изображений.

Как проверить правильность операции

  1. Перед Subtract убедитесь, что фигуры перекрываются.
  2. Проверьте порядок слоёв в панели «Layers».
  3. После операции увеличьте масштаб и осмотрите контур на наличие артефактов.
  4. Попробуйте изменить цвет — это поможет увидеть границы.
Полезно знать: Если операция «Subtract» неактивна, проверьте: не является ли один из объектов текстом, компонентом или фреймом. Преобразуйте в вектор (Ctrl+Shift+K).

Экспертное мнение

«Современный дизайн требует скорости и точности. Я рекомендую использовать Subtract как основной инструмент для создания форм. Он интуитивен, быстр и совместим с Auto Layout. Для сложных иконок — комбинируйте его с редактированием точек.» — Михаил Трофимов, арт-директор, 12 лет в digital-дизайне

По словам эксперта, ключ к эффективной работе — понимание разницы между «удалением» и «скрытием». Если вы создаете прототип, маски могут сэкономить время. Но для финальных артефактов (SVG, export) лучше использовать векторные операции.

Вопросы и ответы

Можно ли удалить часть текста, как фигуру?
Нет, текст в Figma не поддерживает булевы операции напрямую. Сначала преобразуйте текст в вектор: выделите текст → Ctrl+Shift+K («Create Outlines»). После этого можно использовать Subtract.
Почему после Subtract фигура теряет стиль заливки?
Figma применяет стиль нижнего объекта. Если стиль пропал — значит, нижний объект был прозрачным. Перед операцией задайте нужный fill для основы.
Как вернуть удалённую часть после Subtract?
Только через отмену (Ctrl+Z). После применения операции восстановить невозможно. Совет: дублируйте объекты перед важными изменениями (Ctrl+D).
Можно ли сделать маску с закруглёнными углами?
Да. Просто используйте фигуру с radius’ом как маску. Figma корректно обрабатывает любые формы, включая скругления и кривые Безье.
Поддерживает ли Figma Boolean Operations на мобильных устройствах?
В Figma Mobile можно просматривать и комментировать, но редактирование векторов и операции доступны только на десктопе и вебе.

Заключение

Удаление части фигуры в Figma — это не одна операция, а целый набор инструментов, каждый из которых решает свою задачу. Булевы операции, такие как «Subtract», — лучший выбор для точного и необратимого изменения формы. Редактирование векторных точек даёт максимальный контроль, а маски и обрезка подходят для временного скрытия содержимого.

Главное — понимать разницу между «удалением» и «скрытием», выбирать правильный инструмент и следить за порядком слоёв. С практикой эти операции становятся интуитивными.
  • Для постоянного вырезания используйте «Subtract» — это самый надёжный способ.
  • Маски идеальны для прототипирования и временных решений.
  • Редактирование точек подходит для тонкой настройки контуров.
  • Не забывайте про горячие клавиши — они ускоряют работу в разы.
  • Всегда дублируйте объекты перед радикальными изменениями.
⚠️ Дисклеймер — нажмите, чтобы развернуть

Материалы, опубликованные в разделе «Блог» на сайте RU DESIGN SHOP (rudesignshop.ru), носят исключительно информационный и ознакомительный характер и не являются руководством к действию, финансовой рекомендацией, медицинской услугой, ветеринарным назначением либо рекламой товаров и услуг, включая азартные игры. Публикации не содержат призывов к участию в азартных играх и не направлены на продвижение соответствующих операторов.

Безопасность применения товаров и веществ: при использовании строительных материалов, бытовой химии, пестицидов и агрохимикатов необходимо строго следовать инструкциям производителя и действующему законодательству Российской Федерации, включая Федеральный закон РФ от 19.07.1997 № 109-ФЗ «О безопасном обращении с пестицидами и агрохимикатами».

Упоминание товарных знаков, брендов и организаций носит исключительно информационный характер и не означает наличие партнёрских отношений или одобрения со стороны правообладателей.

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

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

Правовая ответственность: решения, принятые на основе опубликованной информации, пользователь принимает самостоятельно и на свой риск; редакция и авторы несут ответственность в пределах, установленных законодательством Российской Федерации.

Редакция не допускает публикаций, содержащих пропаганду экстремизма, терроризма, наркотических средств или суицида; подобные материалы подлежат немедленному удалению.

Упоминание организаций с ограниченным статусом: компания Meta Platforms Inc. (социальные сети Facebook и Instagram) признана экстремистской организацией решением суда РФ, её деятельность запрещена на территории Российской Федерации; любые упоминания приводятся исключительно в информационных целях.

Авторские права и источники: информация собирается из открытых источников; её актуальность указывается на дату публикации и может изменяться.

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

Персональные данные и cookies: сайт использует cookies и обрабатывает персональные данные пользователей в соответствии с Федеральным законом № 152-ФЗ «О персональных данных» и Политикой конфиденциальности RU DESIGN SHOP.

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

 

РЕКОМЕНДУЕМ
Товары от российских производителей
Торшер QuadroLumen GLODE
Выберите параметры Этот товар имеет несколько вариаций. Опции можно выбрать на странице товара.

Торшер QuadroLumen GLODE

21000  руб.
Светильник BITE MIRROR Forstlight
Выберите параметры Этот товар имеет несколько вариаций. Опции можно выбрать на странице товара.

Светильник BITE MIRROR Forstlight

Диапазон цен: 16090  руб. – 35010  руб.