
Разглядывая иллюстрации в комиксе "Я ненавижу страну чудес", подумал, что очень красочно выглядит сцена борьбы с зомби, отлично подобраны цвета и замечательно нарисованы персонажи (ещё осознал, что комиксы мне нравятся, хотя я не знаю, как их правильно читать). Глядя на эту красоту, решил в игре про воюющих квадратиков сделать злодеев зомби, которых должен был бы побеждать бесстрашный герой.
В этом прототипе нужно как можно дольше продержаться, уклоняясь от столкновений с зомби, а для борьбы использовать снаряд из света. Проблема в том, что снаряд один и его нужно ловить обратно для повторного броска, а зомби ещё и пытается от него уклоняться (иногда - успешно).
Управлять - стрелками или WAD, для выстрела - пробел. На тачскрине тоже играть можно: свайпами меняем направление или прыгаем, а стрелять просто нажатием на экран.
Эволюция персонажей
В финальном варианте игры персонажи не такие, как я их создавал в первом варианте. Сперва я думал сделать просто прыгающие квадраты, а уже потом под влиянием комикса сделал из врагов (frags) зомби. Так у зелёного врага в глазах появились крестики. Потом я попытался сделать глаза более выразительными, а тело зомби деформированным.



Помимо этого мне захотелось сделать так, чтобы во время прыжка у героя менялось положение зрачка. Только во время игры это почти не заметно из-за высокой скорости движения. Поэтому я прикрутил смену направления взгляда и для стартовой кнопки:
pointerMove(pointer) {
let frame = pointer.position.x < this.startButton.x ? 0 : 3;
let offset = 1;
if (pointer.position.y > (this.startButton.y + this.startButton.height)) {
offset = 2;
}
else if (pointer.position.y < (this.startButton.y - this.startButton.height)) {
offset = 0;
}
frame += offset;
this.startButton.setFrame(frame);
}
Мобильные устройства
Так это выглядит на экране моего телефона:

А так это смотрится, если экран повернуть вертикально:

Код для ресайза и для управления с тачскрина взял из книги "HTML5 Cross Platform Game Development Using Phaser 3", которую написал Emanuele Feronato (https://www.emanueleferonato.com/).
Исходники и игра
Исходники https://gitlab.com/grigoriytretyakov/phaser3-bouncing-frags
Играть можно там, или кликнув по зомби: