Распродажа на Хэллоуин: −40% Pixor стоит $19.99 $11.99 до 4 ноября на itch.io →

Спрайты машин и космических кораблей под любым углом

Машина в гонках с видом сверху или корабль в шутере в духе Asteroids поворачивается на любой курс. Поворот одного спрайта в движке ломает его пиксели; рисовать 32 углов вручную — дни работы. Из 3D-модели каждый угол — это рендер.

Космический корабль из бесплатной библиотеки, отрендеренный в Pixor
Гоночная машина из бесплатной библиотеки
Пиксель-арт-космический корабль сверху, поворачивающийся через 32 курсов
32 курсов, вид сверху

Почему транспорту нужно так много углов

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

Игры решают это одним из трёх способов:

  1. Поворот одного спрайта в движке. Дёшево, но поворот пиксель-арта передискретизирует его. При любом угле, кроме 90 градусов, линии ломаются, отдельные пиксели удваиваются или пропадают, а при включённом сглаживании края размываются. Это перестаёт выглядеть как пиксель-арт.
  2. Рисование каждого угла вручную. Выглядит правильно, но это много работы: 32 углов машины, плюс её повреждённая версия, плюс каждый цвет команды. Каждое изменение дизайна означает перерисовку всех.
  3. Рендер каждого угла из 3D-модели. Так делали гонки и шутеры 1990-х с пре-рендеренными спрайтами, и так делает Pixor с кольцом камер.

Сколько углов

Углы Шаг Подходит для
8 45° Танки и юниты, которые медленно поворачивают, стратегии
16 22.5° Большинство гонок и шутеров с видом сверху, турели
32 11.25° Плавное управление, свободно вращающиеся корабли
64 5.6° Крупные спрайты транспорта, медленные точные повороты

Чем больше спрайт, тем больше углов ему нужно: 16-пиксельный корабль почти не меняется между двумя близкими курсами, а 64-пиксельная машина заметно прыгает.

Вид сверху, строго вниз

Для корабля или машины, видимых сверху, рендерите с видом сверху и кольцом сторон:

pxr render race-car.glb --preset selout --view top-down --size 40 --ring 16 \
  --clip none --export png,json -o car.png

Красная гоночная машина строго сверху под 16 углами, два ряда по восемь

--ring 16 ставит 16 камер вокруг модели против часовой стрелки от фронта, по одной на сторону, все с одним размером и одним масштабом пикселей на метр, так что машина одного размера на каждом курсе и поворачивается вокруг одного неподвижного пивота. В листе по строке на сторону; JSON называет каждую, так что игра выбирает кадр по курсу. --ring принимает значения от 1 до 64; --sides 0,10,20,... принимает ваш собственный список углов.

В приложении добавьте камеру кнопкой + в панели «Структура», выберите Камера для… › Шутер с видом сверху (строго вниз, 16 сторон, 32 px) или задайте Вид для камеры Юг и используйте Кольцо вокруг модели для 4, 8, 16 или 32 сторон.

Гоночный вид

Гонки с видом сверху времён аркад часто смотрели вниз под наклоном, так что каждый угол показывал ещё и бок машины. Камера Гонки делает именно это: 12° вниз, 16 сторон, 64 px.

pxr render race-car.glb --preset selout --camera racing --clip none -o car-racing.png

Красная гоночная машина под 16 углами с низкой наклонной камеры

Свет, который стоит на месте или поворачивается вместе с машиной

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

Если свет должен стоять на месте в мире, чтобы у машины, повёрнутой от солнца, теневая сторона была обращена к игроку, выключите Следует за камерой у ключевого света (--light-space world). В анимации выше использован третий способ: --turntable 32 один раз поворачивает саму модель под одной камерой, как действие из 32 кадров, так что свет скользит по корпусу, пока она вращается.

Анимация под каждым углом

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

pxr render spaceship.glb --preset selout --view top-down --size 48 --ring 32 \
  --clip all --export png,json,godot

Листы быстро растут при 32 сторонах; --max-height 4096 делит высокий лист на страницы, целыми клипами на страницу, а --dedupe хранит одинаковые кадры один раз. космический корабль, гоночный автомобиль и полицейская машина из библиотеки — бесплатные модели CC0, на которых можно попробовать.

Варианты бесплатно

Поскольку каждый угол берётся из одной модели, варианты ничего не стоят в отрисовке. --variant hit-flash записывает версию со вспышкой для урона; --team с --variant team:blue перекрашивает цвет команды; --material-colour даёт машине новую покраску. Раздел вариантов палитры в руководстве перечисляет их все. Для кораблей, которые летят вверх по экрану, а не поворачиваются, см. спрайты для шмапов.

Вопросы

Сколько поворотов нужно спрайту машины с видом сверху?

16 — обычный минимум для плавного управления; 32 выглядит плавно на большинстве скоростей, а 64 подходит для крупных спрайтов или медленных точных поворотов. У кораблей в играх в духе Asteroids часто 16 или 32. Меньше 16 выглядит рывками.

Почему не повернуть один спрайт в движке?

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

Может ли у транспорта быть анимация под каждым углом?

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

Что почитать дальше

Попробуйте на своей модели бесплатно в браузере или купите полную версию.

Попробовать в браузере Купить Pixor