Article
OO
Oliver Orangers
02/02/25
03. Тайлы и лвл-дизайн

И снова привет!

Продолжаем наш цикл руководств для разработки своей SmashTV-style игры в Gamemaker!

Урок 03. - Тайлы и лвл-дизайн локаций.


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


Начнем немного с теории. Что же такое лвл-дизайн?


Дизайна уровня(level design) в геймдеве — это процесс создания игровых уровней(локаций/комнат), который включает в себя проектирование пространства, размещение объектов, создание механик взаимодействия и обеспечение баланса между сложностью и интересом для игрока. Основные аспекты уровня дизайна включают:

  1. Структуру уровня: Определение геометрии и архитектуры уровня, включая пути, по которым игрок может перемещаться, и зоны, которые он может исследовать.
  2. Игровые механики: Внедрение механик, которые игрок должен использовать для преодоления препятствий, решения головоломок или взаимодействия с окружающей средой.
  3. Баланс сложности: Создание уровней, которые предлагают подходящий уровень вызова, чтобы игроки не чувствовали себя слишком уставшими или, наоборот, не испытывали скуку.
  4. Наратив и атмосфера: Уровень дизайна также включает в себя создание атмосферы и повествования, которые поддерживают общий стиль игры и вовлекают игрока в сюжет.
  5. Тестирование и итерации: Процесс тестирования уровней на предмет их играбельности и внесение изменений на основе отзывов игроков.

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


Хорошо, а как делать лвл-дизайн нам, обычным инди-разработчикам?

Можно размещать объекты в комнате, рисовать фоны или использовать ассеты, но самый простой и быстрый способ создания уровней для 2д разработчиков - это тайлы. Что же такое тайлы?

Тайлы (или плитки) в 2D видеоиграх — это небольшие квадратные или прямоугольные графические элементы, которые используются для создания игровых уровней и окружения. Тайлы позволяют нам, разработчикам эффективно строить большие игровые пространства, используя повторяющиеся текстуры и элементы.


Нам стало понятно, что такое тайлы, но как нам их сделать в гейммейкере для нашего проекта?

Для начала создадим новый спрайт в нашем проекте.

Можем назвать его sTiles - спрайт тайлов для нашей игры. Размер укажем побольше, всё же там будут все тайлы для нашей игры. Я возьму разрешение 320 на 320. Этого хватит с головой на все мои задумки.


Теперь для удобства рисования тайлов возьмем и включим сетку в настройках спрайта. Это делается по нажатию на кнопку вверху справа.

По нажатию на сетку она включится, а чуть правее есть опции сетки.


Настроим сетку по альфе(видимости) и размеру. Я для своей игры буду рисовать все в формате 16 на 16, поэтому и сетку сделаю такого размера. Советую пока и тебе, друг сделать такую же сетку. Обычно в играх делают тайлы 16 на 16, 32 на 32, 64 на 64, хотя можно выбрать и любое другое число. Одно условие - чтобы тайлы были квадратными.


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

Важно! Верхняя левая клетка всегда в гейммейкере должна быть пустой. Она является образцовой для нашего движка.

Вот такой вариант тайлов вышел у меня. Мы можем их добавлять и позже, даже когда выставим некоторые в комнате. Не переживай, если нет идей, что рисовать!

Успеешь еще!

А пока обязательно нарисуй клеточку для фона и парочку объектов - деревья, цветы, камни и прочее.


Если ты нарисовал парочку плиток, то перейдем ко второму этапу - рисованию ими в нашей комнате. Для этого придется создать “набор плиток”, который находится в ресурсах(папках) справа.

Создаем новый набор плиток!


Теперь дадим ему название tИМЯ. У меня игра про лес, поэтому мои тайлы будут называться tForest.


Перед собой мы видим окно свойств набора плиток. Посередине можно выбрать спрайт, который мы будем использовать, а справа - настроить размер одной плитки!

Я выберу спрайт, который рисовал “sTiles” и изменю справа размер на 16 на 16, так как размер моего одного тайла(плитки) 16 на 16.


Получается вот так!


А теперь пройдем в нашу первую комнату и попробуем порисовать саму локацию первого уровня!

Для этого зайдем в нашу комнату.

