Pencil и Brush в Figma: свободное рисование и последующая правка
Перо требует точности: каждая точка ставится осознанно. Pencil и Brush работают наоборот — вы ведёте линию, а программа сама расставляет узлы.
Это удобно для набросков и органических форм, но у свободы есть цена: количество точек зависит от длины и сложности линии.
Чем эти инструменты отличаются от пера
Практика: Pencil и Brush создают ту же векторную сеть, что и перо.
Практика: разница в том, кто расставляет точки: вы или алгоритм.
Практика: перо даёт предсказуемую геометрию, свободное рисование — живой контур.
Практика: правка обоих результатов происходит в одном и том же режиме вектора.
От чего зависит число точек
Практика: количество узлов определяется длиной и сложностью проведённой линии.
Практика: короткий штрих получает минимум точек, длинная кривая — заметно больше.
Практика: мелкие дрожания руки превращаются в лишние узлы, которые потом мешают.
Практика: поэтому для аккуратных иконок свободное рисование чаще используют как черновик.
Pencil
Практика: инструмент подходит для быстрых набросков и обводки референса.
Практика: линия получается гладкой за счёт автоматической расстановки узлов.
Практика: резкие смены направления могут дать неожиданную форму.
Практика: результат сразу является обычным векторным объектом с заливкой и обводкой.
Brush
Практика: Brush рисует с учётом нажима, если работаете на планшете.
Практика: на мыши разница между инструментами почти не заметна.
Практика: для иллюстраций с переменной толщиной это ближе к традиционному рисованию.
Практика: для интерфейсных иконок постоянная толщина важнее живости мазка.
Правка контура
Практика: двойной щелчок или Enter переводит объект в режим редактирования вектора.
Практика: точки двигаются инструментом перемещения, а перо добавляет новые.
Практика: Shift позволяет выделить и править сразу несколько объектов.
Практика: Escape выводит из режима и возвращает обычное выделение.
Кривые и рычаги
Практика: у гладкого узла рычаги связаны и двигаются симметрично.
Практика: с зажатой клавишей модификатора связь разрывается и появляется излом.
Практика: инструмент Bend изгибает целый сегмент, расставляя рычаги сам.
Практика: для правки нарисованного от руки Bend часто быстрее ручной расстановки.
Скругление
Практика: радиус угла задаётся для всей фигуры или для отдельной точки.
Практика: у открытого пути концы скругляются настройкой концов, а не радиусом.
Практика: для линий и сетей из одного штриха радиус недоступен.
Практика: сглаживание угла даёт непрерывную кривую вместо дуги окружности.
Порядок работы
- Нарисуйте черновик карандашом поверх референса.
- Уменьшите прозрачность референса и заблокируйте слой.
- Переведите объект в режим редактирования вектора.
- Удалите лишние узлы, оставив ключевые.
- Подправьте кривые инструментом Bend.
- Задайте радиусы в нужных углах.
- Проверьте форму на реальном размере.
- Уберите референс перед передачей файла.
Точность на выходе
Практика: для иконок держите координаты целыми, иначе края будут размыты.
Практика: проверяйте объект на 16 и 24 пикселях: мелкие детали исчезают первыми.
Практика: лишние точки увеличивают вес файла и усложняют правку.
Практика: после свободного рисования почти всегда нужна чистка узлов.
Набросок поверх референса
Свободное рисование редко используют в чистом виде: чаще это обводка готового эскиза или фотографии. Референс кладут отдельным слоем, снижают прозрачность и блокируют, чтобы случайно не сдвинуть его во время работы.
Практика: заблокируйте слой с референсом перед началом обводки.
Практика: снизьте прозрачность до значения, при котором линия видна.
Практика: удалите референс до передачи файла, иначе он попадёт в макет.
Чистка узлов
После свободного рисования контур почти всегда содержит лишние точки. Они не видны на глаз, но мешают: форма хуже держится при масштабировании, а вес файла растёт. Чистка занимает пару минут и заметно улучшает результат.
Практика: удаляйте точки, которые не влияют на изгиб линии.
Практика: сравнивайте форму до и после удаления каждого узла.
Практика: оставляйте точки в местах смены направления.
Кисть и обводка
Инструмент рисует контуром, а не заливкой, поэтому толщина задаётся в панели обводки. Если обводка нулевая, нарисованное просто не будет видно, и это первая причина жалоб «кисть не работает».
Практика: задайте цвет и толщину обводки до рисования.
Практика: для заливки замкните контур в начале и конце линии.
Практика: проверьте, что обводка не перекрыта другим слоем.
Сглаживание формы
У нарисованной от руки линии часто есть мелкие изломы. Их убирают инструментом Bend, который изгибает сегмент целиком, а не отдельные рычаги, — так форма остаётся плавной без ручной подгонки каждой точки.
Практика: изгибайте по одному сегменту, чтобы контролировать результат.
Практика: для симметричных участков повторяйте одинаковый изгиб.
Практика: проверяйте форму на увеличении и на реальном размере.
Когда лучше перо
Если форма геометрическая — иконка, схема, знак — свободное рисование создаёт лишнюю работу. Перо ставит точки точно, а сеть позволяет ветвить контур, поэтому для интерфейсной графики оно остаётся основным инструментом.
Практика: свободное рисование — для органики, перо — для геометрии.
Практика: набросок карандашом допустим, но финальную форму лучше перерисовать пером.
Практика: смешивать подходы в одной иконке не стоит.
Работа с планшетом
На графическом планшете линия получает давление и наклон, и кисть реагирует толщиной. Для набросков это плюс, для иконок — лишняя переменная: одна и та же линия будет разной толщины в разных местах.
Практика: для иконок отключите чувствительность к давлению.
Практика: для иллюстраций, наоборот, используйте её полностью.
Практика: проверьте, что планшет определяется без установки драйвера в браузере.
Слои и компоненты
Нарисованную форму стоит сразу превратить в компонент, если она будет повторяться. Так правки идут в одном месте, а копии обновляются автоматически, и файл не разрастается десятком почти одинаковых объектов.
Практика: называйте слои до того, как убрать объект в компонент.
Практика: не держите внутри компонента скрытые черновики.
Практика: проверяйте, как объект выглядит в небольших размерах.
Где ломается
Линия дрожит. Слишком много узлов после рисования.
Форма не заливается. Контур остался разомкнутым.
Радиус недоступен. выбрана линия или сеть из одного штриха.
Контур «плывёт» при масштабе. Часть линий осталась отдельными объектами.
FAQ
Pencil и Brush создают разные объекты?
Нет, оба дают векторную сеть; разница в поведении инструмента.
Можно ли уменьшить число точек?
Да, удаляя лишние узлы в режиме редактирования вектора.
Почему не работает скругление?
Радиус недоступен для линий и открытых концов пути.
Подходит ли свободное рисование для иконок?
Как черновик — да; финальную форму лучше чистить вручную.