Векторный контур с помощью планшета.

💖 Нравится? Поделись с друзьями ссылкой

И о покраске в векторе, меня все равно просят рассказать еще что-нибудь.

Векторный контур с помощью планшета.

В том что касается контура, я по прежнему отдаю предпочтение простой каллиграфической кисти с элементарными настройками.
Для вызова настроек кисти, в панели Brushes создайте новую или отредактируйте неиспользуемую кисть. Я предпочитаю следующие параметры:

Самый главный пункт в этих настройках это нижняя строка Size и выпадающее меню, в котором обязательно нужно поставить Pressure и вариацию для него. Это позволит кисти реагировать на ваш нажим на стилос.
Теперь рисуя такой кистью ощущение должно быть как от обычной кисти и бумаги. Сильнее = толще. Слабее = тоньше. Но! Есть нюанс;)
При рисовании с помощью планшета в растре настройки жесткости пера варьируются конечно же по личным ощущениям в данную минуту. Но что касается вектора, тут я всегда категорично ставила наивысшую жесткость пера. Чем жестче перо, тем послушнее линия, и тем более красиво и плавно вырисовывается контур.

И все было бы замечательно, но есть еще один нюанс;)
Думаю все неоднакратно сталкивались с невозможностью в векторе подобной кистью провести красивый резкий изгиб. Постоянно эти некрасивые срезы и будто бы кляксы от туши. Если честно, я тоже не знаю 100% способ борьбы с этим, но у меня есть некое средство, позволяющее минимизировать растрату нервных клеток на борьбу с такими кляксами.
При двойном клике на иконки кисти в палитре инструментов, вызывается еще одно меню настроек: Paintbrush Tool Options
Тут я по необходимости также подстраиваю чувствительность кисти – самый первый параметр Fidelity

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

Если же вы не доверяете своей руке на все 100% и вам нужно одним росчерком провести достаточно ровную дугу, то лучше всего будет перевести ползунок на Smooth, и довериться иллюстратору. Он сгладит все дрожания руки и выставит минимальное количество точек. Так, даже если не совсем точно линия пошла, ее будет проще подправить.

Рисование контуров и фигур



Рисунок 12.1 Панель управления инструментом Перо для рисования

