Как перегнать в кривые растровое изображение. Как в иллюстраторе сделать из растрового изображения векторное


Как перевести растр в вектор в программе Adobe Illustrator

Допустим, у нас есть какое-то растровое изображение и мы хотим получить его в векторном виде (или в кривых). Что нам для этого необходимо сделать? Прежде всего нужна программа Adobe Illustrator.

Версия значения не имеет.

Порядок действий

Открываем наше растровое изображение в Adobe Illustrator. Для этого можно кликнуть на рисунке правой кнопкой мыши и выбрать из выпадающего меню Открыть с помощью… > Adobe Illustrator или запустить иллюстратор и перетащить рисунок на рабочую область.

Исходное изображение

На панели инструментов выделяем инструмент «Выделение» (черная стрелочка) и этой стрелочкой щелкаем на нашем изображении. При этом рисунок должен выделиться. Чтобы проверить это, можете попробовать немного переместить его, зажав левую кнопку мыши, когда курсор находится над рисунком (по принципу drag-and-drop).

Над рабочей областью находим кнопку «Быстрая трассировка» и щелкаем на расположенную рядом стрелочку. Она показывает все доступные для этого действия опции. Нам нужен пункт «Параметры трассировки…«. Когда мы на него кликаем, открывается окно с параметрами.

В правой части окна параметров выбрать пункт «Просмотр«. Это поможет получить более хороший результат и разобраться за что отвечает каждый из параметров.

Дальше есть два пути:

1) делать по-науке, то есть вам нужно будет прочитать во всплывающих подсказках, какой из параметров на что влияет и выставить необходимые значения;

2) поэкспериментировать с параметрами самостоятельно, используя так называемый «метод научного тыка».

Я предпочитаю второй способ: во-первых, не всегда русский перевод того или иного слова полностью передает заложенный в оригинале смысл, а во-вторых, зачастую так быстрее и проще запоминается. Изменяете параметр. Смотрите, на что влияет (визуально). Комбинируете несколько параметров. И так до достижения более-менее приемлемого результата.

Полученное векторное изображение.

Когда картинка уже похожа на истину, в окне параметров трассировки нажимаем «Трассировка» и в меню над рабочей областью кнопку «Разобрать«. Таким образом мы получаем первоначальное изображение, но уже в кривых.

Если же вас не устраивает полученный результат, его можно доработать. Для этого с помощью инструмента «Выделение» необходимо выбрать все созданные кривые (нажать левую кнопку мыши и, удерживая ее, обвести весь рисунок целиком). Идем в пункт меню «Объект» > «Трансформирование» > «Масштабирование» и меняем размер изображения таким образом, чтобы оно было достаточно большим для удобства редактирования. Затем выбираем инструмент «Прямое выделение» (белая стрелочка). Этой белой стрелочкой поочередно кликаем в каждый узел и выравниваем сплайны так, как это необходимо: при выделении вершины рядом появляются усы, потянув за которые можно изменять кривизну сплайна.

Результат в режиме сетки

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

zavstas.ru

Как преобразовать растр в вектор | Vecart

В этой статье мы рассмотрим как преобразовать растр в вектор. Работая в Adobe Illustrator часто приходиться использовать растровые изображения. Например, ваш набросок или скетч, который был отсканирован. Микростоки не принимают векторные работы, в которых есть растровые эффекты. И если вы решили заняться продажей вектора на микростоках, то эта статья будет полезна.

 

Как найти растр в векторном файле

Для того, чтобы найти растрированные объекты в векторном файле необходимо сделать следующее:

  • открыть файл
  • на вкладке Window открыть панель Links

Если панель Links пуста, то в вашем файле нет растрированных объектов.

 

Преобразуем текст в вектор (кривые)

 

Для примера набираем текст.

При выбранном тексте на вкладке Object выбираем пункт Expand.

В появившемся окне ставим галочки в полях Object и Fill. Жмем ОК.

Текст преобразован в вектор. Разгруппировываем его.

И каждая деталь стала независимой векторной фигурой.

 

Преобразуем фотографию в вектор

 

Для примера я взял черно-белую фотографию с одного из бесплатных микростоков.

Выделяем фотографию и на верхней панели появляется кнопка Live Trace. Жмем ее.

Далее жмем кнопку Expand.

Разгруппировываем и готово.

Дополнительные возможности

 

