Разработка иллюстраций. Создаём миксовую иллюстрацию в Фотошоп
Для многих художников, создание иллюстрации начинается с карандаша и листа бумаги. В этом уроке Andreas Preis покажет, как создать красивую миксовую иллюстрацию. Для начала, он создаст иллюстрацию в виде наброска на бумаге, а затем в Фотошопе добавит цвет и эффекты.
Финальное изображение:
Перед тем, как начать, посмотрите видео о том, как создавался эскиз:
Шаг 1
Все начинается с белого листа бумаги. Вы можете нарисовать иллюстрацию, которую использовал автор, а можете и свою.
Шаг 2
Прежде всего, создайте набросок иллюстрации карандашом.
Шаг 3
Теперь прорисуйте контуры:
Шаг 4
Это финальный шаг: начинаем рисовать чернилами. Если на иллюстрации предусмотрено много деталей, рисование может занять какое-то время.
Шаг 5
После нескольких часов рисования, иллюстрация выглядит так:
Шаг 6
Отсканируйте эскиз в оттенках серого, разрешение установите между 600-800 пикселями. Однако, обратите внимание на то, что чем больше файл, тем медленнее компьютер будет работать. После сканирования, откройте иллюстрацию в Фотошопе.
Шаг 7
Нужно усилить контраст изображения при помощи команды Кривые (Изображение - Коррекция - Кривые) (Curves) (Ctrl + M). Нужно добавить изображению как можно больше белых и черных оттенков:
Шаг 8
Теперь нужно исправить некоторые неточности на иллюстрации (к примеру, удалить лишние линии). Инвертируйте изображение (Ctrl + I) - тогда легче будет увидеть те неточности, которые нужно будет исправить.
Используя инструменты Осветлитель и Затемнитель (Burn/Dodge Tool) (O). Удалите все неточности, а затем снова инвертируйте изображение.
Шаг 9
Теперь нужно отделить изображение от белого фона. Для этого, выделите изображение (Ctrl + A) и скопируйте (Ctrl + C), затем добавьте маску . Кликните по маске, удерживая нажатой клавишу ALT. Теперь, вы сможете вставить иллюстрацию на маску (Ctrl + V).
Шаг 10
Инвертируйте слой-маску (Ctrl + I).
Перейдите с маски на слой, кликнув по его миниатюре, и залейте холст черным цветом.
Примените маску: сначала нажмите клавиши Ctrl + G , а затем Ctrl + E (этот способ позволит сначала поместить слой с изображением в группу, а затем объединить группу).
Шаг 13
При необходимости, можно скорректировать пропорции на изображении. Для этого, воспользуйтесь фильтром Пластика (Фильтр - Пластика) (Filter > Liquify).Здесь можно изменить некоторые линии и кривые.
Шаг 14
Теперь добавьте белый фоновый слой.
Шаг 15
Выделите изображение инструментом Волшебная палочка (Wand Tool) (W) и инвертируйте выделение (Ctrl + Shift + I). Сожмите выделение на 5 пикселей (Выделение - Модификация - Сжать) (Selection > Modify > Contract). Создайте новый слой (Shift + Ctrl + N) под слоем с иллюстрацией и залейте его темным цветом - это будет цвет волос.
Шаг 16
Над слоем с волосами создайте новый слой - это будет слой для лица. Для закрашивания лица используйте белый цвет и инструмент Кисть (Brush Tool) (B).
Шаг 17
Для каждой отдельной детали, которую собираетесь раскрашивать, создавайте отдельный слой. Теперь под слоем с лицом создайте новый слой для шарфа.
Шаг 18
В финале, создайте новый слой с названием «Pearls» и нарисуйте жемчуг в волосах.
Шаг 19
Теперь нужно заблокировать непрозрачность для каждого слоя, который расцвечивали. Это поможет не выйти за края каждого из слоев, когда Вы их будете затемнять.
Шаг 20
Теперь нужно раскрасить волосы в разные оттенки. Это можно сделать инструментом Кисть (Brush Tool) (В).
Шаг 21
Для создания света и тени будем использовать разные кисти. Загрузите изображение темного пятна из ресурсов урока - из него мы сделаем кисть.
Шаг 22
На этом этапе нужно снова усилить контраст изображения. Для этого, создайте кисть и изображения темного пятна (Редактирование - Определить кисть / Edit > Define Brush Preset).
В открывшемся окне задайте имя кисти:
Шаг 23
Откройте палитру Кисти (F5) и выберите только что созданную кисть:
Перейдите на вкладку Динамика формы (Shape Dynamics) и поэкспериментируйте с настройками пунктов Колебание размера (Size Jitter) и Колебание угла (Angle Jitter).
Шаг 24
Используя эту кисть, начните добавлять к каждому слою свет и тень. Начните с волос.
Шаг 25
Вы можете использовать дополнительные цвета, например те, которые использованы мной при раскрашивании шарфа.
Шаг 26
Жемчуг раскрасьте разными оттенками желтого и коричневого цветов:
Шаг 27
Работа с лицом - самая сложная часть. Нужно понять, где добавить тени и светлые области. Ориентируйтесь на скриншот:
Шаг 28
Создайте новый слой с названием «Makeup», нарисуйте на нем макияж и измените режим наложения на Умножение (Multiply).
Шаг 29
Переходим к созданию фона. Для его создания Вы можете использовать краски любого типа: акриловые, аэрозоли, также кисти. Не бойтесь экспериментировать.
Шаг 30
Фон может быть любой, включая окраску и царапины.
Шаг 31
Для этой конкретной части понадобятся цветные пятна, капли и т.д.
Это фотографии двух частей фона (для примера):
Шаг 32
Отсканируйте созданный фон (убедитесь, что краска на нем высохла). Желательно использовать довольно большое разрешение (около 900 пикселей).
Шаг 33
Перенесите отсканированный фон на основное изображение. Вы можете удалить белый фоновый слой, а все слои, относящиеся к иллюстрации поместить в отдельную группу. Для того, чтобы изменить цвет фона, добавьте к нему (Hue/Saturation).
Шаг 34
Вы можете использовать любой понравившийся цвет в качестве фона. Я выбрал бирюзовый оттенок.
Шаг 35
Добавьте второй фон и поверните его (Ctrl + T).
Шаг 36
Создайте новый слой (Shift + Ctrl + N) под вторым слоем с фоном, залейте его черным цветом и объедините этот слой с фоном со слоем, залитым черным цветом (Ctrl + E).
Шаг 37
К объединенному слою добавьте маску и загрузите выделение (Ctrl + A). Удерживая клавишу ALT, кликните по миниатюре маски. Нажмите Ctrl + V , чтобы вставить все. Цветной фон теперь работает в качестве маски.
Шаг 38
Перейдите с маски на слой, а теперь снова перейдите на маску, только уже не нажимая клавишу Alt. Таким образом, вы можете видеть, что происходит на холсте, но на маске можно также продолжать работать. Теперь примените команду Кривые (Curves) (Ctrl + M).
Шаг 39
Яркие области на втором фоне теперь станут видны:
Шаг 40
Создайте новый слой выше всех слоев и на нем добавьте тень на плечи.
Шаг 41
Теперь добавьте больше цветных пятен. Это придаст иллюстрации ощущение стиля «street art». Каждую каплю рисуйте на отдельном слое.
Шаг 42
Уменьшите непрозрачность каждого слоя с каплей приблизительно до 33%.
Шаг 43
Выделите при нажатой клавише Shift все слои с каплями и поместите их в группу (Ctrl + G). К группе с каплями добавьте маску и на ней различными кистями удалите некоторые части капель, чтобы придать им более интересный вид.
Шаг 44
Теперь я собираюсь использовать текстуру старой бумаги - ее можно найти в Интернете, а можно отсканировать.
Шаг 45
Перенесите изображение старой бумаги в наш документ и поместите над всеми слоями и группами. Добавьте к ней корректирующий слой Цветовой тон/Насыщенность (Слой - Корректирующий слой - Цветовой тон / Насыщенность) (Layer > New Adjustment Layer >Hue/Saturation)и уменьшите яркость текстуры.
Шаг 46
Для того, чтобы смешать текстуру старой бумаги с фоном, который был нарисован красками, измените режим наложения текстуры старой бумаги на Умножение (Multiply). Добавьте к слою с текстурой старой бумаги маску и удалите текстуру старой бумаги в некоторых местах изображения (например, с лица).
Шаг 47
Теперь можно использовать тот же трюк, который использовали при создании цветных капель. Добавьте маску к группе «Woman» (в ней находятся все слои, относящиеся к иллюстрации). Теперь сотрите некоторые мелкие детали с изображения разными кистями, чтобы придать текстуры.
Перевод: Слуцкая Светлана
В ходе работы над изданием ведется подготовка оригиналов иллюстраций к репродуцированию и размещению в тексте. Иллюстрации в книге штриховые и полутоновые. При создании иллюстраций я опиралась на следующие критерии:
- ·Все рисунки должны быть выполнены в пропорциях, соответствующих дизайн-проекту издания. Именно макет книги позволяет достаточно точно определить окончательные размеры иллюстраций.
- ·Объем используемого иллюстративного материала, а также способ его рационального размещения определялся совместно с автором на начальной стадии работы над книгой.
- ·Требования, которым должен удовлетворять иллюстративный материал можно свести к следующим для штриховых и полутоновых изображений:
Штриховые оригиналы:
- · рисунки должны быть выполнены на гладкой белой художественной бумаге;
- · исправления должны быть выполнены с помощью закрашивания ярким белым цветом;
- · рисунок должен быть выполнен в масштабе 1:1, 1,5:1, 2:1 по отношению к будущей иллюстрации в книге и иметь соответствующую толщину штрихов. Нельзя допускать слишком тонких штрихов, которые могут пропасть при уменьшении размера;
- · штриховка пунктиром или перекрестными штрихами должна быть однородной, с постепенным переходом, и не иметь слишком тонких или коротких штрихов в текстуре. Они могут быть потеряны при уменьшении размера.
Одноцветные полутоновые оригиналы:
- · черно-белые отпечатки на глянцевой бумаге (не тонированной, не матовой, не рельефной);
- · допустима широкая гамма тонов, но с постепенным переходом оттенков, без слишком явных контрастов;
- · возможность использования примерно полуторного размера для получения печатного размера;
- · не должны иметь сгибов, повреждений.
необходимо, чтобы рисунок был на гибкой подложке, чтобы можно было его сканировать.
Работая над иллюстрацией, художник решает самые разнообразные профессиональные проблемы: композиционной организации, декоративности, эмоциональной выразительности, стилистического соответствия духу литературного произведения, изображаемой эпохе. Книжная иллюстрация - часть книги. Художник должен учитывать вид издания, способ воспроизведения, формат, соседство со шрифтовой полосой, наличие графических украшений, чтобы найти гармоническое решение, создать художественный образ иллюстрированной книги.
Замысел художника касается главным образом изобразительной системы в иллюстрациях, задача которой - повести к наилучшему познавательному и пояснительному результату. Художник решает не только вопросы изобразительно-пластической стороны будущей серии иллюстраций, но и - это главное - вопросы образного строя, истолкования произведения и его художественных особенностей, создания композиционного целого из отдельных рисунков, которые войдя в книгу и сливаясь органически с текстом, незаметно подводили бы читателя-зрителя к тому аспекту истолкования образов, который задуман художником, чтобы наиболее полно и ярко довести мысль произведения до читателя. Такая особенность замысла оформления художественного произведения оказывает глубокое влияние на тематический план иллюстрирования. Не вдаваясь в рассмотрение тем во всем их разнообразии, общий тематический круг иллюстрирования художественного произведения можно представить в следующем перечне.
Описание размышлений и чувств действующего лица, характеристика его внешнего облика, мимики, жеста, манеры говорить, действовать. В иллюстрациях этот материал соответствует портрету, который может быть обобщенного характера, без приурочения к какому-либо месту текста, или, наоборот, с привязкой к определенному небольшому или совсем краткому текстовому куску, когда персонаж изображают в конкретном внутреннем или внешнем действии. Портреты могут быть изображены вне какой-либо среды, со средой в виде фона, иногда символического значения, и в среде, активно характеризующей изображенной лицо. Главная цель портрета - дать социальную и психологическую характеристику изображаемого персонажа.
2. Описание событий, происходящих при встречах действующих лиц, их столкновениях между собою и природой. Из этой группы тем особенно важны те, которые ярко раскрывают характер действующих лиц или являются поворотным моментом в их судьбе, а также те, которые не играя особой роли в развития сюжета, вместе с тем подчеркивают основную идею в замысле художника. В иллюстрациях этот материал выражается сюжетно-тематическими композициями. Главная цель их - раскрытие характера и состояния участников события в действии, раскрытия значения изображаемой сцены в ходе событий и для выражения основной идеи. Это наиболее распространенные иллюстрации. Как и портреты, сцены могут быть изображены вне среды, со средой в виде фона и в среде активно действующей.
Описание картин природы, городских видов, внутренних помещений, подчеркивающие и помогающие понять и почувствовать лейтмотив, тональность, общее настроение, главную мысль произведения, характер окружающей героя среды и ее действие на него, характер самого героя и его настроение. Этому материалу соответствует пейзаж или интерьер, имеющие как иллюстрация самостоятельное значение, настолько самостоятельное, что вписанные в них фигуры персонажей произведения служат только для подчеркивания принадлежности изображения к определенному месту текста или для оттенения его основной темы и замысла. Из иллюстраций на эту группу чаще всего встречается пейзаж.
Описание отдельных сооружений, зданий, предметов быта, растений, животных и т. д., которые выделяют и помогают понять ту или иную черту в характере и настроении действующего лица или имеют особое значение в развитии событий. В иллюстрациях этой группе тем соответствуют своеобразные графические натюрморты или изолированные изображения предмета, фигуры. Иллюстрации, относящиеся к этой группе, редки.
Каждую из описанных тематических групп можно подразделить на подгруппы в зависимости от того, к каким действующим лицам относится: главным, второстепенным, третьестепенным или эпизодическим. А также подразделить группу в зависимости от того, относится ли она к главной сюжетной линии или к боковой, сопровождает ли она сюжет или принадлежит к внесюжетным частям произведения.
Диапазон техник, используемых в современной книжной графике, очень широк. От тончайших акварельных работ до шелкографии, от гуаши и пастели до вырезки ножом на телячьем пергаменте, от рисунка пером до коллажа и экспериментальных цифровых форм. Различны позиции художников: от абсолютно серьезных до наивных, от ироничных до скептических. Высокое качество и удивительное разнообразие - вот то, что должно характеризовать современные работы.
Современная иллюстрация, часто создаваемая с помощью компьютерной графики
Работа над иллюстрацией требует внимания к деталям, глубокого знания предмета, о котором идет речь, и способности передавать в графической форме сложные идеи. Одни иллюстрации создаются в технике акварели, гуаши и относятся к изобразительному искусству, другие создаются с помощью компьютерных программ, третьи - это синтез традиционных средств и компьютерных технологий. Здесь переплетается работа руки и глаза с работой программ и машин.
В иллюстрациях к пьесе "Ах, жизнь наша сучья!" было взято три темы (эпизода): "Хирин с собакой", "конфликт миллионера с представителями банка и полицейскими на бал-маскараде", "отстаивание интересов мужа Мерчуткиной перед присутствующими на свадьбе". И в иллюстрациях к пьесе "Бес попутал!" также было взято три темы (эпизода): "разговор генеральши с Блистановым", "конфликт Ломова с Натальей Степановной и Чубуковым", "разбирательства Блистанова и Натальи Степановны".
Важная роль в композиции иллюстраций отводится среде, в которой происходит действие. Окружение героев имеет огромное значение для раскрытия содержания картины. Единство впечатления, цельность композиции достигается нахождением типичного русского интерьера рубежа 19-20 вв.
Иллюстрации для книги "Чехонтины" созданы в технике - черно-белой контрастной графике, черной тушью с использованием пера и рапидографа. После сканирования обработаны в программе Adobe Photoshop с помощью графического планшета.
В рамках данной дипломной работы была поставлена цель - создание макета и иллюстраций для оформления книжного издания Г. И. Юденича "Чехонтины", учитывая особенности восприятия взрослой категории людей, используя основные графические инструменты, характерные для создания книжной графики. Целью работы было не просто создать графическое оформление и иллюстрации книги, но и спроектировать целостный макет, в котором гармонично совмещались бы все элементы книги.
Была проведена комплексная работа по рассмотрению книжной иллюстрации как особого вида графического искусства, выявлены отличительные черты книжной графики от других видов изобразительного искусства.
Книжная графика с точки зрения дизайна является не только объектом изобразительного искусства (создание иллюстраций или шрифта), но и объектом созидательной деятельности, включающей техническое редактирование, набор, верстку и пр.
Для того, чтобы выявить отличительные особенности книжной графики от других видов искусства были изучены книги и издания периодической печати об искусстве книги.
Помимо правил верстки в работе рассмотрены особые требования, установленные государственными стандартами.
Была проведена комплексная работа по исследованию истории развития книжной иллюстрации, выявлению основных особенностей развития. Иллюстрация развивалась и часто отвечала существовавшим в то время тенденциям. Выявлены основные инструменты, которые используются на сегодняшний день для создания иллюстраций.
Исторический опыт свидетельствует, что состояние книжного дела всегда было определяющей доминантой развития общества на протяжении многих столетий. Само изобретение книгопечатания послужило мощным толчком для коренных перемен в жизни человечества, серьезных преобразований в сфере производительных сил и производственных отношений, в области науки, культуры, просвещения, в решении многих социальных и экономических задач.
Изучив структуру книги, можно сделать вывод, что одна из важнейших особенностей иллюстрации - зависимость ее от литературного текста. Ее цель - дополнение в наглядно-зрительных образах повествования автора. В отличие от станковой графики, которая возникает как результат непосредственного наблюдения художником окружающей его среды и изучения материалов исторической действительности. Книжная графика своим отправным объектом имеет не саму жизнь, а литературное произведение, являющееся уже отражением жизни через призму того или иного писателя или поэта. Иллюстрация не только истолковывает текст, но и обогащает его в своих зрительных образах, комментирует, развивает и дополняет мысли и образы писателя или поэта.
Книга - это хотя и сложный, но единый организм. И поэтому в ее оформлении все взаимосвязано. Нельзя решать внешнее оформление книги в отрыве от внутреннего, назначать размер шрифта независимо от формата, выбирать формат, не учитывая степень сложности иллюстраций и т. д.
На основе полученных выводов была достигнута поставленная цель - создана иллюстрированная книга по произведению Г. И. Юденича "Чехонтины". Эта книга предназначена для взрослой категории людей. Она создавалась с учетом предпочтений этой возрастной группы. Был разработан макет книги, систематизирующий расположение и характерную форму иллюстраций. Он позволил гармонично воссоединить шрифтовое оформление основного текста, заголовков с иллюстративным материалом и другими графическими составляющими книги, такими, как колонцифры. Стиль иллюстраций гиперболичный, с элементами гротеска, но приближенный к реальности. Он достаточно проработанный, детализированный. Для создания макета и иллюстраций использовались современные технологии. Особое внимание было уделено разработке обложки, для которой была создана иллюстрация, включающая в себя шрифтовую композицию. Все элементы, созданные для построения образа книги инновационны в своей уникальности.
Выполненная работа соответствует современным тенденциям в развитии книжной графики. В настоящее время происходит как бы открытие новой эпохи книжного искусства, в связи с этим особый интерес представляет изучение мировой истории книгоиздания, выявление, поиск тонкостей художественно-технического оформления древних мастеров. Основной вектор этого поиска - совершенствование современного искусства книгоиздания на основе новых технологий.
Французский художник Ксавьер Коллет объясняет, как сделать процесс рисования эффективнее на примере своей работы с темной феей в окружении леса.
Я думаю, что следующие правила рисования могут помочь вам развить свои навыки, но иногда может показаться, что они пытаются вас ограничить. Пытаясь удовлетворить широкий спектр художественных критериев, таких как: дизайн персонажей, продуманные композиции и эффективные цветовые схемы – вы можете замедлиться, но быстрая работа не всегда бывает качественной, помните об этом.
Я считаю, что лучший путь к вершине – это научиться чувствовать, делать вещи инстинктивно. С практикой, видеть вещи, которые есть в изображении, и определять те элементы, которые до сих пор нуждаются в доработке – становится второй натурой, заполняют подсознание во время работы.
С практикой это становится второй натурой – видеть вещи, которые нуждаются в доработке
Единственное, что я сделал, прежде чем начать рисовать – отстранился от всех и фотографий в голове, чтобы мое подсознание начало генерировать идеи. После этого я полностью погрузился в процесс рисования.
Первоначальные эскизы
Я не знаю, как далеко я зайду с этой иллюстрацией. Зато я знаю, что хочу, чтобы главная героиня была своего рода королевой – кем-то, кто заставит вас бояться, ощущать тревогу, глядя ей в глаза.
Так что я начну с грубого наброска, чтобы понять, какая тут будет композиция. Она гуляет в лесу и наблюдает за вами. Ну, что ж, начнем рисовать кого-то, кто заставит вас почувствовать настоящий страх и завораживающий ужас.
Пятьдесят оттенков серого
Важно учесть глубину изображения и определиться с плоскостями: фон с двумя-тремя уровнями глубины; главная плоскость вашего героя и передний план.
Я начинаю в моно – это быстрее и будет легче что-то поменять. Я выбрал палитру из множества оттенков серого и, добавив персонажу рога и длинное платье во весь рост, я начал определять её характер.
Отправная точка
У нас у всех есть свои маленькие слабости. Моя заключается в том, что я не могу устоять на ранних стадиях перед прорисовыванием лица персонажа. Часто говорят, что детализация элементов в изоляции – не очень хорошая практика, потому что в конечном итоге нельзя увидеть общую картину.
Полезный совет, не спорю, но я не могу вынести того, что на лице будет лишь немного деталей, у меня ужасно чешутся руки дополнить их. Поэтому я потратил немного времени, чтобы нарисовать лицо, корону, рога и волосы.
Иногда очень трудно определить, в каких цветах будет иллюстрация. Так что вот вам маленький совет. Возьмите старый рисунок или даже фотографию, не имеет значения. Дублируйте слой изображения и примените эффект Размытия по Гауссу к дубликату. Затем измените Параметры наложения – Режим наложения – Перекрытие. И посмотрите, вдохновляет ли вас такая цветовая гамма для вашей рабочей иллюстрации.
Поиск цветовой темы
После этого я настроил Оттенок/Насыщенность и рисую кистью уже в цветном режиме. Еще один совет – примените Авто Уровни или Авто Контраст, а затем поиграйтесь с режимами смешивания слоя. Иногда счастливые случайности будут вдохновлять вас и помогать вам преодолевать стену «некреативности».
Добавляйте детали
Я начинаю рисовать детали персонажа, начиная с головы и бюста, прежде чем перейти к разработке одежды.
Я не воплощаю какие-либо идеи по поводу платья, как я сказал, я просто пролистываю большой набор из разнообразных изображений, чтобы мой креатив наполнился свежими соками и я смог придумать необычный дизайн для платья.
Контраст
Хорошо, если в рисунке будет контраст. Более конкретно: противопоставление форм, яркости и цвета. Мой выбор для этой иллюстрации – голубоватый свет, который будет указывать на магическую силу и контроль над всеми живыми существами на этом рисунке.
Больше деталей
Теперь, когда я удовлетворен в выборе цветов, я могу завершить разработку ее костюма, добавив такие детали как украшения, и изобразить ряд таких материалов как мех, кожу, металл, блестяшки, которые все вместе сделают дизайн более интересным.
Пластика ваш друг
Помните о преимуществах цифровых графических программ. Фотошоповский фильтр Пластика является мощной редакторской опцией. Здесь, в моей иллюстрации, я использую его, чтобы подправить лицо феи, так как я решил, что оно слишком длинное.
Заканчиваем с ней
Время дорисовывать последние детали персонажа. Я добавил последние мазки на её корсете, нарисовал на ее посохе череп, добавил голубого свечения к костюму и т.д.
А теперь пришло время оживить фон лучами света и некоторым шумом. Пятнистые кисти в режиме Осветление основы подойдут мне идеально.
Создаем домашних любимцев
Я хочу, чтобы у моей темной феи были…питомцы. В нижней части композиции немного свободно, так что это идеальное место, чтобы нарисовать существ, которые оживают с помощью её тёмной магии.
У меня нет определенного представления о том, что я собираюсь делать, так что я делаю набросок тёмной кистью, а затем использую кисть в режиме Осветление основы, чтобы добавить такие детали как глаза и рты, из которых выходят пучки магии.
Зверинец монстров
Пока что я работаю инстинктивно и я вполне доволен дизайном моего существа. Теперь я могу добавить другие. Я применяю один и тот же рабочий процесс: создаю небольшой эскиз, а затем добавляю детали, используя кисть в режиме Осветление основы.
Размытые элементы
Я почти закончил эту иллюстрацию и теперь буду применять некоторые хитрости, которым я научился за годы моей работы. Я хочу, чтобы моя фея смотрела на наблюдателя – зрителя, который скрывается в лесу.
Так что я дорисую ветки мазками жесткой кисти. Нет необходимости рисовать их в деталях. Затем я добавил к ним эффект Размытия по Гауссу и всё – они готовы!
Зерно добавляет текстуру
Я люблю добавлять текстуру к моим рисункам. Иногда это просто текстура бумаги, создана с помощью Наложения слоя. Но сейчас я буду делать что-то совершенно другое.
Я добавил нейтральный серый слой (Насыщенность – 0, Яркость – 50) и применил Фильтр>Шумы>Добавить шум дважды (поставить на максимум) и Фильтр>Размытие>Размытие трижды. Затем я поставил этот слой на Перекрытие (Наложение) и кликнул на Непрозрачность слоя, поставив настройки на 5-6%
Более волшебная жизнь
Я решил, что картине нужно больше жизни. Моё решение – быстренько дорисовать бабочек на переднем плане, снова дать рисунку больше глубины.
Последняя хитрость
Последний совет. Простой способ добавить немного больше разнообразия в ваше искусство – это создать новый слой и заполнить его с помощью мягкой облачной кисти.
Установите основной цвет на светло-серый и используйте мягкую облачную кисть, чтобы создать контраст. Затем поставьте этот слой в режим Наложения.
Я следовал моим же советам и закончил рисунок!
В течении последних нескольких недель я пробовал пользоваться полутоновыми фильтрами, мне был интересен результат и на что они способны. К тому же, к большому удивлению, я обнаружил инструмент Width Tool в Illustrator CS5. Имея эти два инструмента я решил найти им применение и создать иллюстрацию в стиле Роя Лихтенштейна.
Существует достаточно много уроков, рассказывающих как создать подобное изображение, но я решил пройти этот пусть сам. Я не интересовался другими уроками, т.к. мое занятие было лишь развлечением. Поэтому, если я вдруг скопировал чью-то технику, то я действительно не знал. К тому же, было бы совсем неплохо разместить на этом сайте урок по созданию иллюстраций в подобном стиле.
Рой Лихтенштейн (Roy Fox Lichtenstein; 27 октября 1923 - 29 сентября 1997) - американский художник, представитель поп-арта. Успех художнику принесли его работы на темы комиксов и журнальной графики. Википедия
Шаг 1
Начнем с работы в Иллюстраторе.Откройте фотографию в иллюстраторе с которой вы будете работать. Эту я нашел на Shutterstock , но вы можете выбрать любую другую.
Шаг 2
Выберите Pencil Tool (N) и начните рисовать поверх фото, используя его как фон. Я начал с глаз. Для зрачков использовал Эллипс (L).
Шаг 3
Продолжайте рисовать с помощью Pencil Tool (N) и Pen Tool (P), чтобы добиться большей точности, но не увлекайтесь, т.к. здесь не требуется идеальность.
Шаг 4
С помощью Pencil Tool (N) обведите контур волос девушки:
Шаг 5
Затем, этим же инструментов добавьте немного деталей для волос:
Шаг 6
В итоге у нас получились векторные элементы для создания девушки. Вы можете добавить больше элементов по желанию, это зависит от используемой фотографии.
Шаг 7
Удалите фоновую фотографию чтобы работать только с векторными элементами:
Шаг 8
Один из моих любимых инструментов в Иллюстраторе это Width Tool (Shift+W). Он позволяет изменить ширину штриха части нашей обводки. Посмотрите, это просто фантастика!
Шаг 9
Используя тот же инструмент, измените ширину некоторых штрихов примерно как здесь:
Шаг 10
Пришло время добавить немного цвета. Я использовал бежевый для кожи, желтый для волос, белый для глаз и черный для деталей. Блузка пусть будет зеленая:
Шаг 11
Теперь перейдем в Фотошоп. Откройте в Фотошопе текстуру бумаги. текстуру я нашел там же где и девушку, на Shutterstock.
Шаг 12
Поверх текстуры бумаги, создайте слой и наложите фото девушки с параметрами наложения Multiply. В данном случае она нам пригодится для импорта вектора из Иллюстратора и для создания полутонов.
Шаг 13
Обрежьте лишние части фотографии, которые выступают за края текстуры бумаги. Лучший способ сделать это, использовать маску слоя:
Шаг 14
Создайте новый слой под слоем фотографии девушки, но внутри той же папки с нашей маской. Измените режим наложения нового слоя на Multiply и залейте его голубым цветом:
Шаг 15
Скопируйте векторное изображение в иллюстраторе и вставьте в Фотошоп. При вставке я использовал опцию «Smart Objects», т.к. это позволяет редактировать вектор в любой момент прямо в Фотошопе.Как вы наверное заметили, я установил прозрачнось нового слоя в 70%, благодаря чему можно установить необходимое расположение слоя:
Шаг 16
Как только вы найдете необходимое расположение, сделайте слой непрозрачным (100%):
Шаг 17
Измените порядок слоёв таким образом, чтобы фотография девушки находилась поверх векторного слоя. После этого обесцветьте фото (Image > Adjustments > Desaturate). У вас получится черно-белое фото, примерно как у меня.Затем перейдите к редактированию уровней (Image > Adjustments > Levels).
Измените черный канал до 60 и белый до 195.
Задайте нашему слою режим наложения на Multiply:
Шаг 18
Выберите Filter > Pixelate > Color Halftone. В открывшемся окне укажите максимальный радиус 15 и значение 199 для всех каналов.Примечание: в зависимости от размера иллюстрации пропорционально изменяйте максимальный радиус.
Шаг 19
В итоге получаем данное изображение. Иллюстрация почти готова, осталось придать ей старый, потрепаный вид. Также нам нужно почистить от полутонов зубы и глаза:
Шаг 20
Поместите текстуру бумаги поверх всех слоев нашей иллюстрации и установите режим наложения Linear Burn:
Заключение
Иллюстрация готова. Здесь уже подчищены от полутонов зубы и глаза.Таким же образом, вы можете использовать полутона для создания иллюстраций в стиле Роя Лихтенштейна, как в нашем эксперименте.
Спасибо за внимание.
Это топик является переводом
От дизайн-студии Al Power о том, почему любому бренду важно разработать свой стиль иллюстраций и как создать по ним доступный гайдлайн.
Иллюстрация - это одна из форм дизайна. Без прописанных ограничений - это всего лишь элемент искусства. Мы используем гайдлайны для того, чтобы внести в наши иллюстрации ясность.
Для чего это нужно
Ключом к идентификации вашего стиля служит определение основных ценностей и обоснование необходимости использования иллюстраций. Когда вы создадите определённую стилистическую последовательность, у вас появится общий стиль, который будет гармонировать с вашими изображениями. Это будет означать, что любой иллюстратор сможет без труда работать с вашей платформой и быть уверенным в том, что он не нарушит общего стиля.
Для создания согласованного стиля крайне необходимо обозначить ключевые показатели, такие как цветовая схема или толщина шрифта. Однако не стоит забывать о значении иллюстраций для стиля в целом и той функции, которую они выполняют на вашей платформе.
Пример стиля иллюстрации
Нельзя просто взять и нарисовать
Прежде, чем вы начнёте любой проект, важно определиться, чего вы и ваш стейкхолдер хотите достичь при помощи этого проекта.
Обычно я задаю несколько вопросов, которые помогают мне и стейкхолдеру лучше понять, что мы пытаемся получить от проекта.
Цели
- Зачем вы хотите добавить иллюстрации?
- Каким образом вы будете оценивать проект?
Существующий гид по стилю
Как правило, уже существующий гид по стилю очень помогает. Он не должен быть основан на иллюстрациях. Основные гайдлайны дизайна и всё, что отличает данный бренд на платформе, помогут вам правильно сфокусироваться на проекте.
Также необходимо понимать, как иллюстрации будут вписываться в существующую цветовую схему. То, что у компании есть своя цветовая схема, ещё не означает, что иллюстрации будут гармонично сочетаться с ней. Ведь иллюстрации должны выделяться на фоне остальных элементов интерфейса, поэтому использование брендовых цветов в изображениях может иметь негативный эффект.
Ценности
Насколько, на ваш взгляд, иллюстрации подходят для вашей платформы? Как вы думаете, будут ли они подчёркивать индивидуальность вашего бренда? Будут ли они чёткими, ясными, забавными, детализированными и так далее?
В сущности это и является основной характеристикой стиля. Даже до начала работы вы должны понимать то, какую роль иллюстрациям вы отводите в интерфейсе. Как вы будете их использовать: в роли пособия для пользователя, для заполнения пустот или просто для придания вашему проекту индивидуальности.
Мудборды
Создайте мудборды стиля, которые станут хорошим дополнением вашего продукта. Это упростит понимание иллюстратора в момент, когда стейкхолдер покажет пальцем в элемент стиля и скажет: «я хочу это». Конечно, это не станет окончательным решением, но, по крайней мере, даст дизайнеру понимание того, что от него хотят.
При создании мудборда не стоит вдаваться в детали. Мудборды больше служат для того, чтобы задать вектор направления для дальнейшей работы. Для исследования в данной области существует масса ресурсов, таких как Behance, Dribbble, Pinterest, iStock или тот же старый добрый поиск изображений в Google. Это всё делается для того, чтобы собрать как можно больше информации прежде, чем приступить к созданию первого артборда.
Не спешите сразу браться за работу. Для начала поймите, что и для чего вы делаете.
Время засучить рукава
К счастью, я создавал такие гайдлайны ранее. Когда я попал в команду Globoforce, мне поступила задача создать иллюстрированный стиль для использования на нашей white-label платформе.
Основной целью иллюстраций было внесение некой индивидуальности в области, где наш проект казался незавершённым. На самом простом уровне это звучало так: создать общий иллюстративный стиль, который внесёт последовательность для всей платформы.
Пробуйте, пробуйте и еще раз пробуйте
Никто не говорит, что этот процесс быстрый и простой. Мы исследовали множество стилей, которые в итоге нам не подошли. Вся суть заключается в исследовании идей. Ничего не делается зря, все идеи помогают формировать финальное решение. Это как перепрыгнуть через ещё одно препятствие перед финишем.
Некоторые стили работают, некоторые нет. И вы должны быть готовы отбросить заведомо хорошие, но не подходящие вашему проекту, идеи.
Язык иллюстраций
Важно, чтобы все говорили на одном языке, когда дело доходит до терминологии. Вам необходимо создать язык терминов, который будет понятен и удобен для всех. Найти термины, которые будет понятны людям. Не нужно вдаваться в детали: вам нужен просто специфический набор слов, который позволит общаться дизайнерам и стейкхолдерам.
Наши иконки
Для повышения удобства использования нашего сайта мы используем иконки. В нашем гиде по стилю прописаны правила их использования, а также выбора их размера (от 12 до 64 пикселей).
Иконографика
Наши текстовые иллюстрации
Текстовая иллюстрация помогает продемонстрировать определённую особенность или описать некоторый опыт. Такие иллюстрации радуют глаз, не занимают много места на странице и придают индивидуальность интерфейсу.
Текстовые иллюстрации
Наши иллюстрации незанятого состояния
Иллюстрации незанятого состояния используются для объяснения особенности, но никогда - в качестве основного акцента на компоненте. В большинстве случаев они нужны для отображения необходимости заполнить пустое место.
Иллюстрации незанятого состояния
Иллюстрации сцен
Иллюстрации сцен размещаются на большем пространстве и выполняют функцию объяснения пользователю фичи или сценария более детально.
Иллюстрации сцен
Наш подход
Иллюстрации могут использоваться для того, чтобы «оживить» интерфейс. Они служат для информирования пользователя и привлечения его внимания.
Придерживайтесь простоты
Так как наш продукт относится к white-label, иллюстрации будут использоваться в расчёте на самые разнообразные категории клиентов. Именно поэтому мы решили придерживаться максимально простого и пассивного стиля.
Использование персонажей
Мы воздерживаемся от использования персонажей повсеместно. Использование персонажей ставит вопросы о принадлежности к определенной расе и полу, а учитывая разнообразие наших клиентов, простота - лучше всего.
Цветовая схема
Наша цветовая схема была выбрана на основе целей бизнеса. Её ненавязчивый характер отражает наш широкий круг клиентов. Наша цель - радовать пользователей иллюстрациями, а не углубляться в понимание брендовых цветов.
Баланс цвета
В целом мы отказались от использования множества цветов в иллюстрациях. Мы попытались сделать упор на наш «призрачно-белый», используя остальные цвета в схеме исключительно для баланса.
Белый цвет у нас является основным. Попробуйте использовать его для ключевых элементов в иллюстрации
Причины
Цвет не должен выбираться субъективно. Иллюстрации должны быть пассивными и не привлекать слишком много внимания. Цвета можно использовать, но избирательно. Стиль должен быть аккуратным и неярким.
Цветовая схема для иллюстраций неактивных состояний
Для опции неактивных состояний мы использовали наш «призрачный белый» цвет и обводку. Тут используется только тень и никаких цветов. Для того, чтобы снизить визуальную нагрузку, мы использовали прозрачность в 50%.
Иллюстрация пустого состояния
Обводка
Обычно мы используем шестипиксельную обводку. При наличии мелких деталей выбираем обводку в три пикселя. Также везде используем скругления на углах. Цвет обводки всегда один - #8A8EA0.
Итак
Основная цель гайдлайна для иллюстраций - это создание последовательного, узнаваемого стиля, который отражает основные ценности вашей платформы. Для этого нужно следовать трём шагам:
- Определить, зачем вам нужны иллюстрации.
- Создать стиль, который будет работать для вас и ваших бизнес-целей.
- Задокументировать ваш стиль таким образом, чтобы вы могли запросто клонировать его для других концепций.
Полное исследование можно посмотреть .
