За лаштунками: як створювали Mario.Game Adventure

Mario.Game Adventure — це один файл JavaScript без рушія, без файлів зображень і без аудіофайлів. Ось як усе склалося.

Піксельна графіка, намальована кодом

Кожен спрайт — герой у малій і великій формі, Walkers, Koopas, Spinies, Piranha Plants, бос, блоки, хмари та замки — описаний у вихідному коді рядками з літер-кольорів або намальований невеликими процедурами з фігур. Під час запуску гра один раз малює їх на позаекранних полотнах (canvas), а потім щокадру копіює на екран. Кожен світ має власну палітру: ті самі цеглини під землею стають синіми, вночі — крижаними, а в замку — сірими.

Фізика з класичним відчуттям

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

Вісім рівнів, чотири теми

Кожен світ відкриває одну головну ідею:

1. Світ 1 — основи: труби, прірви, підсилення, а потім печера з низькою стелею.
2. Світ 2 — Spinies, на яких не можна стрибати, і перші рухомі підйомники в хмарах.
3. Світ 3 — нічний рівень, що поєднує все разом, а потім верхівки дерев над безодньою.
4. Світ 4 — людні дороги фортеці, а потім замок із вогняними паличками, лавою та босом.

Бот, що проходить кожен рівень

Щоб кожен рівень можна було пройти, ми написали тестового бота, який проходить кожен етап із увімкненою невразливістю, стрибаючи через стіни та проміжки. Коли він застрягав, ми дивилися на це місце: кілька разів так знаходився стрибок, що був вищим на піксель, або блок, до якого не можна дістатися, — і ми виправляли рівень. Разом із перевіркою висоти стрибка до кожного блока це допомогло знайти всі недосяжні місця, які ми змогли виявити.

Музика на Web Audio

Саундтрек генерується наживо крихітним секвенсором через Web Audio API браузера: квадратні й трикутні хвилі для мелодії та баса, шум для барабанів. Кожен світ має власну оригінальну мелодію, а ще джингли для підсилень, прапора, завершення гри та фіналу. Коли таймер спадає до 100, темп прискорюється — достоту як ви й очікуєте.

Спробуйте

Грайте в Mario.Game Adventure або одразу переходьте до нашого проходження, якщо застрягли.