Чтобы сделать работу с изображениями более гибкой, программ Photoshop также имеет элементы векторной графики. Векторные контуры и фигуры хранятся и обрабатываются на особых векторных слоях. Они никак не зависят от разрешения изображения. При экспорте в растровые форматы векторные контуры и фигуры приходится преобразовывать в растровый вид, но в документах формата Photoshop их можно свободно редактировать, меняя их форму и размер. Векторные объекты можно импортировать в векторные редакторы, сохранять в РDF-формате и выводить на печать на Post Sсriрt-принтерах.
Под контуром обычно понимается фигура или область, полученная с помощью логических операций сложения, вычитания и пересечения отдельных линий. Любой контур состоит из некоторого количества опорных точек, соединенных прямыми или кривыми линиями ­сегментами. Он может быть закрытым и открытым.
Сами контуры невидимы, но для выделенных ими областей вы мо­жете задавать обводку и заливку. Заливка - это цвет внутренней об­ласти контура. Она может быть сплошной, градиентной или узорчатой. Контур может иметь заливку и толщину обводки.
При рисовании контуров используется метод создания кривых Безье . Эта кривая третьего порядка, его вид определяется узловыми точками и управляющими касательными. В зависимости от касательных узловые точки могут быть гладкими и угловыми.
Для рисования кривых Безье , как правило, используется инструмент Перо (рис. 12.1 слева), с помощью которого вы сами расставляете точки Безье и регулируете в них кривизну линии с помощью манипулятора кривизны касательных. Для создания контуров очень сложной формы можно воспользоваться инструментом Свободное перо , позволяющим рисовать «от руки». Затем программа сама преобразует нарисованную линию в кривые Безье .
Простые фигуры типа прямоугольника, эллипса, звезды и т.д. проще всего рисовать с помощью специальных инструментов, которые располагаются на панели инструментов под инструментом Прямоугольник (рис.12.1 справа).
Рисовать пером и специальными инструментами можно как невидимые векторные контуры, так и цветные векторные фигуры. Режим рисования выбирается с помощью кнопок на панели управления, которые появляются там при выборе любого инструмента рисования (рис. 12.1 вверху).
Щелкните по кнопке Рабочие контуры панели управления, чтобы рисовать невидимые контуры. Соседняя кнопка Контурные слои создает новый слой заливки с текущим основным цветом, на котором вы будете рисовать фигуры.
Прежде чем рисовать, в свитке Стиль слоя можно выбрать один из готовых стилей для слоя заливки, чтобы сразу получить фигуры с тенями, ореолами, градиентами, узорными заливками и т.д. По умолчанию стиль у слоя отсутствует.
При работе со специальными инструментами рядом есть и третья кнопка: Заливка области , которая создает цветную растровую фигуру, залитую основным цветом. В этом режиме можно задать режим смешивания цветов и непрозрачность слоя.
При рисовании невидимых контуров программа запоминает конфигурацию контура в палитре Контуры . Самостоятельно она может помнить только один контур, который называется рабочим . Это временный контур. После закрытия документа или при создании нового контура он очищается. Чтобы при последующем открытии документа вы могли пользоваться созданным контуром, его надо сохранить в палитре контуров и дать ему имя.
Невидимые контуры сами никак на изображении не отражаются, но их можно преобразовывать в выделения, и им присваивать заливку и обводку. При преобразовании в выделение контур становится растровым и теряет свою независимость от разрешения.
Векторные цветные фигуры имеют довольно сложное устройство. При создании новой цветной фигуры для нее создается специальный растровый слой нужного цвета - слой заливки (рис. 12.1 справа). Фигуры, которые вы нарисуете для этого слоя, будут храниться в палитре Контуры как контур фигурной обрезки для слоя.
После того как на слое нарисована хотя бы одна фигура, на панели управления появляются еще четыре cnopki. С их помощью вы можете добавлять или вычитать из фигуры новые области, а также по-разному обрабатывать места их пересечения.
Выполним упражнение, чтобы на практике почувствовать, как рисовать в разных режимах, и понять, что при этом происходит.

1. Создайте новый документ размером 10х15 см , расширением 300 pix/inch в палитре RGB . Откройте палитры контуров Контуры и слоев и расположите их так, чтобы документ их не заслонял.
2. Выберите инструмент Пользовательская фигура.
3. Щелкните по кнопке Рабочие контуры на панели управления, чтобы нарисовать невидимый контур.
4. Откройте палитру пользовательских фигур Фигура , щелкнув по треугольнику, справа от этого поля на панели управления выберите в ней любую фигуру (например, сердечко) и щелкните по ней.
5. Щелкните в окне документа и ведите указатель по диагонали вниз. Когда контур будет нужных размеров, отпустите кнопку мыши. Посмотрите на палитру контуров (рис. 12.2 справа вверху). В ней появилась строка Рабочий контур , а в ней миниатюрное изображение нового контура. Сейчас этот контур активен (строка в палитре выделена подсветкой).
6. Щелкните на пустом месте палитры. Тем самым данный контур перестал быть активным в палитре, и в документе он пропал. Снова щелкните по этой строке - сердечко появилось, так как вы сделали рабочий контур опять активным.
7. Щелкните на пустом месте палитры контуров, выберите в па­литре пользовательских фигур другой контур и нарисуйте его. Вы видите, что это немедленно отразилось на миниатюре рабо­чего слоя. Там теперь новый контур, а сердечко, к сожалению, пропало. Вы видите, в чем недостаток работы с временным ра­бочим контуром: он помнит только последнее, что вы на нем нарисовали.
8. Теперь нарисуем цветную фигуру. Выберите какой-нибудь яркий основной цвет.
9. Щелкните на пустом месте палитры контуров, чтобы снять ак­тивность рабочего слоя. Щелкните по кнопке Контурные слои на панели управления. Выберите в палитре новую фигуру. Нарисуйте его в окне документа.
10. Посмотрите на палитру контуров. Там появилась строка Фигура 1 векторная маска. В палитре слоев появилась строка, похожая на строку маски слоя (рис. 12.2 справа внизу). Слева миниатюра слоя заливки - цветной прямоугольник, справа - миниатюра векторного слоя контуров фигурной обрезки для этого слоя. Она называется так же, как, и новая строка в палитре контуров, - Shape 1 . Между ними знак связи.
11. Попробуйте передвинуть след на новое место. Держа нажатой клавишу Ctrl , щелкните внутри него и перетащите. Вы видите, что контур переезжает вместе с цветной заливкой. Нарисуйте другую фигуру на этом же слое, при этом используйте cnopki на панели управления для проверки разных логических операций (добавление, вычитание и т.д.).
12. Выберите режим Заливка области и создайте растровые слои с пользовательскими фигурами.
13. Результат можете не сохранять.