Минуту назад мы произвели простую трассировку (Trace) с установками по умолчанию. Также в Adobe Illustrator есть возможность производить трассировку с необходимыми настройками. Варианты трассировки можно найти на вкладке рядом с кнопкой Live Trace.

 

Чтобы открыть окно настроек трассировки выберите пункт Tracing Options. В открывшемся окне поставьте необходимые параметры.

 

 

Эффекты в Adobe Illustrator

 

После использования эффектов Adobe Illustrator векторные объекты могут быть растрированы.

 

 

Минуту назад мы произвели простую трассировку (Trace) с установками по умолчанию. Также в Adobe Illustrator есть возможность производить трассировку с необходимыми настройками. Варианты трассировки можно найти на вкладке рядом с кнопкой Live Trace.

vecart.ru

5 способов создать векторную картинку в Adobe Illustrator

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

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

Сейчас стало труднее. Потому что этап «новичковости» уже прошел, и очень многие вещи мне кажутся настолько очевидными, что пока кто-то из новичков не начинает задавать про них вопросы, мне не приходит в голову о них написать. Поэтому, ребята, не стесняйтесь писать комментарии, задавать все вопросы, даже те, которые кажутся глупыми (глупых вопросов не бывает).

Три картинки — три разных способа создания. Угадаете, где какой? :)

Это я все к тому, что меня тут как-то недавно спросили — а как удобнее обрисовывать картинку в Иллюстраторе?

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

Трейс / Image Trace

Самый автоматизированный способ сделать из скетча векторную картинку и, как мне казалось раньше, самый быстрый (дисклеймер — сейчас я уже так не думаю).

Трейс картинки осуществляется с помощью панели image trace (верхняя панель Window — Image Tace) — просто помещаете свой скетч на рабочую область, открываете панельку, в выпадающем меню выбираете один из пресетов (у всех разные настройки, выбрать лучший можно методом тыка) — например, sketch — и через минуту-другую ваш файл превращен в вектор. Потом нужно только не забыть удалить “мусор” — разные пустые пути, которые образуются в процессе. Для этого не снимая выделение с оттрейсенного объекта надо пойти в верхнее меню Object — Path — Clean Up.

Трейс готов! Как говорили на одной моей прошлой работе “нажал кнопку — и в кассу”. Но, увы, все не так просто.

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

Я делаю так: включаю видимость путей (cmd+H), выбираю контрастный цвет для них по отношению к обводке (двойной клик по названию слоя) — и, увеличив картинку до 200-300% проверяю аккуратность линий. В этом мне сильно помогают обычный карандаш — он мне нравится больше, чем сглаживающий — и плагин от Astute Graphics Smart Remove Brush Tool, которым можно удалять лишние точки, минимально изменяя линию.

Тут важно не переусердствовать в “вылизывании” картинки — если вам нужно идеальные ровные линии — быстрее использовать один из инструментов, о которых речь пойдет ниже. Трейс разумно использовать тогда, когда хочется сохранить эффект “нарисованности вручную”.

Я на данный момент использую трейс только для цитат вроде такой:

Плюсы и минусы трейса: 

+ Можно относительно быстро превратить хороший скетч в векторную картинку с сохранением hand drawn эффекта

– Нужно потратить время, чтобы обработать– Весь объект уже векторный, то есть труднее поменять толщину линий– Линии не будут идеально ровными (это же и плюс)

Мой вердикт таков — использовать трейс надо с умом, применяя его ни ко всему подряд, чтобы сэкономить время на обработку, а к избранным картинкам, чтобы сохранить “ручной” эффект и некую небрежность линий.

Блоб браш / Blob Brush

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

У этого инструмента так много поклонников, что мне даже как-то неловко признаваться, что я его не люблю и практически совсем не использую. Это вызывает у людей примерно такие же эмоции, как когда я говорю, что мне не нравится “Мастер и Маргарита”. Но что есть — то есть :) Примеры употребления блоб браша в моем портфолио можно найти только на очень-очень старых картинках, которые, скорее всего, будут удалены во время следующей чистки.

Одна из моих первых картинок, нарисованная блоб брашем

Блоб брашем можно рисовать линии также, как вы это делаете фломастером на бумаге (сравнивать с кистью, мне кажется, не совсем верно, тк прозрачность блоб браша не регулируется нажимом), при условии, повторюсь, наличия планшета.

Плюсы и минусы блоб браша:

+ Облегчает художникам переход с растра на вектор+ Имитирует “живое” рисование

