Как Создать Оружие в Стиле Фэнтези для Игр в Adobe Illustrator
Russian (Pусский) translation by Andrey Rybin (you can also view the original English article)



В этом уроке мы пройдемся по захватывающему процесс создания средневекового оружия для игр во флет стиле. Мы будем работать с разными геометрическими фигурами, используя различные функции и инструменты Adobe Illustrator для их преобразования и изменения.
К концу урока вы сможете создавать не только фэнтезийный длинный меч, тяжеленный боевой молот и топор, но используя описанные техники, вы сможете создать свой собственный набор cредневекового оружия или свой игровой ресурс в стиле фэнтези! Прогуляйтесь по Envato Market что бы вдохновится примерами средневекового оружия, и давайте начинать!
1. Создание Острого Меча
Шаг 1
Начнем с того, что создадим документ Новый Документ - New Document размером 800 x 600 px и создадим серо-голубой прямоугольник, используя Прямоугольник - Rectangle Tool (M), который будет фоном.



Шаг 2
Теперь начнем создавать наш меч используя прямоугольник размера 30 x 280 px. Используем плавную градиентную заливку для фигуры, содержащую три цвета: бледно-голубой, светло желтый и светло розовый, создавая эффект металлической поверхности. Используйте Градиент - Gradient Tool (G) что бы сделать градацию цвета по вертикали.
Использование правильных цветов является одним из самых важных условий, это делает ваши иллюстрации ярче и оживляет их! Если вы хотите использовать те же цвета, что и в этом уроке, используйте инструмент Пипетка - Eyedropper Tool (I) и удерживайте Shift что бы выбрать цвет из любой точки на вашем экране. Таким образом вы можете выбрать цвета прямо со скриншотов этого урока!
Это так же работает и для градиентов: выберите ползунок в панели Градиент - Gradient, далее нажмите инструмент Пипетка - Eyedropper Tool (I), нажмите и удерживайте кнопку Shift и выберите необходимый цвет, тем самым изменив цвет ползунка. Этот приём может значительно ускорить вашу работу. Удобно, не так ли?



Шаг 3
Зайдите во вкладку Объект>Контур>Добавить Опорные Точки (Object > Path > Add Anchor Points). Используйте инструмент Прямое Выделение - Direct Selection Tool (A) что бы выбрать новую опорную точку в середине верхней стороны прямоугольника и потяните ее вверх, чтобы создать острый наконечник меча.



Шаг 4
Зайдите во вкладку Объект>Контур>Создать Параллельный Контур ( Object > Path > Offset Path) и установите значение Смещение - Offset на -7 px, что бы сформировать меньшую внутреннюю часть меча.
Копируйте форму и Вставьте ее Сзади (Control-C > Control-B). Сдвиньте ее на несколько пикселей влево, используя стрелки клавиатуры, а переключите Режим Наложение - Blending Mode на режим Умножение - Multiply в панели Прозрачность - Transparency, чтобы сформировать мягкую тень.
Повторите тоже самое еще раз, только теперь сместите копию на несколько пикселей в право. Переключите Режим Наложения - Blending Mode на режим Осветление - Screen, что бы создать эффект освещения.



Шаг 5
Теперь объединим вершины всех трех фигур в одной точке. Используйте инструмент Лассо - Lasso Tool (Q) и выберите точки. Зайдите в панель Выравнивание - Align и проверьте, что было отмечено Выровнять по Выделенной Области - Align to Selection. Теперь нажмите на Выровнять по Горизонтали - Horizontal Align Center и Выровнять по Вертикали - Vertical Align Center, выстроить все вершины в одной точке.



Шаг 6
Теперь давайте сформируем дол (паз по середине) меча. Используйте инструмент Отрезок Линии - Line Segment Tool (\) и удерживайте клавишу Shift что бы сделать вертикальную линию проходящую через центральное ребро мяча. Примените белый цвет к Обводке (Stroke) и измените Профиль (Profile) на Width Profile 1 в панели Обводка - Stroke, чтобы сделать обводку замыкающуюся в конечных точках.
Давайте выровняем объекты. Выберите линии и основу меча под ней. Нажмите на нож еще раз, что бы сделать его Ключевым Объектом (он станет помеченным более толстой линией) Зайдите в панель Выравнивание - Align и нажмите на Выравнивание по Горизонтали - Horizontal Align Center и Выравнивание по Вертикали - Vertical Align Center что бы выровнять объекты.



Шаг 7
Теперь давайте сформируем гарду меча из прямоугольника размером 90 x 10 px. Сделайте заливку темно серо-фиолетовым градиентом и направьте градиент по диагонали, используя инструмент Градиент - Gradient Tool (G).
Копируйте объект и Вставьте Вперед (Control-C > Control-F). Сделайте форму уже и цвета градиента немного темнее.



Шаг 8
Копируйте больший прямоугольник и Вставьте Назад (Control-C > Control-B). Сместите копию немного вниз и сделайте ее темнее. Повторите тоже самое, сдвинув новую копию выше и сделав ее светлее, что придаст гарде больше трехмерности и сделает ее детальнее.



Шаг 9
Добавим еще элементов к нашей гарде. Добавьте небольшой вертикальный прямоугольник размером 7 x 23 px с левой стороны гарды. Сделайте для него градиентную заливку тех же цветов как для гарды, только чуть темнее.
Добавьте маленький кружок 13х13px, поместив его за прямоугольник (Shift-Control-[).
Выберите верхнюю левую и нижнюю левую опорные точки прямоугольников с помощью Прямое Выделение - Direct Selection Tool (A) и используйте свойство Динамические углы (Live Corners) чтобы сделать углы немного скругленными, потянув за круглые маркеры (виджет).
Сгруппируйте (Control-G) прямоугольник и кружок. Дважды щелкните Зеркальное отражение - Reflect Tool (O) и выберите Вертикальная Ось - Vertical Axis. Нажмите кнопку Copy чтобы сделать зеркальную копию и поместите ее на противоположную сторону гарды.



Шаг 10
Давайте добавим простую, элегантную рукоять для нашего меча. Создайте прямоугольник размером 30 х 85 px, используйте туже темную цветовую палитру. Создайте две копии прямоугольника над ним и сделайте их уже, формируя полоски более темных и более светлых цветов.
Копируйте декоративный элемент с вершины гарды, сделайте его больше, и присоедините его к нижней части рукояти.



Шаг 11
Теперь завершим работу над рукоятью добавив еще один элемент. Сделайте тонкий прямоугольник поперек рукояти, как показано с скриншоте ниже. Выберите его верхнюю и нижнюю левые опорные точки с помощью Прямое Выделение - Direct Selection Tool (A) и потяните их вверх, делая форму наклонной.
Используйте инструмент Зеркальное Отражение - Reflect Tool (O) что бы отразить элемент относительно Вертикальной Оси - Vertical Axis и нажмите на кнопку Копировать - Copy, чтобы создать копию. Теперь у нас есть две пересекающиеся полоски, чтобы декорировать рукоять.



Шаг 12
Теперь добавим немного световых элементов на металлическую поверхность нашего меча, чтобы придать ему более реалистичный вид. Используйте Прямоугольник - Rectangle Tool (M) чтобы сделать горизонтальные полосы. Создайте для них голубую заливку и переключите Режим Наложения - Blending Mode на режим Осветление -Screen.
Поместите полоски над лезвием меча, и поверните их на 30 градусов.
Теперь выделите лезвие меча вместе с полосками и возьмите инструмент Создание Фигур - Shape Builder Tool (Shift-M). Удерживая Alt выберите мышкой по ненужным элементам полос за пределами меча, чтобы их удалить.



Шаг 13
Ну и наконец, давайте добавим заключительный элемент к лезвию нашего меча. Сделайте приближение и используйте инструмент Перо - Pen Tool (P) чтобы добавить три опорных точки с правого края лезвия. Выберите среднюю опорную точку с помощью инструмента Прямое Выделение - Direct Selection Tool (A) и переместите ее внутрь лезвия, формируя зазубрину. Добавьте больше зазубрин лезвию, что сделает его более старым и побитым, как будто меч и правда побывал в боях.
Вот и все! Наш меч готов. Давайте двигаться дальше и сделаем тяжелый боевой молот!



2. Нарисуем Золотой Боевой Молот
Шаг 1
Давайте начнем рисовать верхнюю часть нашего молота. Используйте инструмент Прямоугольник - Rectangle Tool (M) и сделайте прямоугольник размером 60 x 95 px, залив его линейным градиентом золотистого цвета, используя мягкие оттенки желтого и оранжевого цветов. Направьте градиент по диагонали.
Добавьте еще два более узких прямоугольника, разместив их в левой части большого прямоугольника. Настройте цвета, чтобы предать вид блестящего металла: сделайте темную часть нижнее прямоугольника чуть темнее чем у прямоугольника выше. И также сделайте светло-желтую часть нижнего объекта светлее чем та же часть верхнего, что добавит контраста и придаст формам объем.
Сделайте еще две группы прямоугольников, продолжая отделывать топор.



Шаг 2
Теперь мы создадим центр верхней части топора. Сделайте прямоугольник размером 45 x 85 px, используя заливку темно-фиолетовым линейным градиентом. Копируйте (Control-C > Control-F) объект и сожмите его до размеров 20 x 85 px, делая прямоугольник уже. Сделайте цвета градиента чуть светлее.
Дублируйте новый объект и разверните его на 90 градусов, что бы получился крест. Отрегулируйте ширину объекта, что бы он вписался в большой прямоугольник. Выберите пресекающиеся полосы и Соединение - Unite их используя панель Обработка Контуров - Pathfinder, в одну целую форму.



Шаг 3
Создайте пару полосок позади креста, залив их более темным градиентом, чтобы создать легкую тень.



Шаг 4
Теперь давайте создадим блестящий драгоценный камень, что бы украсить наш молот. Используйте инструмент Многоугольник - Polygon Tool и установите Число Сторон - Side на 6, чтобы сделать шестиугольник размером 8 x 8 px. Залейте объект линейным градиентом от розовато-розового к темно-розовому. Дублируйте объект и сожмите его, что бы создать шестиугольник меньшего размера внутри первого. Сделайте цвета градиента светлее, тем самым выделяя объект.



Шаг 5
Добавьте темную полоску в левой части нашего молота. А теперь добавим рубинов! Поместите драгоценный камень на верху фигуры, удерживайте Alt-Shift, и опустите его вниз, тем самым создав копию. Нажмите Control-D несколько раз, что бы повторить наше последнее действие, что бы создать больше копий.
Украсьте также темную часть молота большими драгоценными камнями.



Шаг 6
Воспользуемся инструментом Зеркальное Отражение - Reflect Tool (O), что бы отобразить золотую часть нашего молота на противоположную сторону.
Сделайте пару коричневых полосок с помощью инструмента Прямоугольник - Rectangle Tool (M) и установите Режим Наложения Blending Mode на значение Осветление - Screen. Поместите его над золотой частью молота и используйте инструмент Создание фигур - Shape Builder Tool (Shift+M) удерживая клавишу Alt, чтобы удалить ненужные части.
Добавьте несколько зазубрин на темной части молота, что бы сделать его "бывалым в боях".



Шаг 7
Теперь добавим сияющую золотую рукоять к нашему молоту. Создайте прямоугольник размером 15 х 180 px. и заполните его вертикально направленным градиентом от желтого к оранжевому, тем самым придавая ему металлический блеск. Добавьте другой прямоугольник за ним, сделав его немного шире, и цвета градиента - немного светлее, создавая контраст между фигурами.



Шаг 8
Теперь добавим ручку к рукояти. Создайте группу темно-фиолетовых прямоугольников того же типа, как мы сделали для гарды нашего меча. Установите их размер 55 х 15 px.
Добавьте другой темный треугольник размером 40 х 125 px для ручки. Разместите три тонких вертикальных полоски над ручкой что бы придать ей текстуру. Добавьте декоративный элемент на верхнюю часть ручки. Вы можете скопировать его с нашего меча или создать новый, используя инструменты Прямоугольник - Rectangle Tool (M) и Эллипс - Ellipse Tool (L).



Шаг 9
Скопируйте перекрещивающийся элемент с рукояти меча и примените его к рукояти молота.
Теперь древко выглядит массивным и детально проработанным!
И значит, мы закончили с нашим золотым молотом войны! Теперь перейдем к топору!



3. Отрисовка Тяжелого Боевого Топора!
Шаг 1
Давайте начнем создавать голову топора с двумя лезвиями. Используйте инструмент Эллипс - Ellipse Tool (L), чтобы сделать круг размером 195 х 195 px, заполнив его плавным линейным градиентом. Я использую те же цвета как у лезвия меча.
Добавьте два меньших кружка, закрывающих верхнюю и нижнюю часть первого круга. Выравняйте все три фигуры используя Горизонтальное Выравнивание по Центру - Horizontal Center и используйте инструмент Создание Фигур - Shape Builder Tool (Shift-M), удерживая Alt, чтобы обрезать круги.



Шаг 2
Дублируйте лезвие дважды (Control-C > Control-F > Control-F) и деформируйте верхнюю копию, сделав ее уже. Выберите верхнюю фигуру и фигуру под ней и используйте функцию Минус Верхний - Minus Front панели Обработка Контуров - Pathfinder, что бы вырезать объекты, тем самым формируя лезвия топора. Переключите для оставшихся частей Режим Наложения на Умножение - Multiply Blending Mode, делая их тем самым темнее.



Шаг 3
Давайте нарисуем декоративный элемент в центре лезвия. Скомбинируйте три геометрический фигуры как показано на скриншоте ниже, развернув квадрат на 45 градусов и поместив два пересекающихся овала над ним. Выделите все три фигуры и Соедините - Unit их используя панель Обработка Контуров - Pathfinder.
Заполните созданную форму золотым линейным градиентом.



Шаг 4
Оставляя фигуру выделенной, зайдите в панель Объект>Контру>Создать Параллельный Контур (Object > Path > Offset Path) и задайте Смещение - Offset на величину 5px. Отрегулируйте цвет верхнего объекта, делая его немого ярче, тем самым придав объем.
Добавьте другую форму меньшего размера на верх и заполните ее темно-фиолетовым градиентом. Украсьте верхний элемент ярким драгоценным камнем, скопировав его с молота.



Шаг 5
Теперь давайте сделаем деревянную рукоять нашего боевого топора. Я использую лезвие меча, что сделать рукоять топора и изменю цвета градиента на темно-коричневый, имитируя деревянную поверхность.
Мы так же должны добавить массивную ручку к древку, но для этого нам не понадобится создавать новую! Давайте используем ручку созданную для молота и изменим цвета его частей с темно-фиолетового на золотой.



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



Шаг 7
Давайте добавим последнюю деталь, которая придаст законченный вид всей композиции нашего оружейного набора. Используйте инструмент Эллипс - Ellipse Tool (L), чтобы сделать эллипс размером 120 х 15 px и заполните его радиальным градиентом от голубого в центра к белому на краях. Сожмите градиент, используя инструмент Градиент - Gradient Tool (G).
Переключите Режим Наложения - Blending Mode для объекта на Умножение - Multiply, формируя легкую тень.



Поздравляю! Наш Набор Средневекового Оружия Готов!
Отличная работа! Мы только что закончили создавать наш набор фэнтезийного оружия во флет стиле. Давайте расставим его в один ряд и добавим тень позади каждого вида оружия, что бы работа выглядела законченной.
Я надеюсь вам понравился урок и вы открыли для себя полезные советы и приемы, которые позволят вам расширить этот набор, создав другие виды орудий, такие как пики, посохи, кинжалы и много чего другого. Посмотрите этот Набор Средневекового Оружия в Стиле Фэнтези, если вам нужен исходный файл, где вы так же можете увидеть другие типы оружия, которые могут быть созданы используя эту технику.
Получайте удовольствие и не стесняйтесь делиться результатами!