Рисунок 13.2 Рисование векторных контуров и фигур

Самостоятельная работа № 1

Используя разные режимы и стили заливки, создайте свою композицию из пользовательских фигур. Сохраните под именем Самостоятельная работа № 1.

Рисование пером

Контуры произвольной формы рисуют инструментом Перо . На панели управления кнопка Рабочие контуры позволяет рисовать контуры, а не фигуры. Для этого щелкните в одной точке, затем - в другой, в третьей и т.д. Тем самым вы создали несколько опорных точек, а программа автоматически соединит их отрезками прямых. Для создания замкнутого контура надо последнюю точку поставить точно на месте первой точки контура (по виду указателя в виде полого кружка).
Кривые линии можно рисовать с помощью этого же инструмента, но сделать это несколько сложнее, поэтому подробно опишем эту операцию на примере. Установите указатель в виде пера на пустом месте, нажмите левую кнопку мыши и, не отпуская ее, ведите указа­тель строго вверх.
Вы видите, что из опорной точки, которую вы создали, выходят направляющие прямые - касательные к кривой в данной точке. На их концах находятся управляющие точки.
Управляющие касательные являются вспомогательными средствами для рисования кривых, их часто называют манипулятором кривизны. Манипуляторы кривизны определяют касательную к кривой, а длина его ручки определяет радиус кривизны в этой точке.
Точка является гладкой, если две ветви касательной лежат на одной прямой. Касательные, состоящие из двух ветвей, приводят к угловым точкам. Манипуляторы угловой точки могут находиться под углом друг к другу, и вы можете поворачивать обе точки независимо друг от друга.
На панели управления при установленном флажке Автоматически добавить/удалить у вас есть возможность во время рисования добавлять и удалять точки в уже нарисованной части контура. Щелкните на любой неконечной точке, и она будет удалена, а соседние с ней точки соединятся сегментом, кривизна которого зависит от их манипуляторов.
Рисование инструментом Свободное перо аналогично рисованию карандашом на листе бумаги. Опорные точки расставляются автоматически, независимо от вас. Зато вы можете отредактировать их потом, после окончания рисования контура.

Упражнение 12.2. Рисование свободным пером

1. Выберите инструмент Свободное перо.
2. Щелкните и ведите указатель, не отпуская кнопку мыши «не отрывая руки». Нарисуйте, таким образом, какой-нибудь контур (например, фигуру с приятными очертаниями - рис. 12.3). Когда вы отпустите кнопку мыши, увидите все автоматически созданные опорные точки кривой.
3. Чтобы продолжить линию, щелкните в любой конечной точке и ведите указатель дальше. Чтобы нарисовать замкнутый контур, доведите указатель до его первой точки и отпустите кнопку мыши.
4. Можно не сохранять.



