XYZ.School

XYZ.School

Привет! Мы онлайн-школа XYZ School: https://www.school-xyz.com Отзывы о нас: https://headkurs.com/schools/otzyvy-xyz-school/
На Пикабу
поставил 1 плюс и 0 минусов
отредактировал 1 пост
проголосовал за 1 редактирование
Награды:
С Днем рождения, Пикабу!
16К рейтинг 853 подписчика 1 подписка 217 постов 95 в горячем

XYZ School: что хотят получить российские геймеры на Новый год

XYZ School: что хотят получить российские геймеры на Новый год Разработка, Gamedev, 3D

Онлайн-школа в сфере геймдева XYZ School, которая входит в образовательную компанию Ultimate Education, узнала, какие подарки хотят получить российские геймеры на Новый год.

Среди подарков до 3000 рублей:

  • На первом месте аксессуары для ПК: компьютерные коврики, кабели и адаптеры, внешние жесткие диски и сумки или рюкзаки для переноски ноутбуков

  • На втором месте подарки, связанные с профессиональной деятельностью: специализированная литература, билеты на мастер-классы, подписки на ПО и сервисы

  • На третьем месте одежда и мерч

  • На четвёртом месте аксессуары, спортивный инвентарь, уходовые средства и другие товары для красоты и здоровья

  • Замыкают список художественная литература, комиксы и манга.

Среди подарков от 3000 до 10000 рублей:

  • На первом месте периферия для ПК: клавиатуры, мыши и геймпады

  • На втором месте недорогие комплектующие для ПК: оперативная память, материнские платы, кулеры и другие

  • На третьем месте копии видеоигр

  • На четвёртом месте одежда: верхняя, толстовки, обувь

  • Замыкают список сертификаты на оплату разных услуг.

Среди подарков от 10000 рублей:

  • На первом месте игровой компьютер или ноутбук

  • На втором месте бытовая и персональная техника: iPhone, планшеты, фены Dyson и другое

  • На третьем месте дорогие комплектующие для ПК: видеокарты, процессоры

  • На четвёртом месте путешествия и короткие групповые туры

  • Замыкают список товары, связанные с искусством или коллекционированием: редкие выпуски комиксов, статуэтки и другое.

Показать полностью

Опрос XYZ School. Какие игры ждут россияне

Опрос XYZ School. Какие игры ждут россияне Gamedev, Игры, Компьютерные игры, Статистика

Онлайн-школа в сфере геймдева XYZ School, которая входит в образовательную компанию Ultimate Education, узнала у российских геймеров по каким книгам и фильмам они ждут видеоигры:

  • Больше всего российские игроки ждут игрову во вселенной «Властелин колец» Джона Рональда Руэла Толкина

  • На втором месте вымышленная вселенная Стивена Кинга, которая основывается на многочисленных произведениях автора

  • Тройку лидеров замыкает вселенная Warhammer 40,000, которая базируется на одноименной настольной игре и ряда литературных произведений в жанре технофэнтези

  • На четвёртом месте находится литературный цикл «Мир Полудня» братьев Стругацких

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

  • На шестом месте идёт киновселенная Marvel — одна из самых популярных и узнаваемых в жанре фэнтези и фантастики

  • Серия романов «Песнь льда и огня» Джорджа Мартина занимает седьмое место

  • Восьмое место заняла киновселенная «Джона Уика»

  • На девятом месте вселенная мультсериала «Рик и Морти»

  • Завершает топ цикл книг «Приключения Алисы» от Кира Булычева.

Игры по популярным франшизам позволяют геймерам погрузиться в любимые миры и истории глубже, чем при чтении книги или просмотре фильма, так как игроки могут взаимодействовать с персонажами, исследовать мир и даже влиять на сюжет. Кроме того, такие игры часто предлагают новые перспективы на знакомые истории, что делает их ещё более увлекательными // Аркадий Стогний, продюсер курса Game Design в XYZ School

Справка: XYZ School — крупный игрок геймдев-образования в России и СНГ. Входит в образовательную компанию Ultimate Education. С 2019 года студентами школы стало более 180 000 человек. Сообщество школы составляет свыше 560 000 участников.

Показать полностью

Настройка ZBrush для новичков

Настройка ZBrush для новичков Гайд, Разработка, Gamedev, 3D, Zbrush, Скульптинг, 3D моделирование, Длиннопост

В ZBrush есть много параметров, с помощью которых её можно настроить под себя. Обычно они настраиваются в процессе работы в ZBrush, но есть параметры, которые стоит изменить сразу. Расскажем о них в статье.

Запуск домашней страницы

Настройка ZBrush для новичков Гайд, Разработка, Gamedev, 3D, Zbrush, Скульптинг, 3D моделирование, Длиннопост

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

Для этого нажмите на шестерёнку в самом окне и в появившемся меню выберите show if news updated:

Настройка ZBrush для новичков Гайд, Разработка, Gamedev, 3D, Zbrush, Скульптинг, 3D моделирование, Длиннопост

Автоматический запуск LightBox

Настройка ZBrush для новичков Гайд, Разработка, Gamedev, 3D, Zbrush, Скульптинг, 3D моделирование, Длиннопост

Помимо домашней страниц, при каждом запуске у вас будет открываться LightBox — окно с папками, в которых находятся кисти, материалы, меши и другие элементы программы. Вы вряд ли будете использовать его каждый раз, поэтому запуск можно отключить. Для этого вверху программы выберите Preferences → LightBox и нажмите Open At Launch, чтобы кнопка перестала гореть.

Настройка ZBrush для новичков Гайд, Разработка, Gamedev, 3D, Zbrush, Скульптинг, 3D моделирование, Длиннопост

Теперь сохраните настройки: Preferences → Config → Store Config

Чтобы открыть окно, когда оно вам понадобится, нажмите на соответствующую кнопку вверху слева:

Настройка ZBrush для новичков Гайд, Разработка, Gamedev, 3D, Zbrush, Скульптинг, 3D моделирование, Длиннопост

Открытие нескольких панелей одновременно

Настройка ZBrush для новичков Гайд, Разработка, Gamedev, 3D, Zbrush, Скульптинг, 3D моделирование, Длиннопост

По умолчанию в ZBrush можно открыть только одну панель. Если открыть ещё одну, первая закроется. Открыть несколько панелей можно 2 способами:

Зажать Shift

Когда у вас открыта одна панель и вы хотите открыть вторую, зажмите Shift при клике на вторую панель.

Изменить настройки

При этом способе несколько панелей будут открываться без дополнительных действий.

Для этого зайдите в Preferences → Interface → Palettes, отожмите кнопку One Open Subpalette и сохраните настройки.

Настройка ZBrush для новичков Гайд, Разработка, Gamedev, 3D, Zbrush, Скульптинг, 3D моделирование, Длиннопост

Настройка рабочей области

Размер и цвет рабочей области в ZBrush можно настроить, и лучше это сделать с самого начала.

Зайдите в Document в верхней части программы, выберите нужный цвет и настройте размер у показателей Width и Height. Если у вас есть градиент и вы хотите его убрать, поставьте показатель Range на 0.

Настройка ZBrush для новичков Гайд, Разработка, Gamedev, 3D, Zbrush, Скульптинг, 3D моделирование, Длиннопост

После этого нажмите кнопку Save As Startup Doc выше, чтобы сохранить новый вид рабочей области.

Настройка ZBrush для новичков Гайд, Разработка, Gamedev, 3D, Zbrush, Скульптинг, 3D моделирование, Длиннопост

Уменьшение количества автосейвов

В процессе работы ZBrush будет делать быстрые сохранения. Это удобно, но есть свои минусы.

Автосохранения весят много, а ZBrush не удаляет их. Сами сохранения могут быть частыми, и память вашего компьютера может быстро забиться.

Чтобы избежать этого, можно уменьшить количество автосохранений. Для этого зайдите в Preferences → QuickSave и в Max QuickSave Files поставьте своё число. Ниже есть кнопка Delete QuickSave files, с помощью которой автосохранения можно удалить. После внесения изменений сохраните настройки.

Настройка ZBrush для новичков Гайд, Разработка, Gamedev, 3D, Zbrush, Скульптинг, 3D моделирование, Длиннопост

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

Материал подготовлен командой XYZ Media.

Наши каналы в Telegram и на YouTube.

Показать полностью 10

Фиксированная камера в Unreal Engine 5 блюпринтами

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Сейчас фиксированная камера это дешёвое и стильное решение для инди-проектов и особенно хорроров. Но вообще-то у неё большая и интересная история — мы рассказали её в ролике «Как неудобная камера меняла игры», посмотрите, если ещё не.

А в этом гайде мы расскажем, как сделать фиксированную камеру в Unreal Engine 5 с помощью блюпринтов. И чтобы приблизить ситуацию к реальной игре, камеру сделаем с двумя условиями:

  • Камера должна переходить из третьего лица в фиксированный угол и наоборот — такое решение чаще встречается в современных АА-играх, а значит будет полезнее, если вы захотите идти в геймдев

  • Камера должна подсвечивать фокусную точку. Это поможет вам освоить ключевое преимущество фиксированной камеры — возможность делать правильные акценты на объектах.

Создаём проект

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Зайдите во вкладку Games, выберите шаблон Third Person и создайте проект

Выберите шаблон Third Person и создайте проект. Если не планируете серьёзный проект или экспериментируете, выбирайте Blueprint — в ином случае С++

Content Browser не пригодится — его можете скрыть. Чтобы поставить паузу, используйте клавишу ESC.

Создание фокусной точки

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Фокусная точка сцены — импровизированная статуя. Выделили для наглядности

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

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Хоткеи: Q — выделить; W — двигать; E — вращать; R — менять размер

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Хоткеи: Q — выделить; W — двигать; E — вращать; R — менять размер

Один из стартовых объектов на сцене похож на пьедестал. Он состоит из четырёх элементов. Выделите их, объедините командой Ctrl + G в одну группу и перенесите.

Увеличьте размер объекта, потянув стрелку нужной оси.

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

Чтобы повернуть, активируйте Rotate Tool, нажав на английскую клавишу E.

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Для самой статуи выберите меш из Content Drawer в левом нижнем углу. Путь к нужной папке: All → Content → Characters → Mannequens → Meshes. Понравившийся перенесите на нужное место.

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

Смена материала

Мы решили сменить металлический материал статуи на каменный. Если хотите, можете сделать так же.

Для этого нажмите на объект, потом вкладку Details и подменю Materials. Аналог камня — SimpleBuldge, чтобы его найти — введите название в поиск.

Мы применили каменный материал сразу к статуе, пьедесталу и подъёму.

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

По инструкции для статуи можно поменять материал любого другого объекта

Добавляем камеру и триггер

Вам нужны Camera Actor и триггер-коллизия. Первая и будет нашей фиксированной камерой, а вторая будет активировать сегмент с камерой в определённом месте.

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Экспериментируйте с расположением камеры, чтобы получить интересный и неочевидный результат

В меню Place Actors найдите Camera Actor и поставьте её в нужное место.

Нажмите правой кнопкой по камере и в выпавшем меню выберите Pilot Camera Actor. Вручную обозначьте область, которую она будет захватывать, используя кнопки W, A, S, D и мышку.

Выйдите из режима настройки камеры.

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Прямоугольная форма коллизии — самая распространённая и удобная для триггера событий

Далее во вкладке Place Actors введите в поисковик Collision и выберите Collision Box. Его размер — это угол обзора, который будет показывать фиксированная камера.

Добавляем логику переключения камеры

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Первое — откройте Level Blueprint

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Референс в блюпринт и для камеры и для коллизии делается одинаково

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Первый шаг в Level Blueprint должен выглядеть так

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

Откройте Level Blueprint. Его расположение отмечено на скриншоте:

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Нажмите ЛКМ по коллизии и ПКМ в окне блюпринта и выберите Create a Reference to (...)

Для триггер-бокса и для камеры действия идентичны.

Чтобы вызвать поисковик нод, кликните ПКМ по свободному месту в окне Level Blueprint.

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Нужные ноды легче всего добавлять через поисковик

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Второй шаг в Level Blueprint

Добавьте Event BeginPlay и Overlap для коллизии и соедините их.

Для этого нажмите ПКМ по свободному месту и найдите Event BeginPlay. Потяните мышкой от референса TriggerBox — у вас появится поиск. Найдите Assign On Actor Begin Overlap и добавьте, также с ним появится ещё нода OnActorBeginOverlap_Event. От Event BeginPlay протяните линк к Bind Event to on Actor Begin Overlap — от белой стрелке к белой стрелке.

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Всего два действия: нашли, соединили

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Третий шаг в Level Blueprint

Теперь добавьте окончание ивента.

Снова потяните мышкой от ноды TriggerBox, найдите Assign On Actor End Overlap и соедините его с Bind Event to on Actor Begin Overlap. Для этого потяните от (...) Begin Overlap линк от белой стрелке к белой стрелке.

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Создание входной анимации и новые элементы добавления скрипта

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Добавьте в скрипт персонажа. Фактически это и станет анимацией, которая будет воспроизводиться в начале.

Кликните ПКМ по пустому месту, в поисковике выберите Get Player Controller. Протяните линк от него и в меню найдите Set View Target With Blend.

OnActorBeginOverlap_Event свяжите с Set View Target With Blend от белой стрелки к белой стрелке.

Camera Actor свяжите с функцией New View Target ноды Set View (...). Потом на ней выставите Blend Time в секундах. У нас это 1,0, вы можете экспериментировать со значениями.

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

В конце гифки видно самое важное — компиляцию скрипта и сохранение, не забывайте об этих двух пунктах

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Новые элементы выхода из камеры

Теперь сделаем выход из камеры.

Скопируйте через CTRL+V три ноды: Get Player Controler, Set View Target With Blend и CameraActor и вставьте их в пустое место.

От (...) End Overlap сделайте линк к Set View Target With Blend.

Camera Actor замените на Get Player Character и отправьте его к функции New View Target на соседнюю ноду Set View (...).

Установите Blend Time чуть меньше, чем был до этого. Мы поставили 0,5 секунд.

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Весь процесс работы над блюпринтами

Фиксированная камера в Unreal Engine 5 блюпринтами Гайд, 3D, Разработка, Gamedev, Инструкция, Unreal Engine, Инди, Инди игра, Гифка, Длиннопост

Результат

Материал подготовлен командой XYZ Media.

Наши каналы в Telegram и на YouTube.

#xyz #gamedev #геймдев

Показать полностью 22

Процедурная текстура асфальта в Unreal Engine 5

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

В этом гайде рассказываем, как быстро и легко сделать процедурную текстуру в Unreal Engine 5 на примере асфальта — чтобы дороги в вашей игре выглядели интересней и разнообразней.

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

Создаём проект

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

Запустите Unreal Engine. Выберите шаблон Vehicle. Настройки проекта оставьте стандартными — Project Defaults.

Далее выбираем следующее: Target Platform — Desktop, Quality Preset — Maximum. Галочки на Starter Content и Raytracing не ставим.

Запустите проект. У вас откроется уровень из шаблона: чтобы убедиться, что всё работает, можете поездить на машине, нажав на зелёную кнопку Play сверху.

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

Так должен выглядеть проект

Загружаем карты в Unreal и добавляем в материал

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

Внизу Content Drawer (контент-бразуер)

Скачайте или сделайте материал. Для гайда мы возьмём его здесь.

Из всего материала нам нужны две карты: Road003_8K_Color и Road003_8K_Roughness.

Далее в Content Drawer откройте папку Track. Перетащите в Unreal обе карты из папки, куда их сохраняли.

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

Всё что нужно оставить от нод

Откройте материал M_Track и удалите всё, кроме основной ноды M_Track.

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

Перенос текстур из Content Drawer

Content Drawer — папка Track. Перетащите оттуда текстуры в окно с нодами. Пока ничего с ними не делайте.

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

Создание и поиск нужной ноды

Чтобы создать ноду, нажмите ПКМ на любом свободном месте, впишите её название и нажмите Enter.

Нода TextureCoordinate даёт базовые UV-координаты, с которыми вы дальше сможете работать. Нода CustomRotator позволяет поворачивать текстуры в UV-пространстве.

После подключите ноду TextureCoordinate в CustomRotator во вход UVs (V2), в Constant впишите значение 0,25 и подсоедините ко входам Rotation Center и Rotation Angle.

Выход ноды CustomRotator подключите во вход UVs к обеим нашим текстурам. Текстуру Road003_8K_Color подключите к Base Color материала M_Track.

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

Должно получиться так

Создаём шум для текстуры

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

Должно быть так — это результат всех действий в разделе

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

Для этого создайте ноды World Position, Constant, Multiply и Noise. Подключите выход XYZ ноды World Position и выход Constant ко входам ноды Multiply. В дальнейшем этой константой вы сможете регулировать размер луж на текстуре.

Выход ноды Multiply подключите ко входу Position ноды Noise. На время подключите выход ноды Noise ко входу Base Color материала M_Track, чтобы видеть все изменения и настройки.

В ноде Constant установите значение 0,01.

Нода World Position даёт вектор с координатами, который в ноде Multiply умножается на значение константы — у нас оно 0,01. Это позволяет регулировать размер шума, который создаёт нода Noise.

В ноде Noise измените параметр Function на Gradient - Computational — он отвечает за тип генерации. Ещё вы можете поиграться с настройками Output Min и Output Max — они позволяют детальнее настроить внешний вид шума. Мы установили для Output Min значение -0,384, Max не изменяли.

Также в ноде Noise уберите галочку с Turbulence и поставьте галочку на Tiling.

Создайте ноду Saturate и подключите в неё ноду Noise. Нода Saturate обрезает значения, оставляя диапазон от 0 до 1.

Далее создайте ноду Power и подключите в неё Saturate. Ноду Power подключите к Base Color материала.

В параметре ноды Power установите значение 0,5 — так вы сделаете шум контрастнее. Если напишите число больше 1, шум станет более мягким и размытым и белых областей будет меньше.

Верните текстуру Color обратно во вход Base Color.

Создаём Roughness

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

После создания Roughness должно быть так

Карта Roughness отвечает за гладкость или шероховатость текстуры. Нам она нужна для усиления эффекта пористости асфальта.

Создайте ноду LinearInterpolate и две Constant. Нода LinearInterpolate, или же Lerp, смешивает два входа, используя вход Alpha как маску. Выход ноды LinearInterpolate подключите во вход Roughness материала.

Во вход Alpha ноды Lerp подключите ноду Power, а во входы A и B две новые Constant. В Constant A ставим значение 0, в Constant B — значение 0,06.

Создайте ещё одну ноду Lerp. В её вход Alpha подключите ноду Power, во вход А подключите ноду Lerp, которая сейчас подключена во вход Roughness материала M_Track. После этого создайте новую Constant, поставьте ей значение 1 и подключите во вход В ноды Lerp, которая подключена к Roughness.

Создайте узел на линии связи ноды Power с нодами Lerp. Узлы используют для удобства и оформления — из них можно вытаскивать неограниченное количество линий. Чтобы создать узел, два раза нажмите ЛКМ на линии связи нод в том месте, где хотите создать узел.

Создаём Normal

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

После создания Normal должно быть так

Карта Normal используют для создания неровностей текстуры. В нашей случае она будет дополнять Roughness.

Чтобы её сделать, создайте ещё одну ноду Lerp. В её вход Alpha подключите ноду Power, а во вход B подключите текстуру Road003_8K_Roughness.

Создайте ноду Luminosity_And_Color — она объединяет вектор и скалярное значение. На её вход Color (V3) подключите RGB-выход текстуры Road003_8K_Roughness, а на Luminosity — выход ноды Power.

Во вход A новой ноды Lerp подключите выход ноды Luminosity_And_Color. Выход последней подключите на выход Normal материала M_Track.

Создаём Metallic и Specular

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

После создания Metallic и Specular должно быть так

В белых областях карты Metallic будут проявляться световые свойства металла, то есть блеск и отражение, а карта Specular отвечает за «загрязнённость» текстуры: в белых областях свет будет отражаться лучше, в более тёмных — хуже из-за грязи или других визуальных недостатков. Эти карты мы используем для реалистичного отражения света на асфальте.

Для входов Metallic и Specular материала M_Track создайте две Constant со значениями 0 и 1, а также две ноды Lerp.

В первую Lerp во вход А подключите значение 1, во вход В — значение 0, в Alpha подключите выход Power.

Выход из ноды Lerp подключите ко входу A следующей ноды Lerp и ко входу Specular материала M_Track.

Во входе В поставьте значение 0,5, в альфа 0,7. Выход подключите к Metallic материала.

Сглаживаем текстуру с помощью SmoothThresold

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

Ноды после подключения SmoothThresold. А ещё это финальный вид карты нод — после ничего не меняем

Сглаживание избавит текстуру от лишних зернистости и стыков, а ещё сделает внешний вид более гладким и монолитным.

Создайте ноду SmoothThreshold. Её нужно подключить между нодами Saturate и Power.

Ноду Saturate подключите во вход Lerp Value ноды SmoothThreshold. Для входа Cutoff Value создайте новую Constant со значением 1, для входа Gradient создайте новую Constant со значением 0,01.

Все Constant можно перевести в Parameter. Для этого кликните по ним ПКМ и нажмите Convert to Parameter — это позволит создать Material Instance, чтобы в нём мы могли интерактивно контролировать наш материал.

Процедурная текстура асфальта в Unreal Engine 5 Гайд, Разработка, Gamedev, 3D, Гифка, Инди, Unreal Engine, Инди игра, Текстуры, Процедурная генерация, Длиннопост

Материал подготовлен командой XYZ Media.

Наши каналы в Telegram и на YouTube.

#xyz #gamedev #геймдев

Показать полностью 14

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост

Алекс Гарсия — 3D-художник и фрилансер из Испании.

Он рассказал о процессе создания Ведьминого Котла: скульптинге, текстурировании, развёртке, зельеварении и рендеринге; а мы перевели.

Создание концепта

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
  • Соберите референсы. Отмечайте в них детали, которые привлекают ваше внимание

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

  • Когда вы определитесь с основным дизайном, удалите ненужные изображения

Для создания черепов и свечей я вдохновлялся фотографиями ритуалов Санта Муэрте в Мексике / Алекс Гарсия, 3D-художник

Если есть время и навык рисования, создайте концепт-арт по найденным референсам:

  • Нарисуйте силуэт поверх референса, отфильтруйте идеи и сотрите ненужные детали

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

Скульптинг

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

Для симметрии воспользуйтесь модификатором Mirror, а для острых углов Bevel.

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост

Процесс создания цепей:

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
  • Создайте прямоугольник

  • Используйте модификатор Wireframe, а потом увеличьте толщину и включите Boundary

  • Продублируйте прямоугольник и расположите его перпендикулярно первому

  • Добавьте модификатор Array, задайте несколько значений Count и сместите по X

  • Добавьте кривую Bezier со значением выравнивания View. Origin цепи и Bezier расположите вместе

  • Выделите кривую Bezier и сделайте её родителем для Curve Deform используя Ctrl+P. Вы можете поменять Fit Type и выбрать Bezier в разделе Curve, потом экструдировать Bezier, так цепь будет следовать форме

  • Примените модификатор Wireframe, откройте Edit Mode и создайте шейпы пик. Можно также добавить модификатор Subdivision Surface и кризы по краям

Если в вашем концепте есть органические пропсы, создайте их в ZBrush.

  • Сначала экспортируйте основную форму из Blender в ZBrush. Можете использовать плагин GoZ

  • Добавьте детали в ZBrush: трещины, повреждения и пройдитесь кистью Trim по краям

  • Добавьте аксессуары, чтобы сделать сцену ассиметричной: черепа, свечи и веточки. Также добавьте жидкость в котёл

  • Используйте кисти Orb, чтобы создать трещины на черепах и дереве

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост

Развёртка в Blender

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
  • Уменьшите количество полигонов с помощью модификатора Decimate и импортируйте модель в Blender

  • Создайте Checker Texture и примените её на все объекты, чтобы отслеживать плотность текселя и деформацию в развёртке

  • Расположите швы и сделайте развёртку, пока в Checker Texture не останется деформаций

Повторите эти шаги для каждого меша. После этого:

  • Активируйте инструмент Visualice Stretching во вкладке развёртки, чтобы проверить нет ли проблем

  • Выберите все шеллы и нажмите на Average Islands Scale, чтобы нормализировать их размер

  • Шеллы невидимых зон сделайте меньше в развёртке, чтобы сэкономить место

  • Запакуйте всё с помощью плагина UVPackmaster 3, он хорошо организует расположение шеллов

    Текстуры

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост

Создание Color ID в Marmoset Toolbag:

  • Примените модификатор Decimate на модель

  • Откройте плагины и выберите плагин ZСolor

  • Залейте Subtools выбранным цветом

  • Экспортируйте модель и используйте Substance Painter или Marmoset, чтобы получить карту Color ID

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
  • Для текстур используйте Low Opacity Base из SoMuchRoughness из плагина SoMuchMaterials для всех пропсов, чтобы придать им стилизованный вид

  • Далее можете использовать палитру, созданную на первом этапе. Примените с текстурой «Camo Woodland» и заблюрьте её, чтобы смешать тона

  • Добавьте слои для шероховатости, ржавчины, грязи и немного зеленого цвета на верхней части верёвки и черепа в центре. Это создаст иллюзию отсвечивания жидкости

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост

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

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост

Жидкость

Создайте основу с тёмными и светлыми областями:

  • Добавьте участки со свечением и небольшим размытием и радиальную карту высот, чтобы создать эффект волн

  • Увеличьте Subsurface Scattering жидкости, чтобы она выглядела вязкой

  • Для шейдера жидкости соедините три ноды текстур, чтобы создать эффект волн

  • Анимируйте параметр The Value и подключить эту текстуру в ноду Bump

  • Анимируйте свечи с помощью простого модификатора Noise во вкладке Timeline

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост
  • Для пузырьков используйте простой шейдер, в котором вы можете контролировать основной цвет Base Color и цвет бликов Fresnel Color. Пузырьки — анимированные метасферы, разбросанные с помощью системы частиц. Они сливаются и дают нужный эффект

  • Добавьте свечение по краям

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост

Освещение

Используйте HDRI — она придаст насыщенную тень от модели.

Для освещения на сцене добавьте:

  • Sun — основной источник света и теней на сцене

  • 2 голубых Area Light для освещения котла по бокам — это придаст объём модели. Третий Area Light с тёплым тоном поместите спереди модели в качестве Fill Light

  • 4 анимированных Point Light для освещения свечами

  • 2 дополнительных источника света, чтобы осветить жидкость и придать эффект свечения поверхности

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост

Если хотите добавить туман в сцену, проверьте, чтобы источники света не были видны.

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

Концепт-арт, хайполи, wireframe и финальный рендер котла в EEVEE:

Как сделать ведьмин котёл в Blender, ZBrush и EEVEE Гайд, Разработка, Gamedev, 3D, Blender, 3D моделирование, Инди игра, Гифка, Длиннопост

Портфолио Алекса Гарсии на Artstation и статьи на 80lvl.

Материал подготовлен командой XYZ Media.

Наши каналы в Telegram и на YouTube.

#xyz #gamedev #геймдев

Показать полностью 24

Как сделать процедурную стену с костями из катакомб в Substance Designer

Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост

Джо Тэйлор — художник по окружению из Rebellion.

Он рассказал, как создать процедурный материал с человеческими черепами и костями из катакомб, а мы перевели.

Поиск референсов

Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост

Для работы Джо вдохновлялся Парижскими катакомбами и материалами художников Арвина Виллапандо, Альберта Сото и Дэрка Эльшофа. Он хотел создать детализированную карту высот, на которой бы кости минимально накладывались друг на друга и достигалась бы их глубина и многослойность.

Джо было важно сохранить сломанный вид черепов из референсов и сделать рендер максимально реалистичным. Для этого он использовал Marmoset и Unreal Engine 5.

Располагаем черепа и кости

Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост
  • Возьмите готовые модели черепов или сделайте свои. Джо взял модели от Dystopia Interactive

  • Создайте развёртку в ZBrush и запеките на плейн

  • Создайте несколько костей по референсам и расположите их под разными углами для вариативности

Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост
Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост
  • Расположите черепа, используя ноду Tile Sampler и простую маску. Так, вы сможете контролировать расположение черепов на материале

  • Процедурно сломайте некоторые черепа в Substance Designer, чтобы можно было на них посмотреть изнутри

  • Разбейте и разбросайте кости в Substance Designer, чтобы неограниченно комбинировать повреждение и расположение костей

Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост

При разбрасывании костей слишком близко в Substance Designer может возникнуть проблема с наложением.

  • Наложите несколько нод Atlas Scatter с разными костями под разными углами, чтобы появилось ощущение структуры и глубины

Создаём повреждения

Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост

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

  • Наложите большие трещины на черепа, которые уже разбиты

  • Наложите более мелкие трещины с очень низкой интенсивностью на некоторые черепа

Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост

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

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

  • Используйте ноду Fractal Sum Base для шума: в ней вы сможете ввести минимальные и максимальные значения

  • Используйте ноды Ambient Occlusion и Shadow, чтобы получить разные маски из костей

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

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

Делаем цвета

Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост

Для Base Color Джо хотел создать комбинации цветов между костей так, чтобы они выглядели просто и читабельно для игрока. Он использовал ноду Color Variation художника Бена Уилсона, с помощью которой можно добиться естественных вариаций цвета, имея только несколько шумов и один цвет.

Color Variation — более точный способ создания базового цвета, поскольку добавленный цвет можно менять, а не полагаться на ноды Gradient Maps и HSL. Если у вас есть картинки референсов, вы можете взять однородные цвета с них.

  • Используйте ноды Dirt и Dust в конце. Нода Dust добавит реалистичности материалу, поместив пыль поверх черепов

  • Используйте ноду Shadows, чтобы добавить грязь под костями. Это тоже прибавит материалу реалистичности

Делаем Roughness и карту высот

Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост
  • Для создания Roughness возьмите карту высот и понизьте контрастность с помощью фильтра Histogram Range

  • Используйте эффект Colour Variation, чтобы сделать Roughness вариативнее

  • Добавьте эффект Flood Fill to Random Grayscale на материал, чтобы Roughness у каждой кости отличался

  • Используйте ноду Directional Warp на некоторых шумах, чтобы добавить дополнительные детали для Roughness. Убедитесь, что они соответствуют форме костей

Важно добавить Roughness как можно больше деталей и реалистичные вариации, которых нет на других картах:

  • Создайте несколько новых комбинаций шумов отдельно для Roughness

  • Смешайте разные получившиеся маски, например грязи и пыли, с помощью нод смешивания, чтобы улучшить карту Roughness

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

Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост

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

  • Карты нормалей и Ambient Occlusion можно создать из карты высоты. Они станут базой для вашего материала

  • Используйте шумы и маски из карт высот, нормалей и Ambient Occlusion, чтобы создать базовый цвет и шероховатость — это ускорит рабочий процесс

