Как сделать танграм в иллюстраторе
Обновлено: 06.07.2024
Предлагаю чертеж для построения геометрической головоломки "Танграм" размером 10х10 см., готовый макет для печати на обычном принтере и карточки-схемы с заданиями.
Квадрат необходимо разделить по линиям на 7 частей, из которых в дальнейшем можно собирать различные геометрические фигуры, животных, людей, буквы, цифры и т.д. Главными условиями при составлении фигур являются обязательное использование всех семи элементов и они не должны накладываться друг на друга.
Для удобства пользования бумажной головоломкой предварительно наклейте подложку из плотной бумаги или картона. Детали также можно изготовить из фанеры при помощи лобзика.
В прошлом уроке мы рисовали контур гитары по фотографии, а сейчас раскрасим его. Если рисовать вручную цветные пятна под контуром, это займет много времени, кроме того, в некоторых местах возможна неровность, при использовании автоматического инструмента делается это одним нажатием кнопки . В этом уроке я расскажу, как раскрасить векторное изображение в Adobe Illustrator CC вручную и автоматически.
Раскрашивание вручную
Для ручного метода подойдет инструмент "Кисть-клякса", который можно сочетать с "Карандашом", чтобы дорисовывать более мелкие детали. Иногда заливка может выходить за контуры, поэтому, периодически это нужно подправлять "Ластиком". Мой графический планшет позволяет стирать лишнее обратной стороной пера.
Ручной способ раскрашивания, требует большой внимательности и много времени. Лучше его применять лишь в крайних ситуациях, когда не срабатывает автоматический.
Раскрашивание объекта автоматическим способом
Но есть более легкий способ заливки цветом. Выделите весь рисунок и возьмите инструмент "Быстрая заливка". Этот инструмент, распознает пространство ограниченное контурами и заливает его выбранным цветом. Выберите нужный цвет и наведите мышкой, контур области подсвечивается. Если этого не происходит, значит есть слишком большой зазор между контурами, желательно перед раскраской все их замкнуть. Теперь, достаточно нажать по областям, которые вы хотите раскрасить.
Выделяйте только те области, цвет между которыми должен быть разный.
Например, струны и лады накладываются поверх рисунка и не разграничивают цвета, поэтому я снял с них выделение.
Инструмент "Быстрая заливка" действует как эффект. Поэтому, после завершения раскрашивания рисунок необходимо еще раз "Разобрать. " на объекты. А затем несколько раз разгруппировать.
Теперь можно выставить правильные цвета из палитры или взяв образец "Пипеткой" с фотографии.
Добавление теней, бликов и дополнительных деталей.
Иногда может потребоваться разграничить заливку еще на несколько цветов, например, для создания теней и бликов или дополнительных деталей. Рисуем карандашом новую фигуру, как показано на снимке ниже, выделяем обе.
Берем инструмент "Создание фигур" и удерживая клавишу ALT нажимаем по лишней области. Теперь, новый элемент можно перекрасить в другой цвет.
А вот и готовый векторный рисунок гитары, теперь его можно использовать в макете или продать на микростоке.
Подробнее о раскрашивании в видео уроке:
Пишите в комментариях, получилось ли у вас сделать векторный рисунок или возникли трудности.
Всем привет! Сегодня у нас гостевой урок от Елены, которая расскажет и покажет, как в Adobe Illustrator создавать трёхмерные изображения с помощью 3D эффекта Revolve. Смысл эффекта очень простой, он вращает объект в соответствии с заданными настройками, создавая трёхмерное изображение. И если этим объектом выступает профиль вазы, то в итоге может получиться вот такая вот замечательная композиция.
А теперь передаю слово Елене, давайте делать 3D 😊
Сегодня я хочу рассказать о возможностях 3d в векторном редакторе Adobe Illustrator. Все трехмерные программы занимают много места на компьютере и очень тяжелы в усвоении. На помощь нам, векторным иллюстраторам, придет наша любимая векторная программа. Попробуем нарисовать простой объект, вазу.
1. С помощью пера нарисуем любой контур. Нам нужен профиль будущей вазы.
2. Теперь выбираем меню Эффект > Объемное изображение > Вращение (Effect > 3D > Revolve). Нажимам ОК.
3. А теперь наслаждаемся двухмерным редактором, как он может на своем уровне превращать линию в 3d. Меняя опорные точки, добавляя, убирая и делать сглаженными, можно получить замысловатые формы, которые никогда не нарисуешь карандашом или ручкой. 😊
4. Кроме изменения оси, можно менять угол вращения тела. Заходим в окно > оформление > вращение 3d изображения. В окне можно крутить объект на разные углы и по разным осям. Очень много ракурсов можно сразу охватить.
5. Ну вот! У нас получился исходный объект, с ним и будем дальше работать. Выделяем, разбираем, разгруппировываем. Для удобства окрашиваем отдельные части разными цветами. Вот и все! У нас получился редактируемый трехмерный объект, все остальное зависит от вашего стиля рисования и фантазии. Я раскрасила части с помощью моего любимого меша.
6. Есть еще одно преимущества 3d в иллюстраторе, можно спроецировать на форму любое нарисованное изображение. Пусть это будут цветы, кидаем наше изображение в панель Cимволы. Нажимаем 3д > вращение > проецируем и выбираем на нужной грани наше изображение. Все! Разбираем и используем.
Таким образом этот шикарный инструмент помогает иллюстраторам дорисовывать невидимые грани трехмерного пространства.
Подпишитесь на нашу рассылку, чтобы не пропустить ничего нового:
Бывало ли так, что вы смотрели на что-то и думали: "Это бы здорово выглядело в векторе," - но не знали, с чего начать?
Половина дела - это умение работать с выбранной вами программой векторизации, а остальное - понимание, как разбить сцены, объекты и прочее на более мелкие элементы. Важно знать, что можно легче создать с помощью инструментов векторизации, где можно упростить рабочий процесс и улучшить общее впечатление от передачи изображения.
В этой статье я поделюсь с вами некоторыми полезными советами и секретами, как можно научиться "видеть в векторе" и суметь передавать что угодно с помощью векторных изображений.
1. Разбейте композицию на основные фигуры
Когда вы смотрите на объект, подумайте, из каких основных фигур он состоит.
Основные фигуры - это те, что представляют базовые строительные блоки в дизайне.
Когда вы разобьете изображение на эти базовые фигуры, вам будет видно, как передать каждую из них. С помощью базовых фигур вы избавите себя от излишнего волнения.
В большинстве моих статей, где я использую стоковые фотографии, первым шагом является маркировка базовых фигур, и далее я работаю по ним. Многие компоненты рабочего процесса изменились, но этот шаг остается неизменным на протяжении более 10 лет.
Векторизация коротких волос в иллюстрации с негативным пространством с помощью Adobe Illustrator
2. Не пренебрегайте основными геометрическими фигурами
Я работаю с помощью стоковых фото, хотя это не единственный подход к иллюстрации. Многим иллюстраторам нет нужды обращаться к стоковой фотографии. Они могут полностью полагаться на собственные наброски и воображение. Когда вы работаете этим способом, и у вас нет четких фигур, не пренебрегайте геометрическими фигурами. Я говорю об окружностях, прямоугольниках и треугольниках. Однако в реальности не все будет вписываться в четкие рамки такой фигуры.
Как я уже сказала вначале, умение работать в векторной программе - только половина дела, и вам придется задуматься о таких моментах, как искажение базовых фигур, чтобы получились нужные вам фигуры. Вы не только сможете создавать чистые изображения, но и сэкономите время.
Уроки Наталии Долотко - основные примеры такой техники. Большинство ее уроков полагаются на базовые геометрические фигуры и эффекты искажения для создания сложных фигур. Мой любимый - ее сцена гостиной, где по большей части в иллюстрации использована одна базовая фигура. Можете догадаться, какая?
Подсказка: Инструмент Прямоугольник (М)
3. Ищите повторяющиеся элементы
Многие объекты и сцены имеют повторяющиеся элементы. Умение их различать сэкономит вам время работы. Если вы стремитесь к реалистичному эффекту, научитесь делать копии элементов, а затем модифицируйте их (цвет, текстуру, размер, ротацию), чтобы каждый выглядел уникальным. Нет ничего хуже, когда при реалистичной передаче все элементы выглядят идентичными копиями. Однако если вы работаете с более простыми элементами, нет ничего постыдного в копировании (или использовании более умного инструмента Трансформирования).
В статье "Как создать эффект "Лего" 3D в Adobe Illustrator" легко увидеть, что эти блоки созданы из повторяющихся элементов. Однако точности в результатах можно добиться, когда все углы и размеры блоков переданы сначала по отдельности, а затем уже собраны вместе с помощью копий.
Как создать эффект "Лего" 3D в Adobe Illustrator
Другим хорошим примером повторяющихся элементов станет эта замечательная статья о создании рисованной сцены с медведями с помощью повторяющихся фигур в Illustrator. Заметьте, как группы фигур скопированы, а затем модифицирован цвет и масштаб, чтобы создать разнообразие.
Создайте рисованную сцену с медведями с помощью повторяющихся фигур в Illustrator
4. Экономьте время с помощью кистей
Подобно повторяющимся элементам работают и кисти. Если вы можете увидеть, как простой объект используется снова и снова, подумайте о том, чтобы создать из него кисть. Я люблю кисти и люблю наблюдать за тем, как креативно они используются в создании иллюстраций, а иногда даже становятся ключевым элементом иллюстрации.
Хорошим примером послужит мой урок о ночной сцене с котом. Если вы посмотрите на небо, там есть звезды. На создание каждой звезды уйдет слишком много времени, но с помощью Дискретной Кисти вы можете создать звезды разного размера и распределить их за считанные секунды. Забор также создан с помощью основных фигур и повторяющихся элементов с использованием эффекта Наложения!
Экспериментируйте с эффектами наложения и трассировки, чтобы создать простую сцену с котом в Adobe Illustrator
Кисти также помогут вам и с другими мелкими деталями в композиции. Хотя в этом уроке от Андрея Мариуса (кстати, в своих уроках он показывает много способов креативного использования кистей) все внимание уделено созданию эффекта веревки в тексте, он идеально показывает, как такой простой элемент, как веревка, - достаточно мелкий элемент дизайна, - может быстро и эффективно использоваться с помощью кисти.
Используйте узорную кисть, чтобы создать эффект веревки в Illustrator
Однако, если вы действительно хотите повысить свою креативность с помощью кистей, изучите этот урок о том, как создать кисть в виде змеи. В то время, как много труда уходит на создание одной змеи, представьте, что у вас есть клиент, которому нужна большая иллюстрация с несколькими змеями, и у каждой змеи должен быть такой же вид, как и у первой? Вам помогут узорные кисти, такой удобный инструмент.
Создайте детальную кисть в виде змеи в Adobe Illustrator
Я могу говорить о кистях без устали, но давайте посмотрим, что еще есть для создания повторяющихся узоров.
5. Как насчет текстур?
В идеальном мире все бы было плоским. Там бы не было текстур. Там все было бы проще. Но мы не живем в таком мире. У поверхностей есть текстуры. К счастью есть несколько способв передать текстуры в векторе. Давайте рассмотрим некоторые из них.
Создание текстуры из узоров
Текстуры можно создать с помощью векторных узоров. Дерево - одна из тех текстур, где можно сэкономить время, применив узор. Прочтите этот урок о создании плетеного узора, что станет прекрасным примером текстуры, превращенной в узор.
Короткий совет: как создать бесшовный узор с соломенной плетенкой в Adobe Illustrator
Создание текстуры из эффектов
В Adobe Illustrator есть целый ряд эффектов Photoshop, которые можно применить для добавления чего угодно в ваш дизайн - от грязной поверхности до зернистого эффекта. В этой статье мы посмотрим, как добавить зернистость и эффект губки, чтобы создать текстуру камня.
Как создать иллюстрацию с темным могильным камнем в Adobe Illustrator
Создание текстуры из кистей
Видите, я не шутила, я люблю кисти! Здесь есть урок, который я создала довольно давно, о том, как использовать кисти для создания узора с эффектом гранж, и, с их помощью, стиль графики.
Не все текстуры симметричны, поэтому подумайте о применении кистей, когда текстура должна быть другой в разных местах.
Короткий совет: Как создать графический стиль с текстурой бумаги в стиле гранж в Illustrator
6. Симметрические эффекты
Если у вас одна и более фигур, которые, кажется, имеют один и тот же стиль, или расположены внутри фигуры, тогда подумайте о том, чтобы создать графический стиль для передачи этой фигуры. У вас получится создать чистый и равномерный эффект для этих элементов, что сэкономит вам время.
У меня есть несколько примеров того, как используются графические стили в панели Оформления для того, чтобы передавать разные объекты. Попытаемся создать простой фрукт киви на основе одной фигуры.
Как видите, внутри закрытой равномерной фигуры фрукт киви забирает внутрь те же слои, что были снаружи. Вы узнаете, как создать стиль графики для объекта, когда можете отрезать часть фигуры, и она сможет стать частью общей фигуры.
Создать ломтик киви с помощью одной фигуры в Adobe Illustrator
Тем не менее, фигура не должна быть идеальным эллипсом. Как насчет создания авокадо на основе простой фигуры? Форма авокадо не является равносторонней фигурой. Это можно сделать, когда вы знаете, каким богатым ресурсом является ваша векторная программа. Ядро фрукта создано с помощью эффектов преобразования в фигуру и искажения.
Создайте авокадо с помощью только одной фигуры в Adobe Illustrator
Стили графики могут сделать больше для вас. Некоторые изображения можно создать, используя, по большей части, панель Оформление. Я знаю, ведь я создала эту сцену кухни, пользуясь, в основном, стилями графики в панели оформления!
Использование панели Оформление для создании иллюстрации кухни
7. Креативные решения - не обман
Когда мы думаем об "обмане" в рамках векторов, мы, возможно, думаем о таких инструментах как Трассировка Изображения. "Обманом" будет создание изображения на основе стокового фото с помощью Трассировки, а затем продажа его клиенту, правильно? Да, именно так - неэтично заниматься такими вещами.
Однако есть некоторые случаи "прямо из стоков", которые позволяют создать утонченные детали для ваших дизайнов, которые не будут считаться "обманом".
Создание фона с помощью трассировки изображения
Самое первое - использовать Трассировку для того, чтобы создать деталь фона. Она не будет являться главным фокусом изображения (здесь это кот), но дерево на фоне использовано для придания правильной атмосферы в изображении.
Создайте пушистого кота на Хэллоуин с помощью инструмента Кисть и Градиентов
Создайте фон с помощью градиента
Если фон - незначительная деталь, то почему бы не создать расфокусированный фон с помощью градиента? Этот урок покажет вам, как создать его с помощью фото с низким разрешением.
Короткий совет: Создание расфокусированного фона с помощью градиента.
8. Не усложняйте задачу
Даже с детальной передачей элементов нет необходимости иллюстрировать каждый из них для создания полной картины. Экстремальный пример приведен здесь, когда я использовала негативное пространство для заполнения графического изображения моей собаки Шелли, будучи щенком.
Мне не надо было передавать всю шерсть, потому что заполнение фона сделало это за меня. Я только добавила высветленные и затемненные участки красного, чтобы придать ей форму.
Создайте очаровательного щенка с помощью негативного пространства и инструмента Кисть
Если у вас есть творческое задание, в котором описаны конкретные требования к объекту или сцене, придерживайтесь его. Не усложняйте и не ошеломляйте зрителя.
Действительно ли вам нужно добавлять все эти волоски? Действительно ли надо создавать текстуру маленьких участков? Действительно ли нужно передавать трещину в стакане на полке, когда вы иллюстрируете большую композицию? Да, мы должны уделять внимание деталям, но не тем, которые только перегрузят дизайн и приведут к слишком "тяжелым" файлам.
9. Будьте последовательны
Основная суть этой статьи - разбить более сложные части на простые компоненты, с которыми будет легче работать. Однако есть последняя вещь, которую стоит упомянуть, и она самая важная. Это - сохранять последовательность в стиле композиции.
Хотя вы можете работать с каждым объектом по-разному, помните, что они все принадлежат одному дизайну, и им надо будет смотреться органично вместе, чтобы дизайн не был похож на смесь несвязанных предметов.
Здесь важно помнить несколько вещей:
- Когда используете линии, то рисуйте их во всем рисунке, или нигде. Следите за ключевыми элементами стиля, вроде линий в самых важных местах рисунка. Если вы собираетесь ими воспользоваться, делайте это во всем изображении.
- Пользуйтесь одной и той же палитрой. Применение новых цветов в одной области, и отсутствие в других местах изображения заставит это бросаться в глаза.
- Помните, как свет взаимодействует с иллюстрацией. Один из знаков, что у вас беспорядочная композиция - это включение объектов с разными источниками света.
Проверьте свои знания, просматривая изображения в стоках и окружающий мир
Я не шучу, когда говорю, что вижу в векторе. Когда я иду на прогулку, то визуально разбиваю новые для себя объекты на простые фигуры и думаю, как их можно передать. Итак, посмотрим на некоторые стоковые фото и применим нашу теорию на практике. Начну с простого. посмотрите на это изображение и решите, как его передать.
Помните, что может быть несколько разных подходов, и мой выбор может отличаться от выбора другого человека. Учитывая это, я бы так справилась с этой задачей:
- Базовые цвета, не усложняем: Я бы разбила это изображение на базовые фигуры для зеленой травы и голубого неба. Я бы показала небольшой холм на линии горизонта, но нет необходимости передавать каждый бугорок, достаточно показать органическую поверхность.
- Повторяющиеся элементы: Деревья можно расценивать, как повторяющиеся элементы - они небольшие в контексте иллюстрации, и нет необходимости воссоздавать каждое индивидуально. Я, скорее всего, передала бы 2-3 вида листвы, добавила небольшие мазки кисти каждой копии, чтобы придать ей уникальный вид.
- Текстуры: Трава - очевидная текстура, и всегда напоминает мне об этом замечательном уроке о том, как передавать траву. Однако я бы использовала узорную заливку, применила к ней перспективу, и затем нарисовала бы отдельные травинки на переднем плане, чтобы иллюстрация меньше походила на готовый узор.
- Стили графики: Мяч можно создать с помощью стилей графики, используя градиенты для создания глубины, а затем можно применить узор, чтобы создать эффект выемок.
- А как насчет облаков? Что же, я бы использовала комбинацию размытого фона (не в фокусе) и мягких мазков кисти из палитры Щетинных Кистей, чтобы создать мягкую текстуру.
А теперь попробуем передать другое изображение, более сложное. Конечно, можно до бесконечности говорить, как работать с ним, но в рамках этого упражнения, давайте выберем ключевые объекты и поверхности. Как бы вы подошли к работе над изображением внизу, где представлена группа людей с видом сверху?
Пора поделить его на части:
- Базовые фигуры и убираем лишнее: Базовые фигуры можно создать почти для всех объектов за исключением одной чашки кофе. Нужно ли нам 8 человек за столом, или для иллюстрации достаточно и 6? Не до конца уверены, что из себя представляет белый треугольник? Может быть, это салфетка или что-то другое? Я не знаю, что это, поэтому исключаю его из базовых фигур. По большей части эти фигуры - геометрические фигуры: ноутбук, стол, стаканы, чашки, и даже цветочный горшок.
- Текстуры и узоры: Очевидной текстурой здесь будет поверхность стола. Мне не нужно передавать всю текстуру, достаточно показать, что деревянные панели использованы на крышке стола. Возможно, некоторые эффекты зернистости можно использовать в одежде, чтобы создать впечатление текстуры. Я бы однозначно не стала детально передавать клетчатую рубашку внизу (в центре) или детали джинсовой рубашки в центре вверху, потому что это может перегрузить иллюстрацию.
- Повторяющиеся элементы: самый повторяющийся элемент здесь - это чашка кофе. Их можно передать с помощью Стилей Графики, а затем, возможно, с помощью пары фигур (друг на друге), чтобы каждая выглядела уникально. То же самое относится и к стаканам с водой.
- Кисти: Там есть нечто, похожее на базилик, по центру стола. Возможно, у меня получится создать художественную кисть в виде листка базилика и с ее помощью прорисовать листья, то есть, для начала мне понадобится только передать один лист, и потом создать кисть.
- Креативные решения: Такие элементы, как клавиатуру и газету, можно передать с помощью Трассировки, и тем самым избежать индивидуальной прорисовки этих фигур, но вы все равно сможете создать впечатление присутствия этих объектов.
Я надеюсь, что эта статья дала вам более глубокое понимание того, как можно передать в векторе что угодно. Если вы хотите проверить меня, или кого-то еще, почему бы вам не загрузить изображение в комментарии и посмотреть, какие предложения будут по поводу того, как его можно передать? А если вам сложно передать что-то, вы можете спросить в комментариях у наших членов общества. Может быть, кто-то сможет помочь. Счастливо поработать!
Читайте также: