Основы разработки компьютерных игр в жанре платформера

Библиографическое описание:

Бобонаков, Константин Владимирович. Разработка игры в жанре 2D-платформер для направления «Прикладная информатика» [Электронный ресурс] : выпускная квалификационная работа бакалавра : 09.03.03 / К. В. Бобонаков. — Абакан : СФУ; ХТИ — филиал СФУ, 2020.

Специальность выпускной работы:

09.03.03 Прикладная информатика

Учёная степень или квалификация, на которую выполнена работа:

Аннотация:

Объект выпускной квалификационной работы: процесс разработки компьютерных игр. Предмет выпускной квалификационной работы: разработка компьютерных игр в жанре 2D-платформер. Цель ВКР: разработка игрового приложения для привлечения абитуриентов при поступлении в ХТИ – филиал СФУ на направление «Прикладная информатика». Основными задачами ВКР являются:  проанализировать существующие практики для привлечения абитуриентов;  выбрать и обосновать жанр, в котором будет разрабатываться игра;  проанализировать и обосновать средства разработки игры;  разработать игру;  провести оценку экономической эффективности игры. В результате была разработана игра, которая будет выполнять функцию привлечения абитуриентов на направление «Прикладная информатика».

Коллекции:

• Выпускные квалификационные работы бакалавров и специалистов [18538]

Про создание платформера на Unity. Часть первая, характерная

Все мы здесь любим качественные пошаговые руководства для начинающих, чего уж греха таить. По платформерам на Unity руководств много, а вот качественных не то что бы и очень. Сегодня мы попробуем добавить в копилку хороших уроков еще один. А создавать мы будем персонажа для 2D-платформера, ни больше, ни меньше.

Присоединяйтесь, учитесь, но помните: под катом очень много гифок.

Итак, с чего начать создание персонажа? Конечно же, с его спрайта. Достаточно перетащить картинку из любой папки на жестком диске во вкладку Assets, а оттуда — прямо на сцену. Оговорюсь сразу, в этом уроке мы не будем рассматривать создание анимации. А вот в следующих частях цикла — будем.

Как видите, после добавления на сцену (условимся, что это полноценный аналог словосочетанию scene view) у спрайта появились два компонента. Первый — transform. Он отвечает за расположение любого игрового объекта на сцене, его масштаб и текущий угол поворота относительно осей. Компонент sprite renderer как раз занимается отрисовкой спрайта нашего обаятельного носача в процессе редактирования и игры.

Но пока персонаж всего лишь картинка, он не может взаимодействовать с окружающим его миром. Для этого на помощь приходят компоненты, спрятанные во вкладке physics2d. В нашем случае это box collider и circle collider. Первый мы добавим на верхнюю часть персонажа для столкновений со стенами и всем остальным, а второй расположим на уровне ног. Это позволит двигаться по наклонным поверхностям (и поверхностям с небольшим перепадом высот) без особых проблем.

Теперь, чтобы на героя действовала, допустим, гравитация, добавим ему rigidbody2D (ну или твердое тело, как вам больше нравится). Для этого все в том же меню add component -> physics2D выберем пункт rigidbody2D и к спрайту сразу же добавится еще один компонент.

Если вкратце:
mass отвечает понятно за что;
linear drag и angular drag — линейное и угловое сопротивление, соответственно;
gravity scale — коэффициент гравитации для конкретно этого объекта;
fixed angle отключает переворот персонажа при столкновении с чем-нибудь, допустим, летящим;
isKinematic фиксирует объект раз и навсегда в одной точке;
interpolate устанавливает режим сглаживания при отрисовке персонажа;

Для платформера стандартное значение гравитации (-9.81 по оси Y) не очень подходит, поэтому изменим его на какое-нибудь магическое число. Например, -30. Для этого зайдем в Edit — Project Settings — Physics2D и заменим нужное значение в инспекторе.

На этом пока перестанем добавлять персонажу компоненты. Но сделаем кое-что из него. Для того, чтобы нам не приходилось тысячу раз добавлять одинаковые компоненты на каждом, допустим, уровне, в Unity есть механика под названием prefabs. Она позволяет создать из игрового объекта «болванку», которую можно использовать много раз и менять как своей душе угодно, не боясь за то, что какие-то экземпляры могут не измениться. Для создания префаба достаточно просто перетащить объект из иерарахии во вкладку assets. В моем случае еще и в папку prefabs.

Как видите, оба экземпляра героя прекрасно создаются и существуют вместе. Теперь нужно создать платформу, на которой будет стоять наш большеносый друг. Перетащим спрайт на сцену и добавим ему polygon collider. Размеры этого коллайдера, к слову, можно менять, перетаскивая его вершины с зажатой кнопкой shift.

Самое время научить персонажа двигаться. Перетащим заранее подготовленный скрипт (его нужно скачать и сохранить в папку assets) прямо на персонажа в hierarchy view.

У этого кусочка кода есть ряд параметров, которые отвечают за поведение героя в игре.

maxSpeed и JumpForce — максимальная скорость (по горизонтали) и сила прыжка. Экспериментально проверено, что для массы, равной единице, и гравитации -30 значения maxSpeed=10 и jumpForce = 700 являются оптимальными.

groundCheck — дочерний объект, находящийся в нижней точке спрайта и отвечающий за определение того, находится ли нечто, чем мы управляем, на «земле»