Как ещё можно улучшить результат

  • Используйте ноды Directional Warp и маски из карты высот, чтобы детали соответствовали формам текстуры

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

  • Располагайте большие трещины на сломанные черепа, а маленькие на целые — чтобы не было ощущения, что трещины располагали случайно

  • Помните про сторителлинг: с материалом взаимодействовали люди и на него влияло окружение

Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост
Как сделать процедурную стену с костями из катакомб в Substance Designer 3D, Гайд, Разработка, Gamedev, Инди, Процедурная генерация, Текстуры, Substance Designer, Гифка, Длиннопост

Для изучающих Substance Designer Джо рекомендует туториалы художников Джошуа Линча, Дэниэла Тайгера, Хавьера Пэрэза, Дэнни Карлона и Алекса Бэддоуса.

Больше работ Джо Тэйлора вы можете найти на ArtStation и Twitter.

Материал подготовлен командой XYZ Media.

Наши каналы в Telegram и на YouTube.

#xyz #gamedev #геймдев

Показать полностью 12

Как делают обложки для видеоигр

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

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

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

Как клише формирует универсальный язык

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

Портретная обложка

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

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

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

Кажется, что такую обложку создать легко: просто ставишь главного персонажа на первый план, даёшь ему в руки оружие и всё. Но даже в таких обложках есть свобода для творчества. Например, в обложке дебютной части Dishonored используются два главных выразительных компонента: крупный план на лице персонажа и клинок с маской.

Дизайн шаблонный, но много рассказывает об игре. Кулак с меткой Чужого обозначает фэнтези элемент, туманный фон и башня с часами отсылают к стим-панку и задают тон для места действия. Даже если потенциальный игрок не смотрел трейлеры или рекламу, поймёт многое о сеттинге: страна в духе викторианской Англии, люди живут в мире где соседствует технология и магия.

Потрепанное пальто и кровь на клинке обозначают характер главного героя. Это не образный рыцарь из сказок или лощёный агент на службе у правительства, а антигерой: непризнанный или в изгнании.

Автор обложки Чарльз Бэй в комментариях для Polygon упоминал, что получил заказ в работу после того, как Bethesda и Arkane отбраковали 60 предварительных вариантов.

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост
Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

Аналогичный стиль для бокс-артов использовали издатели Metal Gear Solid (для продажи вне Японии) и Metro 2033.

Наполнить подобный тип обложки деталями можно не только прорисовкой персонажа, но и через образное изображение аспектов геймплея.

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

В Metro 2033 композиция обложки хорошо демонстрирует мир и историю игры. Противогаз и отражения монстра в нём — маркеры пост-апокалипсиса. Доминирующие на изображении чёрный и красный цвета подчёркивают мрачное настроение игры, а звезды — связь с советской эстетикой. У красного цвета есть второй смысл: это главный цвет СССР. Жителям стран, которые не входили в список СССР, будет проще увидеть эти простые и очевидные визуальные намёки. Им не нужно смотреть вглубь, подобные маркеры очевидны.

Противостояние лицом к лицу

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

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

«Лицом к лицу» — клише, которое зародилось в обложках комиксной индустрии. Но даже на таком шаблоне художникам иногда удается элегантно передать информацию об игре.

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

Стволы вверх или вниз

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост
Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

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

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

Вид сзади

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост
Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

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

В Tom Clancy’s Division герои обложки при полном обмундировании, но не в военном, центральное место композиции занимает рюкзак. Такая фиксация указывает на присутствие в игре тематики выживания. Город, уничтоженный не до конца, помогает определить время действия — катастрофа случилась недавно и игрок станет свидетелем её начала. Причём природа катастрофы тоже читается на обложке — группа входит в зону карантина.

Аналогичный шаблон в бокс-арте Dead Rising 3 показывает другие вещи. Безумное оружие — микс из кувалды и бензопилы, куртка порванная по канонам «крутых парней» из 80-х и толпы врагов сразу говорят потенциальному покупателю: «мы тут не за серьезностью и гипер-реализмом, мы тут, чтобы делать из швабры и бензопилы оружие массового уничтожения».

Кричащий человек

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост
Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

Крик — одна из самых ярких эмоций, отражающая разные настроения в зависимости от контекста. Из-за этого художники обложек полюбили кричащего в камеру персонажа. Он может радоваться победе, как на обложках спортивных симуляторов, кричать от ужаса, как на обложках хорроров, или выкрикивать приказы в разгар боя, как на культовых бокс-артах второй Call of Duty.

Как и в предыдущих клише, через дизайн персонажа, задний фон и характеризующие элементы художник повествует о жанре, месте действия и истории игры. А яркие эмоции намекают на экшен.

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

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

Вне шаблонов

Некоторые разработчики стараются не использовать классические варианты обложек и используют уникальные или узнаваемые способы рассказать об игре.

Уникальный стиль

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост
Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

Разработчики Hotline Miami решили не прибегать к использованию шаблонов, а создать свой узнаваемый стиль.

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

Когда вы показываете насилие, стоит показать его реалистично, а не как элемент развлечения. Я думаю, что пора осмыслить насилие.

Никлас Окерблад (El Huervo), автор обложек и музыки для Hotline Miami

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

