Fruit Ninja
Привет Пикабушники.
Представляю вашему вниманию очередную игру из серии "Игры длиною в один файл"
Вспомнил старую мобильную Fruit Ninja — ту самую, где водишь пальцем по экрану, а из нижнего угла вылетают фрукты, и их надо порезать. Простая механика, а залипаешь на час. Играл в неё лет десять назад, а рефлекс «не трогать чёрный шар» до сих пор срабатывает, когда вижу что-то круглое и тёмное на столе.
И подумал — а слабо мне такое собрать? Один файл, без движков, без npm, без «установите ещё 300 мегабайт зависимостей, чтобы отрисовать круг».
Оказалось, не слабо. Слабо — это потом, когда я пытался объяснить самому себе, почему арбуз, порезанный под углом 47 градусов, разлетается именно в эти стороны, а не в противоположные.
Что получилось в итоге.
Открываешь файл в браузере — и всё, ты ниндзя. Никаких меню, никаких «нажмите, чтобы начать». Просто водишь мышкой или пальцем, и фрукты разваливаются на половинки. Арбуз брызгает красным, киви — зелёным, лимон — жёлтым. Каждый фрукт нарисован кодом: кружочки, градиенты, полоски у арбуза, семечки у киви. Ни одной картинки — всё руками.
Бомбы летят вместе с фруктами. Чёрные, с искрящимся фитилём, и искра эта пульсирует — я на неё потратил больше времени, чем на всю остальную игру. Потому что если бомба не выглядит опасно, то зачем она вообще. Тронул — экран трясётся, вспышка, и всё, рейс окончен.
Три пропущенных фрукта — тоже конец. Я пробовал сделать «жизни» и «вторую попытку», но это как-то размягчает игру. Тут либо режешь, либо нет.
Почему это сложнее, чем кажется.
Первый арбуз — легко. Второй — тоже. А вот когда их три, и все летят по разным траекториям, а между ними болтается бомба — вот тут начинается фруктовый ад. Я после нескольких партий понял, почему ниндзя в кино такие сосредоточенные. У них, видимо, тоже бомбы летали.
Что внутри, если кому интересно.
— 7 фруктов: арбуз, апельсин, яблоко, лимон, киви, слива, груша
— Бомбы с пульсирующей искрой
— Экранная тряска, вспышки, брызги сока
— Звуки через WebAudio — можно в наушниках, можно без
— Рекорд сохраняется в браузере (у меня 63, побейте)
— Статистика после игры: сколько срезал, максимальное комбо, точность, любимый фрукт
— Счётчик игроков на странице — мне просто было интересно, сколько людей в это ткнёт
— Таймер и счётчик фруктов в воздухе
Технические детали.
— ~900 строк, один HTML-файл
— Canvas 2D, никаких библиотек
— Управление: мышь или палец
— Работает на телефоне
— Открывается двойным кликом, интернет не нужен
Вопрос к залу.
Стоит ли добавить режим «на время» — 60 секунд, кто больше порежет? Или режим «выживание» — фрукты летят всё быстрее, бомб всё больше? Или оставить как есть, классика на три жизни?
Пишите в комментах свои рекорды и истории о том, как один маленький арбуз разнёс всю вашу карьеру ниндзя.
Поиграть можно по ссылке: https://greenman2022.github.io/fruitninja/

Молодец! Удачи тебе