whatIsGround — что, собственно, считать землей. В нашем случае «землей» считается все, кроме персонажа

groundRadius — некая величина, в пределах которой проверяется столкновение с поверхностью.

В итоге, строчка grounded = Physics2D.OverlapCircle (groundCheck.position, groundRadius, whatIsGround); проверяет, пересекает ли groundCheck с радиусом groundRadius поверхность и, допустим, запрещает прыгать в нужных случаях.

Давайте, наконец, запустим игру и посмотрим что же у нас сегодня получилось. Для этого нажмем кнопку Play в верхн… Да ладно, вы и сами это разглядели 🙂

Герой прекрасно двигается (хотя, возможно, и не совсем прекрасно), и это создает для нас отличные предпосылки продолжить создание платформера.

А в следующей части мы разберемся как управлять камерой, узнаем кому нужно зажигание звезд и создадим самого первого врага. И да, попутно исправим один критический баг, беспечно пропущенный в статью во время этого урока. Догадаетесь, какой?

Если эта статья вдруг пробудила в вас желание написать собственную игру, то не растрачивайте его впустую! Прямо сейчас проходит конкурс, стать участником которого слишком просто: достаточно зарегистрироваться, выложить свою игру в store и дождаться объявления результатов. А победителей ждут Xbox One и великолепные Lumia 930!

Пойду дописывать свой Angry Flappy Swompy 3 Deluxe. Stay tuned, вторая часть статьи в ближайшие дни!

А вот и другие наши статьи по схожей тематике:

• Супер-полное руководство по публикации в Microsoft Store;
• Программируем в мире Minecraft;
• Другая реальность финансового рынка.

Разработка игры в жанре платформера на JavaScript

Начать разработку игры – это всегда увлекательно. Если вы уже знакомы с языком программирования JavaScript, то довольно легко создать свою собственную игру в жанре платформера. В данной статье мы рассмотрим все этапы разработки игры на примере создания простой HTML5 игры.

1. Создание главной страницы

Первым этапом разработки игры будет создание главной страницы. Для этого вам потребуется создать файл с расширением .html, который будет являться основной страницей игры. На этой странице вы можете создать меню, добавить заголовок и описание, а также подключить необходимые для игры библиотеки.

Для подключения библиотеки Phaser.js, которая используется для создания игр, вам нужно добавить следующий код в секцию своего файла index.html:

2. Создание сцены

Каждая игра на Phaser.js состоит из сцен. Сцена – это отдельная часть игры, на которой происходят все игровые события. В данном случае мы будем создавать отдельную сцену для каждого уровня игры.

Для создания новой сцены на Phaser.js вам необходимо создать новый класс JavaScript, который будет расширять класс Phaser.Scene. Это можно сделать следующим образом:

class Level1 extends Phaser.Scene < // . >

3. Добавление спрайтов

Спрайты – это графические элементы игры, которые используются для создания всех элементов на сцене. В данной игре мы будем использовать спрайты для создания персонажа, монет, платформ и препятствий.

Для создания спрайта вам необходимо использовать класс Phaser.GameObjects.Sprite и указать его параметры:

const player = this.physics.add.sprite(50, 200, 'player');

В данном коде указанны параметры спрайта: начальные координаты по оси x и y и имя текстуры.

4. Добавление управления

Для управления игроком вам потребуется объявить обработчики событий клавиатуры. Для этого можно использовать функцию cursors, которая автоматически создает объект с обработчиками нажатия на клавиши.

const cursors = this.input.keyboard.createCursorKeys();

В данном коде создается объект cursors, который хранит обработчики нажатия на стрелки клавиатуры.

5. Реализация физики

Для создания игровой физики в Phaser.js используется класс Physics. Для создания физических объектов вы можете использовать следующий код:

this.physics.add.collider(player, platforms);

В данном коде указывается, что персонаж игры должен столкнуться с платформой.

6. Реализация механики игры

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

this.physics.add.overlap(player, coins, collectCoin, null, this);

В данном коде игрок собирает монеты при соприкосновении с ними.

7. Добавление анимаций

Анимация – это последовательность изображений, которые сменяют друг друга с заданной частотой. Для добавления анимации в Phaser.js используется класс Phaser.Animations. Для создания анимации вы можете использовать следующий код:

this.anims.create(< key: 'walk', frames: this.anims.generateFrameNumbers('player', < start: 0, end: 3 >), frameRate: 10, repeat: -1 >);

В данном коде создается анимация «ходьбы» персонажа.

8. Загрузка уровней

Последний этап разработки игры – это добавление уровней. Для загрузки уровней вам нужно создать JSON-файлы, которые будут хранить информацию о каждом уровне.

this.load.tilemapTiledJSON('map', 'assets/maps/level1.json');

В данном коде загружается JSON-файл для первого уровня игры.

В результате вы создали простую игру в жанре платформера на JavaScript с использованием библиотеки Phaser.js. Развивать ее можно, добавляя новые объекты, механики и уровни. Это всего лишь начало, и мы желаем вам успехов в разработке своих креативных проектов на JavaScript!

При подготовке материала использовались источники:
https://elib.sfu-kras.ru/handle/2311/135575
https://habr.com/ru/companies/microsoft/articles/236125/
https://qaa-engineer.ru/razrabotka-igry-v-zhanre-platformera-na-javascript/