– Нужен планшет, чтобы оценить всю прелесть (и умение рисовать тоже не помешает)– Толщину линий можно задавать только перед рисованием, как только линия проведена — она по сути является векторным объектом с заливкой, — как и в случае с трейсом регулировать толщину постфактум сложно

Пентул / Pentool

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

Почему-то мне видится, что блоб брашем больше рисуют девочки, а пентулом — мальчики, потому что он такой строгий и серьезный. И да, это мой любимый инструмент. Правда, не стандартный пентул, а апгрейд от Астуте Графикс под названием Вектор Скрайб.

Плюсы и минусы пентула: 

+ Чистые и аккуратные линии+ Можно регулировать толщину нарисованных линий/картинки в любой момент за пару секунд, пока не сделан экспанд (который нужно делать перед отправкой на стоки, но лучше сохранять в рабочем файле неэкспанднутую копию)+ Пентул — отличный способ создавать картинки на стоки для тех, кто не умеет рисовать в классическом понимании этого слова

– Все рисование сводится к расстановке точек и повороту ручек — многих креативных людей это напрягает– Полезно также освоить инструмент Shape Builder Tool и панель Pathfinder, потому что обычный ластик удалить лишнее не поможет– Чтобы научиться уверенно обращаться с пентулом, нужно освоить какое-то количество теории и много, много практиковаться, при этом первое время линии будут получаться кривоватыми и на отрисовку будет уходить много времени

Кисточка (обычная) /  Brush

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

Что на линию, проведенную кистью, что на “пентульную” можно “насадить” огромное количество самых разных кистей — из стандартной библиотеки (правда, официально на стоки их использовать нельзя), либо !! своих собственных, каждый раз получая новый результат. Потом нужно не забыть все это дело отэкспандить (то есть превратить в вектор с помощью команды Object — Expand).

Плюсы и минусы кисточки: 

+ Сохраняется возможность редактирования линий и можно рисовать руками (не точками)

– Нужен планшет– Линии почти всегда получаются не такими, как хочется, — может у меня руки кривые, но по моим ощущениям тот же блоб браш позволяет точнее контролировать линию

У блоб браша и кисточки есть свои индивидуальные настройки, добраться до которых можно, дважды кликнув по конкретному инструменту в левой панельке.

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

Простые геометрические формы

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

Посмотрев курс Illustration for Designers: Create Your Own Geometric Animal (Иллюстрация для дизайнеров: Создайте свое собственное геометричное животное) на Skillshare я переосмыслила роль форм в картинках и мне стало интересно научиться видеть формы в объектах. Так родилась серия животных, которую я скоро планирую продолжить:

Плюсы и минусы рисования формами: 

+ Линии получаются идеальными, не нужно думать о том, куда поставить точку и как потянуть за ручку

– Перестроиться на «мышление формами» большинству людей очень сложно– Все равно придется использовать дополнительные инструменты — пентул, панель пасфайндер или шейп билдер тул

Примерно 80% моих текущих картинок нарисованы плагином InkScribe — тот самый аналог пентула от Astute Graphics, о котором я уже говорила (я, кстати, планирую написать отдельный пост про астутовские плагины, как только меня перестанет пугать потенциальный размер этого поста).

Остальные 20% — это трейс, простые формы и иногда — Dynamic Sketch Tool. Это что-то вроде карандаша, только более аккуратный и с большим количеством настроек (опять же, астутовский).

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

Фото на обложке: ShutterStock

infogra.ru

Как перевести растровое изображение в векторное быстрым способом в Adobe Illustrator.

Скачать материалы урока

При работе с графическими редакторами, особенно веб-дизайнерам, иногда требуется перевести растровое изображение в векторное. Это бывает необходимо в разных случаях, например, если вы нарисовали логотип в фотошопе, а позднее его потребовалось перевести в векторный формат для печати на большом плакате. Ну или другие случаи, просто векторный формат достаточно универсальный и отлично подходит для печати крупномасштабных баннеров, наклеек и т.п..

Для подготовки изображения к дальнейшему переводу его в векторный формат нам понадобится растровый редактор. Так как Illustrator не умеет работать в полной мере с растровыми изображениями, воспользуемся фотошопом.

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

1. Подготавливаем изображение в фотошопе

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

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

Берем слой с надписью (названием логотипа), выбираем в верхнем меню "Изображение" - "Коррекция" - "Уровни", либо нажимаем комбинацию клавишь "Ctrl + L" и в появившемся окне настроек выставляем ползунок выходных значений в крайнее левое положение.

