Що таке спрайтшит? Зрозуміле пояснення того, як рухаються персонажі в іграх

Коли починаєш малювати персонажів у піксель-арті, рано чи пізно натрапляєш на термін «спрайтшит» (sprite sheet). Ділюся вступним поясненням Keitaro з note: воно крок за кроком розбирає, як це працює, і мені воно видалося корисним.

Спрайт — це двовимірне зображення, яке виводиться на екран гри. Персонажі, вороги, предмети, кулі та ефекти належать до спрайтів, а спрайтшит — це набір таких зображень, зібраних в одну велику картинку. Для анімації ходи показують кадр із правою ногою попереду, потім кадр із ногами разом, потім кадр з лівою ногою попереду, швидко їх змінюючи, щоб виник ефект руху. Тобто рух створюється зміною нерухомих картинок, а не відео.

Гра не виводить велике зображення цілком. За координатами вона вирізає лише потрібний кадр. Наприклад, якщо кожен кадр має 128×128 пікселів і вісім стоять поряд, область виведення зсувається з 0–127 px на 128–255 px і так далі. У статті також наведено приклад, де по горизонталі — 8 напрямків, а по вертикалі — дії (ходьба, атака, отримання удару, захист), тобто 8 напрямків × 7 станів, разом 56 кадрів.

Під час практичного використання, як зазначено в статті, найважливіше — вирівняти опорну точку в кожному кадрі. Якщо ноги зсуваються на кілька пікселів від кадру до кадру, персонаж під час анімації ніби тремтить угору й униз. Прозорий фон теж обов'язковий.

Нарешті розведено різницю між спрайтшитом, тобто просто набором пов'язаних зображень, і атласом спрайтів, який пакує кілька зображень в одну текстуру для ефективнішого малювання. Найбільше мені запам'ятався висновок, що створити зображення простіше, ніж привести їх до форми, яку гра може правильно використати. Думаю, це стане в пригоді й піксель-артистам, особливо на етапі експорту.

Джерело: note (Keitaro)