Как сделать спрайт персонажа в 8 направлениях для игры

Автор: Егор.

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

Зачем нужны восемь направлений

Если герой ходит по карте с видом сверху, как в классических RPG и приключенческих играх, игроку нужно видеть, куда он идёт. Четыре направления (вниз, вверх, влево, вправо) работают, пока движение идёт по клеткам. Когда персонаж может идти по диагонали, четыре ракурса начинают выглядеть топорно: герой едет боком, как по рельсам. Восемь ракурсов добавляют четыре диагонали, и движение выглядит живее.

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

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

Что должно получиться

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

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

Лист персонажа Рыцарь: восемь ракурсов, щит и меч видны то с одной стороны, то с другой
Рыцарь: при повороте щит и меч оказываются то с одной стороны, то с другой.

Способ первый: нарисовать вручную

Это путь с полным контролем. Берёте Aseprite (он платный) или бесплатные Pixelorama и LibreSprite, задаёте холст 64 на 64 и рисуете героя спереди. Потом по очереди сзади, сбоку и три четверти. Приём, который знают многие пиксельщики: рисуют пять ракурсов, а три оставшихся получают зеркалом. Вправо делают из влево, диагональ вправо-вниз из влево-вниз и так далее.

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

Этот способ хорош, когда вы умеете рисовать и вам важен каждый пиксель. Если рисунок идёт медленно, а персонажей нужно много, помогает генератор.

Способ второй: описать нейросети в Пиксельне

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

  1. Откройте «Генерировать», отдел «Персонажи», вкладка «Лист 8 направлений».
  2. Опишите героя обычными русскими словами. Хорошо работает такой набор: кто это, во что одет, что в руках, один-два характерных цвета. Например: «эльфийка-лучница в зелёном плаще с капюшоном, светлые волосы, лук за спиной». Сцену и фон описывать не нужно, нужен один персонаж.
  3. Если у вас уже есть картинка, загрузите её на вкладке «Своя картинка» (PNG или JPG до 5 МБ). Лучше, чтобы там был один персонаж на чистом фоне, в полный рост и смотрящий на нас.
  4. Выберите размер: «Герой 64» даёт восемь направлений, «Босс 128» даёт четыре.
  5. Нажмите «Сделать». Через пару минут лист будет готов.

Нейросеть рисует персонажа, потом мы приводим его к чистой пиксельной сетке и общей палитре. На выходе восемь отдельных PNG и общий спрайт-лист.

Как проверить результат

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

  1. Положите рядом вид спереди и вид сзади. Цвет волос, головной убор и плащ должны совпадать.
  2. Проверьте, в какой руке оружие в каждом ракурсе.
  3. Уменьшите лист до реального размера в игре. Силуэт на 64 пикселях должен читаться, если он тонет в деталях, герою не хватает контраста.

Нейросеть рисует с долей случайности, поэтому неровный ракурс бывает. Служба сама проверяет каждое направление и один раз перерисовывает сетку бесплатно. Если результат всё равно не нравится, сетку можно переделать за 15 кристаллов.

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

Частые ошибки

Что делать с листом дальше

Для статичного персонажа хватит PNG нужного направления: в игре вы выбираете картинку по направлению движения. Чтобы герой ходил, нужна анимация. Как её сделать и подключить в Godot, я описал в отдельной статье. Там же есть архивы для Unity, Aseprite и GameMaker.

Если вы выбираете между сервисами, сравнение с PixelLab собрано здесь.

Сколько это стоит

Лист персонажа стоит 9 кристаллов, или 13 ₽ при разовой покупке без подписки. Герой и босс стоят одинаково. Подписок на 1 000, 2 500 и 5 000 ₽ можно не покупать: любую операцию продают отдельно. Подписка на 30 дней не продлевается сама, деньги списываются только после вашего нажатия «Купить». Таблица цен лежит на странице «Цены».

Попробовать

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

Открыть мастерскую

Читайте дальше