Рисунок 12.3 Рисование инструментом Свободное перо

Упражнение 12.3. Магнитное свободное перо

На панели управления флажок Магнитное включает режим магнитного пера. Этот режим напоминает выделение магнитным лассо. Магнитное перо хорошо работает только для объектов, расположенных на контрастном фоне. Работа инструмента основана на нахождении мест наибольшего контраста.

1. Откройте документ 3аяц.jрg из папки Урок 12.
2. Выберите инструмент Свободное перо . Установите флажок Магнитное на панели управления.
3. Щелкните точно между красивыми ушками зайчика. Там появилась первая фиксированная точка. Она выглядит как черный квадратик. .
4. Отпустите кнопку мыши и ведите указатель вдоль изображения пушистого зайчика. Вы видите, что за ним тянется черная линия. На некотором расстоянии от первой точки появился второй черный квадратик, а первый стал полым. Полые точки уже закреплены, вы можете их только удалить по одной, начиная с конца, нажатием клавиши Del .
5. По мере того как вы ведете указатель, на линии появляются все новые точки. Если программа провела границу неточно, верни­те указатель до места, где она пошла не туда, и сами поставьте там точку, щелкнув левой кнопкой мыши.
6. Обведя всего зайца, поставьте последнюю точку точно на первую (рядом с указателем появится полый кружочек) и щелкните левой кнопкой мыши.
7. Контур, который вы нарисовали, хранится пока только как временный рабочий контур. Если вы сейчас закроете документ, он потеряется.
8. Откройте палитру Контуры - рис. 12.4. Здесь пока только одна строка Рабочий контур . Выполните команду меню палитры Сохранить контур и введите имя контура (например, Заяц или Тигр). Щелкните по кнопке ОК.
9. Не закрывайте. Работа будет продолжена.




Рисунок 12.4. Рисование инструментом Магнитное перо

Рисование специальными инструментами

Для рисования стандартных контуров и фигур используются специальные инструменты. Выбирать их можно на панели инструментов (см. рис. 12.2). Чтобы нарисовать прямоугольник с прямыми или закругленными углами, выберите инструмент Прямоугольник или закругленный прямоугольник. Установите указатель в верхний угол будущего прямоугольника и тащите указатель вниз по диагонали. Когда прямоугольник достигнет нужных размеров, отпустите кнопку мыши.
Эллипсы рисуются точно так же, как прямоугольники, но другим инструментом - Эллипс . При включенной кнопке Окружность будет рисоваться окружность.
Чтобы нарисовать правильный многоугольник, выберите инструмент Многоугольник . На панели управления в поле Стороны введите число сторон многоугольника. Одновременно с заданием размеров фигуры вы можете вращать ее.
Чтобы нарисовать звезду, откройте окно настройки инструмента, щелкнув по стрелочке, справа от инструментов на панели управления. Установите флажок Втягивать стороны на и введите рядом глубину лучей звезды. Она выражается в процентах от внешнего радиуса. В поле Радиус введите значение радиуса, если вам надо нарисовать многоугольники или звезды фиксированного размера.
Чтобы нарисовать линию, выберите инструмент Прямая . Указатель мыши примет вид крестика. Щелкните в любом месте холста и тащите указатель в нужном направлении, за ним потянется прямая линия.
На панели управления в поле Толщина введите толщину прямой линии. Чтобы нарисовать прямую линию со стрелкой, откройте окно настройки инструмента. Установите флажок Начало , чтобы создать стрелку в начале прямой и или Конец ­в ее конце. В полях Ширина и Длина задайте ширину стрелки и ее длину по отношению к толщине линии. В поле Вогнутость задайте величину, отражающую степень вогнутости основания стрелки.
Выбрав инструмент Пользовательская фигура , вы сможете пользоваться палитрой стандартных фигур или тех, что создали сами. Чтобы открыть палитру, щелкните по треугольнику рядом со свитком Фигура на панели управления.
Щелкнув по треугольнику справа от кнопок инструментов на панели управления, вы можете выполнить настройку для выбранной фигуры в диалоговом окне: Без ограничения, Заданные пропорции, Заданные размеры, Фиксированные размеры, Из центра.
Вы можете сохранить любой из созданных вами контуров или кон­туров фигурной обрезки в этой палитре. Для этого можно из контекстного меню выбрать команду Определить пользовательскую фигуру - эта фигура появится в конце списка палитры.