Данное действие перекрасит изображение в черный цвет. После этого просто сохраняем получившуюся картинку в формате jpg ("Файл" - "Экспортировать" - "Сохранить для web"). Таким образом необходимо поступить со всеми слоями логотипа, кроме надписи под логотипом. В итоге получаем набор изображений в формате jpg, как на картинке ниже, только каждый элемент должен быть отдельной картинкой.

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

2. Переводим изображения в вектор и собираем логотип

Открываем Adobe Illustrator и создаем холст размером, соответствующим сохраненным изображениям, в данном случае у меня получился размер 500x229 пикселей.

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

Далее в верхнем меню выбираем "Объект" - "Растрировать", при этом слой изображения должен быть выделен.

Затем в верхнем меню выбираем "Объект" - "Трассировка изображения" - "Создать" и кликаем на значок настройки трассировки в верхней панели меню. В открывшемся окне настроек выставляем нужные значения, лини делаем ровные и плавные, после чего закрываем окно настроек.

Теперь в верхнем меню выбираем "Объект" - "Разобрать" и в открывшемся окне ставим обе галочки, после чего нажимаем "Ок".

После данных действий мы получим разобранное изображение на слои, которые будет видно в панели слоев. Необходимо удалить лишние слои с белым фоном, оставить только нужные слои с буквами.

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

Переводим обычную картинку в вектор

Во втором случае требуется перевести какое-то обычное растровое изображение в векторное. Для этого нам уже не понадобиться фотошоп, просто открываем изображение программой Adobe Illustrator и выделив слой данной картинки выбираем в верхнем меню "Объект" - "Растрировать" и в открывшемся окне нажимаем "Ок".

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

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

После всех действий разбираем изображение, как и в первом случае "Объект" - "Разобрать", ставим обе галочки, нажимаем "Ок" и получаем векторное изображение, состоящее из множества слоев.

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

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

1024pixels.ru

Трассировка растровых изображений в Иллюстраторе

Привет всем! В этом уроке Adobe Illustrator мы разберём автотрейс. И в этом нам поможет Наталия Латынина, которая расскажет и покажет, как она трассирует элементы для паттернов, нарисованные вручную. Это уже не первый урок про автотрейс на нашем блоге. Тут вы можете посмотреть как трейсить мятую бумагу:

Также могу добавить, что сейчас Shutterstock (и Bigstock заодно) довольно жёстко относятся к приёмке автотрейса. Но монохромный автотрейс, обработанный и вычищенный от всякого мусора, принимают нормально.

А сейчас, если вы готовы, то передаю слово Наталии. Приступаем к уроку Adobe Illustrator.

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

Многие начинающие стокеры считают этот процесс каким-то очень сложным. На самом деле он занимает не так много времени, как, например, сама отрисовка изображения. Для того, чтобы подготовить изображение к трассировке совсем не обязательно запасаться дорогостоящими инструментами, как советуют многие иллюстраторы в своих курсах для новичков. Тем более, если вы не уверены, что будете в будущем часто пользоваться этим способом создания своих работ.

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

Этап 1

Рисуем изображение. Собственно, никакой трассировки не получится без самой картинки. Рисуем карандашом эскиз на белой бумаге. В данном примере это элементы для паттерна. Когда рисунок готов - обводим ручкой. При обводке изображения положите лист бумаги на тетрадь или стопку листов. Так ручка будет идти мягче.

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

Этап 2

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

Этап 3

Подготовка фото. Так как мы использовали не сканер, а фото, надо привести его в приемлемый вид. Обрезаем лишние участки, если они есть и оставляем только область с рисунком. Далее необходимо использовать любой фоторедактор, в котором есть настройки яркость/контрастность/насыщенность и приводим с помощью них нашу фотографию примерно в такой вид:Я не называю конкретный фоторедактор и не показываю его настройки в пример, т.к. настройки будут всегда разными в зависимости от качества фотографии.

Этап 4

Трассировка. Открываем изображение в иллюстраторе. Я использую иллюстратор CS6, поэтому окно программы и некоторые настройки могут отличаться, если вы используете другую версию.

Выделяем картинку мышкой и идем в меню «Объект» > «Трассировка» > «Создать».Если появляется такое окно:

Жмем «Ок» и у нас начинается процесс трассировки.

Получаем картинку.