В наших комнатах (вверху слева) есть “слои”. Слои - это как порядок объектов на сцене по время постановки в театре. Есть объекты, которые сзади играющих, есть сами артисты, которые в середине сцены, есть объекты перед ними, кто-то из артистов вообще выбежит со сцены на передний план и побежит к первым рядам зрителей!

Это всё - порядок, слои.

Так и в игровом уровне, в нашей комнате есть слои.

По умолчанию у нас есть только два слоя - Instances и Background.

На слои Instances(Экземпляры) могут находиться ТОЛЬКО объекты. Там находится наш Игрок. А на слое BackGround мы могли расположить картинку как фон. Сейчас наш фон черный, чтобы было удобно на нем находить объекты. Но постойте, как нам создать слой с плиткой?

Для этого обратим внимание чуть ниже активных слоев. Там есть 7-8 кнопочек создания новых слоев.

1 - это background - для больших спрайтов на всю комнату,

2 - это instances - для объектов,

3 - это tiles - для набора плиток,

4 - это paths(пути) - для путей, которые мы будем изучать позже,

5 - это assets - для спрайтов,

6 - это эффекты,

7 - это папки, которые позволяют объединять в одну группу слои, чтобы было удобнее и понятнее разработчику.


Как понятно, нас сейчас интересует 3 кнопочка “Создать новый слой плитки”. Нажмем на нее.


Теперь нажмем внизу “Нет набора плитки”, чтобы выбрать набор для этого слоя!


В папках выберем нужным нам и обратим внимание направо. Там есть “ресурсы” - наши папки со всеми игровыми ассетами. И появилась новая вкладка “редактор рума”. Перейдем с “ресурсов” в “редактор рума”


Если мы это сделаем, то откроются плитки, которые можно устанавливать в комнате!


Как это делать? Просто кликни левой кнопкой мыши по нужной плитке. Теперь в самой комнате можно ее ставить на левую кнопку где угодно, а правой - убирать!


В процессе создания комнаты, ты обратишь внимание, что тайлы загораживают нашего персонажа! Это потому что они порядком выше(ближе) к зрителю, чем сам игрок. Давай слева вверху, где слои, поставим слой с этими тайлами чуть ниже.


Вот так. Теперь самый ближний к зрителю - Instances, за ним будут тайлы, а сзади всего - наш фон. Запомнил? Чем выше, тем ближе. Чем ниже - тем дальше, глубже!

Вторым моментом, который ты, друг мой начинающий, заметишь будет то, что тайлы ставятся друг на друга не так, как ты хочешь! Ведь если поставить мою траву или елку на фоновый тайл, то он будет показывать, что за ним.

А за ним - черный бакграунд!


Значит, нам надо создать еще один слой с тайлами, чтобы на одном была трава, а на траве уже были цветочки и елочки!


Проделаем ту же операцию по созданию слоя тайлов, что и до этого. Теперь у нас два слоя с тайлами! Тайлс_1 - ниже, тайлс_2 - выше!

Для игры нашего жанра нам понадобится квадратная “арена” с 4 проходами по всем сторонам арены. Сделаем!


Еще я обещал рассказать, как вертеть тайлами. Для этого, после того, как ты выбрал тайл нажимай “Z” для поворота его, “X” для отражения по горизонтали или “Y” для отражения по вертикали!


Удобно, разнообразно и рисовать лишний раз не нужно было мои тайлы!

Еще можно обратить внимание наверх. Там есть инструменты, как в рисовании спрайтов, но для тайлов. Так можно залить одним тайлов всю комнату или провести линию. Тоже может быть удобно, друг!

Когда закончишь рисовать комнату или даже несколько, дай себе отдохнуть приятель, не всё сразу! На сегодня это всё. Мы узнали что такое лвл-дизайн, что такое тайлы, научились с тобой создавать свои тайлы и добавлять их в комнату!

С каждой новой комнатой твой дизайн будет только лучше!

В следующем руководстве я покажу, как нам добавлять столкновение, чтобы наш герой не выходил за пределы комнаты, а также потихоньку начнем добавлять врагов!

Peace!


Ссылка на следующую статью: Урок 04. - Коллизия - https://cr5.space/h/ru-gamemaker/post/5


Comments