Выделение и преобразование контуров

Для выделения контура как единого целого служит инструмент Выделение линии контура.
Если щелкнуть им на линии контура, то будут видны все ее опор­ные точки. Этим же инструментом можно перетащить контур в другое место, а также скопировать его, переместив при нажатой клавише Alt . Для удаления одной или нескольких компонентов контура выде­лите их и нажмите клавишу Del .
Контуры и их отдельные компоненты можно масштабировать, вращать, зеркально отражать, перекашивать и искажать с помощью команды трансформирования.
Для выделения отдельных опорных точек и сегментов используется инструмент Прямое выделение .
Попробуем выделять контуры и их элементы на практике.

Упражнение 12.4. Инструменты для выделения кон­туров

1. Откройте знакомое вам изображение Заяц.jрg (рис. 12.4).
2. С помощью инструмента Магнитное перо выделите зайца.
3. Откройте палитру Контуры и выберите инструмент Выделение линии контура. Щелкните по этой линии. Все опорные точки контура стали видны как черные квадратики.
4. Сделаем копию контура. Для этого щелкните по нему при нажатой клавише Alt и перенесите его в сторону. Старый контур остался на месте, а у вас новый заяц. Снимите выделение, щелкнув на пустом месте.
5. Выберите инструмент Прямое выделение . Щелкните по сегменту контура между двумя опорными точками. Все точки стали видны как полые квадратики. Это значит, что ни одна из них не выделена. Зато у двух точек сегмента стали видны ручки манипуляторов: по одной ручке у каждой точки.
6. Щелкните этим инструментом по опорной точке. Она стала черной, следовательно, она выделена.
7. Теперь выделим сразу несколько точек. Удобнее всего это сделать с помощью рамки. Для этого щелкните выше и левее всех нужных точек и ведите указатель вниз по диагонали. Когда все эти точки попадут внутрь прямоугольника, отпустите кнопку мыши.
8. Точки, которые трудно вместить в рамку, выделите при нажа­той клавише Shift , щелкая по ним по очереди, и передвиньте их в сторону.
Для создания и удаления опорных точек предназначены инструменты Добавить опорную точку и Удалить опорную точку (рис. 12.1 слева). Чтобы добавить опорную точку, щелкните в этом месте контура первым инструментом, а чтобы удалить точку, щелкните по ней вторым инструментом.
Если выделить сегмент и нажать клавишу Del , сегмент исчезнет, но его опорные точки останутся неизменными. Инструмент Преобразование точки используется для преобразования гладкой узловой точки в угловую, и наоборот, что позволяет изменить кривизну контура в конкретной точке.
Замкнутые контуры можно легко преобразовывать в выделения, а выделения - в контуры. Для этого можно выбрать команду Выполнить выделение из меню палитры контуров.
Также необходимо отметить, что для перевода векторных фигур и контуров в растровые следует выбрать команду Слой ~ Растеризовать ~ Фигуру. После этого можно осуществлять с ними любые операции.

9. Перевести векторный контур зайца в растровое выделение, подредактируйте усы и растеризуйте контур.
10. Залить зайца узором или другой заливкой.
11. Сохраните под именем Заяц.