Выглядит не очень. Контуры во многих местах прерываются. Чтобы это исправить, нужно открыть расширенные настройки трассировки. Для этого на верхней панели нажимаем на эту кнопку:Чтобы убрать разрывы в контурах нам нужно увеличить значение параметра «изогелия» в появившемся меню. Например, если увеличить значение до 170 получается уже вот такая картинка!Выглядит гораздо лучше.

По необходимости меняем другие параметры.

Также выбираем метод трассировки – стык или контуры с наложением. Я предпочитаю вариант 2, т.к. при первом могут возникать дефекты в виде светлых промежутков между контуром или заливкой.

Когда все параметры выбраны, необходимо закрыть окно настроек и разобрать изображение. Элементы для паттерна готовы! На этом тема автотрейса у нас закончена. Если есть какие-то вопросы, то можете задавать их в комментариях.

Ну, а если вы смогли сделать свои векторные элементы для паттерна по этому уроку, то вполне можно переходить к созданию самого паттерна. В этом вам поможет полезная подборка в vk для настоящих любителей паттернов - НАЖМИ МЕНЯ.

Внутри вы найдёте видео каст по паттернам для самых начинающих, а также уроки по созданию бесшовных текстур:1. Мозаика;2. Геометрический узор;3. Чередующийся орнамент;4. Непрерывный переплетающийся.

Наталия Латынина специально для блога Записки микростокового иллюстратора

anna-volkova.blogspot.com

Как сделать автотрейс растрового изображения в Adobe Illustrator ~ Записки микростокового иллюстратора

Довольно часто меня спрашивают по поводу функции автотрейса в иллюстраторе. Реалистичная акварелька, силуэты, гранжевые текстуры и другие прикольные штуки - всё это можно автоматически перегонять в векторные формы в Adobe Illustrator. Посему я решил опубликовать урок на блоге. Тема эта довольно попсовая, и ничего тут сложного на самом деле нет. Данный урок по Adobe Illustrator я рекомендую в первую очередь начинающим. В сегодняшнем уроке я сделаю автотрейс вот такого листа жомканой бумаги. На картинке изображено как раз то, что должно получится после автотрейса. На этом примере мы и посмотрим, как работает автотрейс в иллюстраторе.

Автор: Роман aka dacascasУровень: для начинающихВерсия Adobe Illustrator: любая

Если во время работы по уроку возникнут какие-то вопросы, то вы можете обратиться за подсказкой к разделам курса "Изучи Adobe Illustrator за 30 дней!". Вы также можете взять онлайн консультацию по Adobe Illustrator через Skype, либо пройти обучение по Видео курсу Adobe Illustrator для начинающих.

Для начала, чтобы сделать автотрейс в Adobe Illustrator, нам необходимо исходное растровое изображение. Для урока я взял обычный лист бумаги, помял его хорошенько, а потом отсканировал на сканере. Исходные растровые изображения для автотрейса желательно делать хорошего качества и высокого разрешения. В противном случае результат автотрейса может не оправдать ваши ожидания.

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

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

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

Как видно на картинке выше, с параметрами High Fidelity Photo автотрейс максимально повторяет исходное изображение. Но при этом надо учитывать, что векторная иллюстрация после такого автотрейся будет максимально сложная и большая по объёму. Для примера, вот такой результат даёт автотрейс при использовании другого шаблона, 16 colors.

Здесь уже нужно исходить из ваших конечных целей, и растрового изображения, которое трейсится. Например, для черно-белого силуэта подойдёт шаблон Black and White Logo, где иллюстратор автоматически отрисует только контуры.

Если вы хотите самостоятельно выставить настройки автотрейса, то достаточно нажать на кнопочку Image Trace Panel (в старых версиях иллюстратора нужно зайти в меню Object > Live Trace > Tracing Options)

Когда вы посчитаете, что всё готово, то нужно нажать кнопочку Expand в панели информации, чтобы получить векторные формы.

И вот уже готова наша векторная помятая бумага.

Чтобы повторить эту растровую картинку, иллюстратор создал множество форм с разной заливкой. Это хорошо видно при большом зуме в режиме Outline (Ctrl+Y).

Дальше можно закрыть все выступающие части маской или обрезать их автоматически с помощью скрипта Magic Eraser

