Как сделать инфографику в фотошопе
Как создать инфографику о хаггисе в Adobe Photoshop
Т.к. подходит 25 января, годовщина со дня рождения Роберта Бернса, я думаю, что мир должен узнать о редком и достаточно вкусном блюде под названием хаггис (Haggis Haggis на латинском).
Вот фотография сырого, ощипанного хаггиса, готового к приготовлению к праздничному ужину.
Что вам понадобится
Ниже перечислено то, что было использовано при создании этого руководства.
1. Настройка документа
Для этой иллюстрации мы настроим документ для печати. Нам нужен размер печати А3, поэтому в диалоговом окне Нового документа (Файл > Новый или Control-N) мы устанавливаем:
Цветовой режим установлен на CMYK, т.к. мы будем печатать этот документ. Однако, если ваша работа не будет распечатываться, установите Цветовой режим RGB. Обратите внимание, что для этого рисунка я установила разрешение 350 точек на дюйм, т.к. я могу захотеть распечатать элементы на бумаге большего размера. Всегда лучше работать на большом масштабе, т.к. рисунок проще изменить с большого масштаба на маленький, чем наоборот.
2. Краткая информация о рисунке
Немного об истории хаггиса.
«Неуловимое и умное, это земляное сумчатое млекопитающее никогда не удавалось приручить. Они откладывают яйца в норы в горах один раз в три года, и если самкам не удаётся найти самца, известно, что они могут высиживать шарики для гольфа. Размер хаггисов где-то между окультуренным котом и морской свинкой.
Есть два вида хаггисов: левши и правши. Это касается лап хаггиса, которые короче на одной стороне. Это отличное преимущество при перемещении по холмам, т.к. их тело остаётся вертикальным (хаггисы очень склонны к укачиванию). Левши передвигаются по холмам против часовой стрелки, а правши – по часовой стрелке. Хотя теоретически возможно смешение левшей с правшами, это физически невозможно из-за ног. Это ещё одна причина, почему приручение хаггисов было признано невероятно сложным.
У Haggis Haggis есть общий предок с современным утконосом Ornithorhynchus anatinus.
Приблизительно 110 миллионов лет назад предки хаггисов и утконосов – стероподоны гальмани (также известные у палеонтологов как хаггипус) населяли центральную Пангею. Эти существа жили вместе с крокодилами, динозаврами и ранними пернатыми. Предполагается, что были некоторые мутации в потомстве предков, что привело к тому, что ранние хаггисы потеряли навык плавания и отрастили среднего размера плотную шубку, как у морских свинок.
Они мигрировали в северное полушарие, в то время как утконосы остались в Австралии, т.к. Пангея раскололась.
Хаггипусы были чрезвычайно вздорными существами, но эта черта была утеряна в современных хаггисах, которым нравится, когда люди их чешут за ухом, и которые для забавы покусывают за ноги охотников, прячущихся в болотах. Из-за их дружелюбности хаггисов относительно просто поймать. Ода хаггису впервые началась, когда охотники за этими животными почувствовали себя ужасно из-за поимки и убийств «маленьких, боязливых зверьков», которые были насколько дружелюбными, настолько и вкусными.
У хаггисов есть несколько естественных врагов, но они также страдают от москитов, которые доводят их до безумия в августе. В долине озера Лох-Несс фактически невозможно найти какие-либо следы хаггисов, т.к. есть поверие, что Лох-Несское чудовище (Несси) утащило пушистых созданий, когда они подошли к озеру попить воды.
Хаггисы любят болотные почки и чернику, и если они живут возле ферм или мелких хозяйств, то известно, что они обгрызают брюкву и картошку. У хаггисов есть клюв, как у зебровой амадины, для перекусывания толстых болотных ветвей.
Чтобы отдать дань хаггисам, на ужине Бернса подают еду, которую хаггисы любят сами (по крайней мере, ту, которую люди могут есть – брюкву и картошку). Ко вкусу хаггиса нужно привыкнуть, и он подчёркивается стопкой виски.
На протяжении веков шкуру хаггисов использовали для создания гобеленов, и иногда нитки используются в шотландских пледах. Фиолетовая шерсть – самая ценная. Ношение кожаной сумки с мехом наружу символизирует великую жертву, которую принесло это позднеянварское угощение».
Нам нужно оформить всю эту потрясающую информацию в простую для восприятия графику, поэтому выделим некоторые ключевые моменты:
У нас есть вся информация для начала планирования нашей инфографики! Т.к. в этом руководстве рассказывается об инфографике, я не буду слишком вдаваться в процесс иллюстрации. Дальше идёт интересная часть – отрисовка элементов!
3. Отрисовка элементов
Для этого руководства я буду использовать базовую Твёрдую кисть Photoshop с чувствительностью к давлению. Панель Кисти можно быстро открыть, нажав F5 на клавиатуре.
Шаг 1: Семейное древо
На Новом слое (Control-Shift-N) нарисуйте двух членов фамильного древа – стероподона гальмани (хаггипуса) и утконоса. Пусть все элементы будут на разных слоях, т.к. их будет проще передвигать. ч Если вы случайно нарисовали их на одном слое, что иногда случается, вы можете применить Лассо (L) к нужной области. Затем Вырезать (С), создать Новый слой (Control-Shift-N) и нажать Control-Shift-V, чтобы вставить объект на нужное место.
Шаг 2: Внешний вид и анатомия
Шаг 3: Хищники
Большинство существ в дикой природе – хищники, поэтому нам нужно показать врагов хаггисов – неизвестных шотландских москитов и, конечно же, Несси! Это чисто художественное изображение Несси, т.к. никто не знает, как она выглядит на самом деле (она изворотливая!). Шотландские москиты очень похожи на обычных москитов или других маленьких жалящих мух. Имейте в виду, что они не соответствуют масштабам Несси на иллюстрации. Москиты больше похожи на летающие точки, поэтому нарисуем их так. Помните о том, чтобы рисовать объекты на разных слоях!
Шаг 4: Относительный размер
Насколько хаггисы большие? Лучше предложить читателю представить размер хаггисов, сравнив их с более известными животными. В данном случае я взяла домашнюю кошку и морскую свинку, т.к. шотландские исследователи, которые были в Андах, подумали, что они были хаггисами. Но это не так, т.к. морские свинки лучше приручаются.
Как потомок Великого охотника на хаггисов, я знаю, что хаггисы по размерам не больше домашней кошки. В целях демонстрации у нас есть кошка, морская свинка и фигура, символизирующая хаггиса. Я ещё не решила, какую форму придам своему зверьку!
Шаг 5: Яд
Шотландское печенье ядовито для хаггисов, т.к. сочетание муки и масла, а также рассыпчатая структура еды, вызывают ужасный метеоризм. Хаггисы не могут выпускать газы и разрываются.
Шотландское печение бывает разных размеров, поэтому я решила упростить его, нарисовав одну палочку и всемирно узнаваемый символ яда – череп со скрещёнными костями. Убедитесь в том, что зритель сможет понять, что изображено на вашей инфографике.
Шаг 6: Еда
Хаггисы любят чернику, но её сезон короткий, а хаггисы прожорливы. Основную часть их диеты составляет вереск, и при возможности хаггисы с удовольствием пируют брюквой и картошкой. Немного скучно изображать отдельные элементы еды в линию или так, как показано ниже, поэтому на графике я распределю еду по кучкам, которые понравятся любому хаггису!
4. Размещаем элементы для инфографики
Теперь, когда у нас есть основные элементы, мы можем собрать их в инфографику. Т.к. все элементы собраны у нас в одном документе, легко выбрать нужные слои, и при помощи Инструмента «Перемещение» разместить элементы. Элементы можно преобразовать, нажав на Control-T для Трансформирования либо перейдя в Изображение > Вращение изображения и использовав параметры.
К счастью для меня, я имела возможность изучить хаггиса в дикой природе и у меня есть несколько готовых зарисовок.
В моей первой композиции отсутствует некоторая ключевая информация относительно типов лап хаггисов. Хищников также нужно было выделить, поэтому я их увеличила в основании плаката. Т.к. каждый элемент находится на отдельном слое, их легко переместить Инструментом «Перемещение» (V) и изменить размер, нажав Control-Т для Трансформирования.
5. Цветовая палитра
Когда речь идёт об инфографике, нужно ограничить выбор цветов. Здесь я выбрала фиолетовый, зелёный и оранжевый. Чтобы иллюстрация не выглядела плоской, я добавила несколько вариаций.
Фиолетовый: вересковые цветы, шерсть хаггиса, черника, картошка, горы, брюква
Зелёный: листва, Несси, клюв хаггиса
Оранжевый: печенье, кошка, морская свинка, шерсть на щеках хаггиса
Вот сейчас будет интересная часть: раскрашивание элементов!
6. Раскрашиваем еду
Шаг 1
На отдельных слоях нанесите цвета еды. Быстро создайте Новый слой, нажав Control-Shift-N.
Шаг 2
Взяв светло-фиолетовый на палитре, раскрасьте светлые области на картошке. Затем, в цветовой палитре Photoshop добавьте немного больше белого к светло-фиолетовому и раскрасьте основу брюквы. Для вершков брюквы возьмите самый тёмный фиолетовый в палитре. Добавьте светлые области на листьях и корешке брюкв. Пусть детали будут простыми, чтобы зритель не отвлекался.
Шаг 3
На слое с черникой нанесите светло-синий, чтобы ягоды выглядели круглыми.
Шаг 4
В палитре Photoshop выберите синий и белый для блика, а затем нанесите их.
Шаг 5
На Новом слое (Control-Shift-N) поверх вересковых стеблей вручную нанесите цветы, настроив кисть на 60% плавности и непрозрачности. Изменение в давлении создаст различие в фиолетовых оттенках для придания реализма.
Шаг 6
Продолжайте проставлять цветы над стеблями. Это требует времени, но мне кажется, что таким образом создаётся более приятный эффект, чем использование дискретной кисти –плюс к тому, у вас есть больше контроля.
Шаг 7
На Новом слое (Control-Shift-N), за вересковыми цветами, продолжайте проставление точек самым тёмным зелёным для создания листьев.
Шаг 8
Чтобы вереск выглядел более пышным, Скопируйте (С) и Вставьте (V) слой с цветами. Затем, нажав Control-T для трансформирования снизьте масштаб цветов приблизительно на 33%.
Шаг 9
Снизьте непрозрачность слоя с уменьшенными цветами, сдвинув Непрозрачность слоя на панели Слоёв до 50%.
Вот наш законченный элемент с едой хаггиса.
7. Раскрашиваем морскую свинку и кошку
Шаг 1
Возьмите светло-оранжевый и раскрасьте базовые фигуры животных. Оранжевый будет хорошо контрастировать с фиолетовым хаггисом, который будет между ними.
Шаг 2
Добавьте тень и более тёмные области с тёмно-оранжевым.
Шаг 3
Создайте коричневый/оранжевый на цветовой палитре Photoshop и быстро нарисуйте несколько определяющих линий для полосок, лап и лица. Пусть линии будут свободными! У нас готова иллюстрация кошки!
Шаг 4
Нанесите несколько отметин на морской свинке и тени под ухом.
Шаг 5
Взяв такой же коричневый цвет для кота, нарисуйте лапы, край ушей, глаз, рот и несколько пятен.
Шаг 6
При помощи инструмента «Размазывание» смягчите края зверька. Этот инструмент можно найти на панели инструментов – он выглядит как палец.
Шаг 7
Нарисуйте несколько случайных пучков шерсти и вибриссы. У нас готова иллюстрация морской свинки!
8. Раскрашиваем членов семейного древа
Шаг 1
Наносим базовые цвета.
Шаг 2
Шаг 3
Чтобы быстро изменить цвет хаггипуса, я создаю Новый слой (Control-Shift-N), который я устанавливаю на Цвет. Кликаю правой кнопкой мыши на этом слое и устанавливаю его на Обтравочную маску. Затем я наношу тёмно-фиолетовый цвет на всего хаггипуса. Далее я объединяю слой Цвета с зелёной основой и начинаю раскрашивать шерсть светлым и тёмным фиолетовым цветом. На утконосе я обозначаю шерсть, растушевав более светлые и тёмные детали с ногами и хвостом.
9. Раскрашиваем Несси и москитов
Шаг 1
Нанесите базовые цвета.
Шаг 2
Нанесите светлые области и начните растушёвывать их точечными движениями при помощи кисти, нажимая Alt для выбора цвета.
Шаг 3
Продолжайте растушёвывать зелёный цвет по всему рисунку и добавлять ярко-зелёный цвет. На спинных плавниках нарисуйте центральную линию тёмно-зелёным цветом и добавьте несколько точек для обозначения текстуры.
Шаг 4
Возьмите синий и добавьте волны для придания иллюзии, что Несси находится в воде. Возьмите почти чёрный цвет и нарисуйте выражение лица.
Шаг 5
Добавьте светло-фиолетовый блик на москитах и нарисуйте крылья и лапки чёрным цветом. Хищники готовы!
10. Раскрашиваем хаггиса
Шаг 1
Нанесите базовые цвета. У хаггисов тёмно-фиолетовые лапы (чтобы спрятать грязь), светло-фиолетовое тело, зелёный нос, оранжевые щёки и фиолетовое перо для спаривания, которое называется «дамским пером», если это самец. Оно привлекает самок!
Шаг 2
Используйте тёмно-фиолетовый, чтобы нарисовать тени под подбородком, вокруг лап и живота. Смешайте очень бледный фиолетовый, чтобы нанести немного густой шерсти там, где падает свет. Выделите щёки, сделав оранжевый цвет ярче при помощи жёлтого, и нанесите его также на «дамское перо».
Вот наш зверёк. Он милый, правда?
11. Иллюстрация гор
Вот простая иллюстрация, чтобы показать, как левши и правши передвигаются по склонам. Растушуйте фиолетовые оттенки на горе похожим образом и выделите снежный пик. Кругляши-хаггисы – всего лишь простая иллюстрация тёмно-синего цвета. Они нужны только для того, чтобы показать их ноги (хаха), поэтому им не нужно много деталей!
12. Заголовки и аннотация
Я решила сделать заголовок достаточно простым. При помощи Инструмента «Горизонтальный текст» (Т) я выбрала шрифт Futura Handwritten тёмно-фиолетового цвета, и затем напечатала «Хаггис: простое руководство».
Шаг 1
Чтобы централизировать текст Инструментом «Горизонтальный текст» (Т), кликните на центральном тексте на панели инструментов и измените «Хаггис:» на 98 точек. Затем нажмите Enter, чтобы сдвинуть «Простое руководство» на следующую линию. Затем выделите эти слова Инструментом «Горизонтальный текст» (Т) и измените размер на 50 точек. В данном случае горизонтальное Расстояние между словами установлено на 70 точек. В зависимости от шрифта и вкуса, можно внести поправки, изменив размер точек.
Шаг 2
Повторите этот процесс для латинских названий, фактов и ярлыков. Сделайте заголовки большими и тёмно-синими для привлечения внимания.
Шаг 3
Иллюстрации гор нужна аннотация, поэтому я нарисовала несколько закруглённых стрелок, чтобы показать направление движения.
13. Финальные штрихи
Шаг 1
Для улучшения композиции я передвинула элементы, чтобы они не стояли слишком близко друг к другу. Я сгруппировала элементы (текст и иллюстрации) в отдельные папки, чтобы их можно было легко двигать по холсту Инструментом «Перемещение» (V).
Шаг 2
Чтобы создать фокус на рисунке, я добавила оранжевые стрелки, чтобы связать текст с иллюстрациями или привлечь внимание к определённым зонам.
Шаг 3
Дважды кликните на слое со стрелками, чтобы появились Стили слоя.
В Стилях слоя я установила Падающую тень на Умножение с синим цветом тени. Таким образом, стрелки будут выделять на белом фоне.
Если хотите использовать такие же настройки на другом слое, кликните правой кнопкой на слое со Стилями слоя и выберите «Копировать стиль слоя». Затем на нужном слое снова кликните правой кнопкой и выберите «Вставить стиль слоя». Если, например, стрелки расположены на разных слоях, вам не нужно будет запоминать все параметры и вручную вводить их на каждом слое.
Готовая инфографика!
Вы заметите, что на финальной версии я не изобразила шерсть и типы тела для того, чтобы разделить инфографику. Самое важное то, что на одном листе не слишком много информации. Хороший микс – это приблизительно 2/3 иллюстрации и 1/3 текста.
Заключение
Надеюсь, вам понравилось это руководство по созданию инфографики о хаггисе, и вы узнали для себя что-то новое! В следующий раз вы с аппетитом съедите ужин Бернса! Sláinte!