Контрольные вопросы:

    Как создать векторный контур? Что позволяет инструмент Перо и Свободное перо?

    Что такое кривая Безье? Что такое гладкая и угловая точка?

    Для чего предназначен инструмент Контуры? Особенности данного инструмента?

    Для чего предназначены инструменты Прямоугольник, Эллипс, Многоугольник?

Можно превратить в вектор растровое изображение , то есть превратить его в SVG-элемент контур.

В настоящее время для векторизации в inkscape использует код программы Potrace Питера Селинджера (). Возможно в будущем будут добавлены и другие программы, но даже на данном этапе имеющихся возможностей вполне достаточно.

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

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

Для того чтобы сделать из растрового изображения векторные контуры загрузите или импортируйте растровое изображение. Выберите объект растровое изображение, которые будете переводить в контуры и в главном меню выберите команду "Контуры" - "Векторизовать растр...", либо используйте комбинацию клавиш Shift+Alt+B .

Вы увидите три фильтра. Первый из них "сокращение яркости". Этот фильтр просто использует сумму красного, зелёного и синего компонентов пикселя (иначе говоря, оттенки серого) в качестве индикатора, и решает, воспринимать ли его, как чёрный или как белый. Значение порога яркости может быть задано в диапазоне от 0,0 (чёрный) до 1,0 (белый). Чем выше значение, тем меньше пикселей будет воспринято как "белые" и тем больше черного станет на изображении.


Вариант второй - "Определение краев". Этот фильтр использует алгоритм определения краев, придуманный Дж. Канни (J. Canny). Этот алгоритм векторизации представляет собой способ быстрого поиска изоклин (изоклина - линия, на всём протяжении которой наклон, определяемый уравнением, сохраняет постоянное значение) и подобных контрастов. Этот фильтр создает картинку, меньше похожую на оригинал, чем результат первого фильтра, но предоставляет информацию о кривых, которая при использовании других фильтров была бы проигнорирована. Значение порога здесь (от 0,0 до 1,0) регулирует порог яркости между смежными пикселями, в зависимости от которого смежные пиксели будут или не будут становиться частью контрастного края и, соответственно, попадать в контур. Фактически, этот параметр определяет темноту или толщину края.


Третий вариант "Квантование цветов". Результатом работы этого фильтра является изображение, которое заметно отличается от результата работы двух предыдущих фильтров, но при этом тоже может оказаться полезным. Вместо того чтобы показывать изоклины яркости или контраста, этот фильтр ищет края, где меняется цвет, даже если смежные пиксели имеют одинаковую яркость и контраст. Параметр этого фильтра (количество цветов) определяет количество цветов на выходе, как если бы растровое изображение было цветным. После этого фильтр определяет чёрный это пиксель или белый в зависимости от чётности индекса цвета.


Обращаем внимание начинающих пользователей, что результат работы векторизатора хоть и расположен поверх исходного растрового рисунка, но представляет собой отдельный объект контуров. Этот объект сразу является выделенным и можно переместить его мышкой или стрелочками клавиатуры, что бы убедиться в его самостоятельности. Узлы объекта можно редактировать с помощью инструмента управления узлами (подробнее см. в разделе инструкция inkscape). Стоит попробовать все три фильтра и внимательно рассмотреть различия в результатах обработки разных изображений. Все изображения индивидуальны. Обязательно найдётся такой рисунок, на котором один фильтр работает лучше, а другие хуже.

После векторизации рекомендуется воспользоваться функцией упрощения контуров, чтобы уменьшить количество узлов. Эта функция находится в главном меню "Контуры" - "Упростить" или комбинация клавиш Ctrl+L . C уменьшением узлов результат работы после векторизации более лёгким для редактирования.

На рисунке ниже слева показан результат последнего фильтра с отображением узлов контура сразу после векторизации. Справа тот же объект но после упрощения контуров. Этот рисунок показывает результат упрощения достаточно наглядно.


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



Рассказать друзьям