И ещё несколько слов по поводу микростоков. Дело в том, что на стоках неоднозначно относятся к результатам автотрейса. Иллюстрацию, сделанную на основе автотрейса могут как принять на продажу так и отклонить. Тут всё зависит от инспектора. Если он посчитает, что каша-малаша из форм, которая обычно получается после автотрейса, приемлема для стока, то картинку примут. Так или иначе, вы всегда должны иметь наготове исходник изображения, чтобы предъявить его, если этого потребуют во время приёмки. Исходник должен быть ваш авторский. Либо автор исходника должен подписать вам Property Release, разрешающий продавать данное изображение на стоках.

Роман aka dacascas специально для блога Записки микростокового иллюстратора

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

anna-volkova.blogspot.com

Быстрый вектор и сложные формы в Illustrator CS5 / Хабр

Бывает такое, что надо быстро отвекторить лого или другое изображение потому что НГ и надо быстро-быстро отдать в типографию штамп на тиснение, а растр не принимают. А может надо печатать огромный постер из логотипа, который вы только что сосканировали с единственной визитки. Такие изображения не всегда бывают достаточно простыми чтобы отрисовать их по оригиналу. Кроме того, у нас поджимает время – шампанское налито, студень остывает…

Конечно на помощь всегда придет (теперь уже встроенная в Иллюстратор) функция Live Trace. Как не странно, даже постоянные пользователи пакета не знают о ее существовании или не умеют (не хотят) использовать оную в полной мере (а зря). Вдобавок, часто слышу что не получается делать «каты» из сложных форм. Особенно это касается новых версий пакета, где логика объединения форм сильно переработана.

Для наглядности, примеры показаны на прозрачном фоне. Советую и вам выучить комбинацию Shift+Ctrl+D — это поможет не пропустить лишние объекты, которые потом могут сыграть злую шутку.

Допустим вы отсканировали лого и перевели его в Grayscale. Можно сделать это и в иллюстраторе, но проще и эффективнее — в фотошопе. Ведь в последнем случае, вы так же сможете поднять контраст изображения и убрать «мусор» который только помешают автоматическому трассировщику.

На рисунке 1, растровая картинка (нагло украдена из гугла – авторские права наверно за автором), которая легко превращается в вектор посредством клика по кнопке Live Trace (а затем Expand) в верхнем тулбаре. Получившееся следует разгруппировать, нажав правую кнопку мыши и выбрав соответствующий пункт выпадающего меню (рис. 2).

Теперь надо избавится от кусков белого фона. В большинстве логотипов это просто, но что если у вас лавровый венок перевязанный лентой, а внутри еще лик Платона? Каждый кусочек белого выделять муторно, долго и, никто не гарантирует что ничего не забудете.

На третьем рисунке выбран объект, который было выбрать проще всего — самый большой кусок белого. Затем в главном меню: Select/Same/Fill Color. Это выбор всех объектов с похожим стилем заливки. Меню Select кстати, почему-то несправедливо игнорируется многими пользователями AI.

Наконец у нас нет ничего лишнего и, если надо залить лого простой плашкой (для тиснения просто черным), то у нас все готово. Но что если результат надо залить градиентом или сделать векторным стилем?

На рисунке 4 показано применение градиента к сложной форме. Все вроде ничего, но залилась каждая отдельная часть объекта, а нам надо управлять градиентом на всей фигуре. Кнопка Unite в палитре Pathfinder тоже не спасает положение. Дело в том что теперь программа не делает объект по умолчанию Compound Shape. Именно поэтому следует посетить сперва в сабменю палитры Pathfinder (рис. 5) и после выбора Make Compound Shape, обязательно (иначе будет много проблем в дальнейшем) не забыть нажать кнопку Expand в этой же палитре.

Когда все получилось, нам вдруг нужно подкорректировать форму, ведь быстрый вектор может исказить те или иные линии. Можно сделать коррекцию пером по точкам, но снова же – долго и не Фен-Шуй. А нам надо быстро и правильно. Проще всего создать новую верную форму (рис. 6), положить ее сверху, и используя кнопку Minus Front палитры Pathfinder, вырезать ее из объекта. Правда, вырезав, снова получаем эффект битого градиента. Заостряю на этом внимание, потому что эффект не виден на однотонных плашках, но может здорово взорвать ваше представление о мире когда вы постараетесь снова вырезать что-то из формы.

Повторяйте снова связку объединения формы и экспанда, поправляйте мелкие недочеты, накладывайте нужные эффекты и — вуаля!

Если такой метод ускорит кому-то работу – буду только рад. Если что-то упустил – пишите, постараюсь дополнить.

habr.com