Для японского издания обложка была полностью переработана из-за законодательства страны о продаже медиа-контента. Избавившись от жестоких деталей, Окербладу удалось сохранить суть Hotline Miami в одном персонаже: неоновыми цветами, кровью, похожей на краску, и следами пуль на жакете. Мы видим насилие по безумной ухмылке, состоянию одежды и бинтам.

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост
Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост
Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

Бокс-арты с третьей серии GTA — одна из самых выразительных и узнаваемых концепций среди обложек. Этот стиль можно условно назвать «Cut and paste». У обложки нет единой композиции, она состоит из множества разрозненных кадров, передающих ключевую информацию об игре: место действия и атмосферу. Также на обложке изображены основные персонажи без ущерба общей композиции.

Это удобная тактика: вместо выстраивания заднего фона и продумывания сюжета обложки её разделили на небольшие элементы, которые вместе создают единую композицию.

Выразительный минимализм

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

Обычно на подобных обложках всего одна центральная деталь, которая передает суть игры. Например, такой подход использовали при создании обложек для серии Left 4 Dead.

Всё, что нужно знать об игре, рассказывают с помощью одной руки зомби. Четыре пальца — четыре протагониста, взаимодействие которых одна из центральных механик игры. Брутальный натурализм в изображении повреждений показывает, что крови и внутренностей будет много. Фокусируя внимание на одном элементе, повышается узнаваемость логотипа, поэтому ко второй части изменения несущественны, а стиль остался прежним.

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

К аналогичному приёму прибегали при создании обложки к Dead Space. Но рост популярности игры и повышенное внимание издателей к ней свели креативность обложек следующих частей почти на нет.

Продвижение через логотип

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

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост
Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

Например, в оформлении обложек для Quake разработчики каждый раз использовали логотип. Аналогичный подход был для диджитал иконки для Dota 2.

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

Продвижение через бренды

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

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

Например, на обложке «Skate And Destroy» 1999 года разработчики вынесли в заголовок популярный скейтборд-бренд Thrasher. Культовость бренда в определенных кругах притягивала людей, вовлеченных в субкультуру. Этот приём использовался и в маркетинге — игра выходила под эгидой Thrasher.

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

Создание уникальной обложки вместо шаблонной это риск. Он может оправдаться, и тогда обложка запомнится игрокам и поможет продвижению.

Как разрабатывают обложки

Создание обложки для Sunsent Overdrive студией ilovedust

Для своей игры Sunset Overdrive компания Insomniac захотела уникальную обложку, и обратилась к дизайнерской студии ilovedust. В техническом задании разработчики описали игру в прилагательных. Некоторые из них были абстрактными, например, «кинетично». Это усложняло задачу.

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

У них были обложки в минималистичном стиле, которые фокусировались на окружающем мире, и обложки, которые акцентировали внимание на отдельных персонажах

Маркус Смит, креативный директор Insomniac

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

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

В результате такого анализа техническое задание выглядело примерно так: «Возьмите персонажа из первого варианта, действия из второго, а фон из третьего». Подобное объединение концептов иногда сложнее разработки трёх рабочих вариантов одновременно, так как нужно выстроить композицию и сохранить органичность стиля.

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

Смит рассказал, что самым долгим процессом стала разработка центрального персонажа обложки. Компании хотелось, чтобы игрок мог ассоциировать себя с игровым миром, видеть своё отражение в хаотичном беспорядке.

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

Это стало хорошим уроком. Давайте вашим творческим партнерам излагать свою точку зрения.

Маркус Смит, креативный директор Insomniac

В итоге окончательный вид обложки во многом повторял один из ранних концептов.

Обложка для Defender's Quest

Позволить себе продуманную и уникальную обложку может не только крупная студия, но и инди-разработчики. Один из создателей Defender's Quest Джеймс Кевин в своём блоге для сайта GameDeveloper рассказал о том, как делали главный арт для цифровых изданий игры.

Сначала разработчики посмотрели обложки конкурентов, чтобы определить чего им стоит избегать, чтобы выделиться — аниме-персонажей. Они ничего не рассказали бы об игре и необычном игровом опыте.

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

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

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

  • В центре изображён главный персонаж, вокруг которого построен нарратив

  • Минималистичные и правильные детали. Солнечный свет на чёрном градиентом фоне отражает общее настроение игры: игрок борется с тьмой, которая несёт за собой пустоту. Если в квестах игрок выигрывает битвы, солнечный луч будет разрастаться и постепенно заполнять пугающую пустоту

  • Показаны важные механики игры: магия и призыв воинов

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

  1. Простота и яркость лучше обилия деталей и сложной композиции

  2. Перед написанием технического задания понять, с чем ассоциируется игра

  3. Поняв ассоциации, выделить самое важное, остальное удалить. Это и есть техзадание

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

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

Как делают обложки для видеоигр Gamedev, Гайд, Инди игра, Инди, Обложка, Дизайн, Компьютерные игры, Длиннопост

Создать хорошую обложку сложно. Есть два варианта: делать по клише, что облегчит задачу, но сделает обложку незаметнее среди остальных. Или рискнуть, создав уникальную обложку — но она должна отражать суть игры и вызывать эмоции. Главное помнить, что обложка — первое, что видит игрок, и во многом от неё зависит, увидит ли он что-то кроме.

Материал подготовлен командой XYZ Media.

Наши каналы в Telegram и на YouTube.

#xyz #gamedev #геймдев

Показать полностью 24
Отличная работа, все прочитано!