Уроки по созданию 2d игры

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

Тип # 1: Основанный на плитках (простой)
Движение персонажа ограничено тайлами (плитками), так что вы никогда не сможете стоять между двумя плитками. Могут быть использованы специальные анимации, чтобы создать иллюзию плавного движения, но, игрок всегда будет стоять прямо на каком-то тайле. Это самый простой способ реализации платформера, но это накладывает жесткие ограничения на управление персонажем, что делает подход непригодным для реализации геймплея привычных для нас игр платформеров. Однако, он часто используется для головоломок и “кинематографических” платформеров.
Примеры: Принц Персии, Toki Tori, Lode Runner, Flashback
Как это работает
Карта представляет собой сетку из плиток, каждая из которых хранит информацию о том, является ли она препятствием или нет, какое изображение используется, какие звуки шагов персонажа должны использоваться и так далее. Игрок и другие персонажи представлены в виде набора одного или более плиток, которые перемещаются вместе. В Lode Runner, например, игрок состоит из одной плитки. В Toki Tori, игрок 2 × 2 плитки. В Flashback, игрок в ширину две плитки и пять плиток высотой когда стоит (что является необычным в связи с меньшим размером тайлов карты, см. картинку выше), и три плитки высотой, когда сидит.
В этом виде игры, игрок редко будет – если вообще будет – двигаться по диагонали. Но, если необходимо, – движение можно разложить в два отдельных этапа. Персонаж скорее всего будет двигаться на одну плитку за шаг. Движение через несколько плиток может быть реализовано в виде нескольких шагов по 1 плитке каждый (в Flashback вы всегда двигаетесь через две плитки сразу). Алгоритм:
1. Создайте копию персонажа, переместите его на место назначения (например, если двигаться на одну клетку вправо, надо сделать копию персонажа, где каждая его плитка сдвигается 1 плитку вправо)
2. Проверьте эту копию на пересечения с фоном и другими персонажами.
3. Если пересечение было найдено, движение персонажа блокируется. Надо включить соответствующие анимации и т.д.
4. В противном случае, сдвигаем персонаж. Во время перемещения проигрывается анимация, поэтому переход выглядит равномерным.
Этот вид движения очень плохо подходит для традиционных дугообразных прыжков – так, игры в этом жанре часто вовсе не используют прыжки (Toki Tori, Lode Runner), или может быть только вертикальные или горизонтальные прыжки (Принц Персии, Flashback), которые есть ни что иное, как разновидность описываемого метода.
Преимущества этой системы включают простоту и точность. Поскольку игры более детерминированы, глюки будут возникать гораздо реже. Игровой процесс более контролируем, нужно меньше вносить изменения в реализацию в зависимости от обстоятельств. Игровая механика (например, подъём на выступах и односторонние платформы) очень проста, по сравнению с более сложными способами создания платформеров – все, что вам нужно сделать, это проверить, в правильном месте ли расположены тайлы игрока на карте для выполнения какого-то действия.
В принципе, эта система не позволяет делать шаги шириной менее одной плитки, но это можно улучшить несколькими способами. Например, плитка может быть немного меньше, чем игрок (скажем, игрок 2 × 6 плиток), или вы можете позволить визуально заходить внутрь плитки, не влияя при этом на логику игры (такой подход, мне думается, использован в “Lode Runner – Legend Returns”).

T ип #2: Основаный на плитках (со сглаживанием )
Здесь взаимодействие с игровым миром также определяется по сетке ячеек, но персонажи имеют возможность свободно перемещаться по миру (обычно подразумевается разрешение 1px с округлением до целых). Это самый распространённый метод разработки платформеров для 8-битных и 16-битных консолей. Он достаточно популярен и до сих пор, благодаря своей относительной простоте, в связи с чем редактирование уровней игры представляет собой более лёгкую задачу, чем при работе с более продвинутыми типами. Это позволяет создавать наклонные платформы в уровне, а также задавать более плавную траекторию для прыжков.
Если вы хотите сделать игру в жанре «2d экшн», но не уверены, согласно какому типу платформеров хотите вести разработку, я предлагаю прибегнуть именно к этому. Он очень гибок, относительно прост в реализации, и предоставляет большую степень контроля, нежели другие три типа. Неудивительно, что большинство лучших экшн-платформеров всех времён были разработаны именно так.


Кадр из игры Mega Man X. Видны границы ячеек и hitbox (зона поражения ) игрока .
Примеры игр : Super Mario World , Sonic the Hedgehog , Mega Man , Super Metroid , Contra , Metal Slug , и практически все остальные платформеры 16- битной эпохи .

Как это работает .

Информация о карте записывается и хранится так же, как и в первом типе, разница заключается во взаимодействии персонажей с игровым фоном. Hitbox персонажа – ограничивающий прямоугольник, выровненный по координатным осям (AABB, или, проще говоря, прямоугольник, который не вращается). Как правило, ограничивающий прямоугольник является целым кратным от размера ячейки. Стандартные мерки: одна ячейка в ширину, а в высоту же одна (маленький Марио, свёрнутая в шар Сэмус), две (большой Марио, Мега Мэн, Сэмус в положении «сидя») или три ячейки(Сэмус в положении «стоя»). Во многих случаях, спрайт самого персонажа больше, чем логический хитбокс, так как это более приемлемо визуально. Геймплей таким образом становится «честнее», ведь для игрока лучше иметь возможность избежать удара противника, когда он по идее должен быть, чем получать повреждения, когда на экране снаряд проходит мимо. На картинке выше можно увидеть, что спрайт по форме напоминает квадрат (фактически, он имеет ширину в 2 ячейки), но при этом имеет прямоугольный хитбокс (1 ячейка).

Если предположить, что на карте нет наклонных и односторонних платформ, алгоритм несложен:

1. Последовательно разбить на шаги движение по осям X и Y. Если затем вы планируете ввести наклоны, начните разбивку с оси Х, в противном случае порядок не имеет большого значения. Затем, для каждой оси:

2. Найдите координату края, направленного вперёд (ведущего края). Например, при движении влево это координата Х левой стороны ограничивающего прямоугольника, при движении вправо – коорднината Х правой стороны, при движении вверх – координата Y верхней стороны и т. д.

3. Определите, с какими линиями сетки пересекается ограничивающий прямоугольник – так вы получите минимальное и максимальное значение на противоположной оси (т.е. при движении по горизонтали мы найдем номера вертикальных ячеек с которыми пересекаемся). К примеру, если вы двигаетесь налево, игрок пересекает ряды номер 32, 33 и 34 (то есть ячейки с координатами Y = 32 * TS, Y = 33 * TS, и Y = 34 * TS, где TS = размер ячейки).

4. Проследуйте дальше по линии ячеек в направлении движения пока не найдёте ближайшее твердое препятствие. Затем пройдитесь по всем движущимся объектам, и определите ближайшее препятствие среди них на вашем пути.

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

6. Передвиньте игрока на новую позицию. С новой позиции, повторите шаги, и так далее.

Наклоны

Mega Man X с отмеченными ячейками наклона .

Наклоны (ячейки, на которые указывают зелёные стрелки) могут представлять определённую сложность, так как они по сути являются препятствиями, но при этом игрок всё же может частично входить в эти ячейки. Они также предполагают изменение Y координаты персонажа в зависимости от движения по оси X. Во избежание проблем, нужно сделать так, чтобы ячейка содержала параметр “floor y” каждой стороны. Если в системе координат обозначить левую верхнюю ячейку как {0, 0}, как показано на рисунке, тогда точка {0, 3} – это ячейка, расположенная чуть левее от персонажа (первая ячейка наклона); ячейка, на которой он стоит – точка {4, 7}, затем {8, 11}, и {12, 15}. Далее ячейки начинают повторяться, с новой точки {0, 3} и далее, а дальше спуск становится круче и состоит из двух точек {0, 7} и {8, 15}.

Ячейка {4, 7} в деталях

Система, которую я сейчас опишу, позволяет вводить произвольные наклоны, хотя, по чисто визуальным причинам, эти два вида наклонов встречаются чаще всего и включают в себя всего 12 ячеек (6, обозначенных выше и их зеркальные отражения). Алгоритм столкновений для горизонтального движения изменяется следующим образом:

■ Здесь обязательно сначала смещаться по X, потом по Y.
■ Мы считаем что столкновение с ячейкой склона произошло только если его ближайший край – высокий (на картинке – меньшая координата y). Это исключит «проваливание» персонажа через склон с противоположной стороны.
■ Может быть полезным запрещать склонам заканчиваться “на полпути” (т.е. на ячейке {4, 7}). Это ограничение использовано в Mega Man X и многих других играх. Если этого не сделать, вы можете столкнуться с более сложными ситуациями, при которых игрок будет пытаться забраться с нижней стороны ячейки спуска. Эти ситуации решаются, например, путём предварительной обработки уровня с отметкой всех подобных конфликтных ячеек. При определении столкновения, задайте дополнительное условие: нижняя координата Y игрока должна быть больше (ниже на оси) чем выступающий край ячейки (tileСoord * tileSize + floorY).
■ Обычная ячейка-препятствие, смежная с ячейкой наклона, на которой игрок располагается в данный момент времени не должна считаться препятствием, если она непосредственно соединяется с наклоном, т. е. если персонаж (а именно его нижний средний пиксель) располагается на ячейке склона типа {0, *}, пропускайте ячейку слева, а если на {*, 0} – пропустите ячейку справа. Возможно, вам потребуется применить это для большего числа ячеек, если ширина персонажа больше, чем 2 ячейки – можно просто пропустить целый ряд, если игрок движется к верхней части склона. Это делается для того, чтобы игрок не застревал в ячейках (на рисунке подсвечены жёлтым) в процессе движения вверх по склону, так как его нога продолжит быть на “поверхности” на момент контакта с твёрдой ячейкой.

Для вертикального движения:

■ Если движение вниз по склону осуществляется за счёт гравитации, убедитесь, что минимальное гравитационное смещение совместимо со скоростью движения собственно по склону и по горизонтали. К примеру, на склоне 4:1, как в случае с ячейкой {4, 7}, гравитационное смещение должно составлять по меньшей мере 1/4 от горизонтальной скорости (если округлить), а на склоне 2:1 (ячейка {0, 7}) – как минимум половину. Если этих значений не задавать, игрок некоторое время после схода с выступа продолжит двигаться по горизонтали, пока гравитация его не спустит вниз. Это приведёт к тому, что игрок будет скакать по уклону, вместо того чтобы плавно спускаться по нему;
■ Как альтернатива гравитации, можно высчитать, на сколько пикселей выше уровня пола игрок находился до начала движения, и на сколько это значение изменилось после. Затем следует отрегулировать позицию игрока так, чтобы эти значения совпадали. Для вычислений можно использовать формулу из следующего пункта.
■ При движении вниз, вместо верхнего края тайла за границу соприкосновения должна быть принята нижняя координата тайла на данной вертикали. Для вычисления этой координаты, определите значение между , представляющее собой позицию игрока вдоль ячейки (0 = лево, 1 = право), затем используйте её чтобы линейно интерполировать значения floorY. Програмный код будет иметь примерно следующий вид:
float t = float (centerX – tileX) / tileSize;
float floorY = (1-t) * leftFloorY + t * rightFloorY;
■ При движении вниз, если есть несколько ячеек с общей координатой Y (например персонаж находится между спуском и обычным твердым тайлом) , то создайте столкновение со склоном и игнорируйте все прочие, даже если другие ячейки ближе. Это обеспечит должное поведение игрока возле краёв склонов: он будет «проваливаться» в фактически твёрдую ячейку из-за того, что тут начинается склон.

Односторонние платформы

Super Mario World : Слева Марио проходит сквозь одностороннюю платфому , справа стоит на ней же .

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

■ По оси Х ячейка не является «твёрдой» никогда;
■ По оси Y ячейка является препятствием только в том случае, если до начала движения игрок целиком находился над ней, т. е. нижняя координата игрока располагалась как минимум на один пиксель выше верхней координаты односторонней платформы. Чтобы обеспечить это условие, желательно сохранить начальную позицию игрока перед началом движения.

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

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

Лестницы (вертикальные )

Mega Man 7: видны границы ячеек , подсвечены ячейки лестниц и «лестничный» хитбокс игрока (в красной рамке ).

Лестницы могут показаться сложными для реализации, но они попросту представляют собой другое состояние персонажа: будучи на лестнице, игроком игнорируется практически вся система столкновений, и вместо неё вводится новый набор правил. Обычно, ширина лестницы – одна ячейка.

Переход в «лестничное» состояние возможен следующими путями:

■ Хитбокс игрока пересекает лестницу на уровне пола или в полёте, игрок нажимает клавишу «вверх» (в некоторых играх переход возможен также по нажатию клавиши «вниз»);
■ Персонаж стоит на верхней «лестничной» ячейке (которая чаще всего по сути является односторонней платформой, чтобы по ней можно было пройтись сверху), игрок нажимает «вниз».

Таким образом, возникает эффект моментального совмещения x-координаты игрока с лестницей. Для движения вниз с верхушки лестницы нужно переместить y-координату персонажа так, чтобы игрок оказался внутри лестницы. В некоторых играх для таких ситуаций вводится альтернативный хитбокс, отслеживающий позицию игрока в пределах лестницы. К примеру, в Mega Man, он представляет собой единичную ячейку, совпадающую с верхней ячейкой спрайта персонажа.

Покинуть лестницу можно следующими способами:

■ Игрок достигает верха лестницы. Здесь обычно включается особая анимация, при которой игрок перемещается на несколько пикселей вверх по оси Y и оказывается над лестницей в стоячем положении;

■ Игрок достигает низа висячей лестницы. В этом случае игрок попросту падает, хотя в некоторых играх это не допускается;

■ Игрок движется влево или вправо. Если нет препятствий, игрок сходит с лестницы в соответствующем направлении;

■ Игрок прыгает. В некоторых играх позволяется отпустить лестницу таким образом.

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

Лестницы (наклонные )

Castlevania: Dracula X. Видны границы ячеек .

Данный тип лестниц встречается редко. В основном, наклонные лестницы присущи играм серии Castlevania. Их реализация во многом совпадает с реализацией обычных лестниц, за некоторыми исключениями:

■ Шаг игрока составляет либо целую ячейку, либо половину ячейки (как в Dracula X);
■ Во время каждого «шага» по лестнице, игрок смещается одновременно по обеим осям на заранее заданное значение;

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

Движущиеся платформы

Super Mario World

Движущиеся платформы довольно просты в реализации, хотя сначала может показаться иначе. В отличие от обычных платформ, они, очевидно, не могут быть представлены фиксированными ячейками. Вместо этого они должны являть собой прямоугольник типа ABBA (тот, который не вращается). С точки зрения определения соприкосновений, эти платформы по сути – обычные препятствия, но если не ввести определённые изменения, они будут очень «скользкими» (т. е. двигаться, постоянно выползая из-под персонажа).

Для решения этой проблемы существует несколько путей. Рассмотрим такой алгоритм:

■ Перед тем как что либо сдвинуть на карте, задайте условие, при котором игрок считается находящимся на движущейся платформе. Пускай программа следит за тем, чтобы, например, нижний средний пиксель персонажа располагался ровно на один пиксель выше поверхности платформы. Если это условие соблюдается, сохраните указатель на платформу и её позицию в персонаж
■ Сдвиньте все движущиеся платформы на один шаг. Обязательно сделайте это перед тем, как будете двигать персонажей и другие объекты;
■ Для всех персонажей, стоящих на движущейся платформе, определите дельта-положение платформы, т. е. полное перемещение, совершённое ей по каждой оси. Затем, переместите персонажа в соответствии с этим значением;
■Передвигайте персонажей дальше как обычно.

Другие особенности

Sonic the Hedgehog 2

Есть игры, в которых применены гораздо более сложные и уникальные техники, и особенно в этом плане выделяется серия Sonic the Hedgehog. Эти приёмы выходят за рамки данной статьи, но могут послужить материалом для будущих.

Тип #3: Битовая маска

Похож на предыдущий, только для определения столкновения используются не крупные тайлы, а пиксели. Такая техника позволяет улучшить детализацию, но при этом увеличивается сложность исполнения и использование памяти. Редактор уровней больше напоминает какой-нибудь paint. Часто для создания графики тайлы не используются, поэтому для каждого уровня могут требоваться большие, замысловатые, индивидуальные изображения. В связи со всем этим, данная техника не является распространённой, но с её использованием можно добиться более качественных результатов, по сравнению с типами, основанными на ячеистом принципе. Она также подходит для создания динамичного окружения, такого как разрушаемая местность в Worms – в битовой маске можно «рисовать», и тем самым изменять модель уровня.

Игра Worms World Party с разрушаемой местностью

Примеры: Worms, Talbot’s Odyssey

Как это работает

Базовые принципы схожи с описанными для типа «основанный на плитках со сглаживанием» – можно просто каждый пиксель считать за тайл (шириной 1px), применить точно такой же алгоритм и всё будет работать как надо, за одним лишь важным исключением – склоны. Так как склоны теперь косвенно определяются расстановкой близлежащих ячеек, методы, описанные выше не работают, и возникает необходимость в применении более сложного алгоритма. С другими моментами, вроде лестниц, здесь тоже сложней.

Склоны

Talbot s Odyssey: поверх изображния наложена битовая маска столкновений .

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

Приведу в общих чертах алгоритм, изпользуемый в Talbot’s Odyssey:

■ Найдите растояние, на сколько нужно сместиться по каждой оси;
■ Шаги нужно проводить по каждой оси отдельно, начиная с той, на которой наибольшее смещение;
■ Для движения по горизонтали, ограничивающий прямоугольник игрока (AABB) нужно сместить на 3 пикселя вверх(чтобы он смог забираться на склоны);
■ Выполните проверку столкновений, сверяясь со всеми препятствиями и самой битовой маской, и определите, на сколько пикселей персонаж может продвинутся, прежде чем столкнуться с чем-либо. Передвиньте его на эту новую позицию;
■ Если движение шло по горизонтали, передвиньтесь вверх на столько пикселей сколько необходимо (обычно, не больше 3-х) чтобы компенсировать склон;
■ Если в конце движения хотя бы один пиксель игрока накладывается на препятствие, отмените движение по этой оси;
■ Независимо от исполнения предыдущего условия, примените алгоритм для второй оси.

В этой системе не проводится различий между движением вниз в результате спуска и в результате падения, поэтому вам может потребоваться счётчик кадров. Он определяет, сколько кадров должно пройти с момента последнего касания игроком поверхности пола, чтобы персонаж смог прыгнуть или сменить анимацию. В Talbot это значение равно 10-ти кадрам.

Также трудность представляет точный расчёт количества пикселей, на которое может продвинуться персонаж, прежде чем коснуться чего-либо. Могут быть и другие усложняющие факторы, такие как односторонние платформы (см. «плитки со сглаживанием») и скольжение вниз по крутым склонам (довольно сложно и за рамками данной статьи). В целом, эта техника требует точной настройки, отладки, и по своей природе является менее стабильной, чем подходы с использованием тайлов. Я могу порекомендовать её лишь в том случае, если вам в вашей игре действительно не обойтись без детализированной местности.

Тип #4: Векторы

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

Braid (редактор уровней) с видимыми слоями (наверху) и …полигонами (внизу)

Как это работает
Есть два основных способа этого достигнуть:
1. Движение и столкновения реализуйте способом похожим на битовую маску, но используя при этом многоугольники, чтобы вычислять отклонения и получать правильный наклон.
2. Используйте физический движок (например, Box2D)
Очевидно, второй способ более распространенный (хотя я подозреваю, что Braid первый), потому что он проще и позволяет делать различные вещи с динамикой в игре.
К сожалению, приходится быть очень внимательным, когда идешь этим путем, чтобы не превратить игру в обычный физический платформер.

Составные объекты

Этот подход имеет свои проблемы. Иногда бывает трудно определить, стоит игрок на полу (из-за ошибок округления), ударяется о стену или скользит вниз по крутому склону. При использовании физического движка трение может стать проблемой, если захотите усилить его у ног и ослабить по бокам.

Существуют различные способы решения этой проблемы, но наиболее популярным решением является разделение персонажа на несколько разных многоугольников: так, помимо туловища, у вас будет узкий прямоугольник для ступней и два узких прямоугольника для боков, еще один для головы или другая подобная комбинация. Иногда им придают коническую форму, чтобы избежать препятствий. У них разные физические свойства, и функции определения пересечений движка в данном случае используются для определения состояния персонажа. Для получения дополнительной информации могут быть использованы датчики (несталкивающиеся предметы, используемые только для проверки наличия перекрытий). К ним можно прибегнуть, чтобы определить достаточно ли близко к полу мы находимся для прыжка или персонаж упирается в стену и т.д.

Общие положения
Независимо от выбранного Вами типа (за исключением, пожалуй, типа 1#), к ним применимы несколько общих положений.

Ускорение

Super Mario World (низкое ускорение), Super Metroid (среднее ускорение), Mega Men 7 (высокое ускорение)

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

Ускорение – это скорость изменения скорости. Если оно низкое, персонаж долго разгоняется или долго тормозит, когда игрок отпускает кнопку. Это делает движение персонажа «скользящим», что создает сложности для играющего. Такое движение обычно ассоциируется с серией игр Super Mario. Когда ускорение высокое, персонаж разгоняется до максимума за считанные секунды (либо моментально) и так же быстро останавливается, что приводит к очень быстрому, «дерганому» управлению джойстиком, как, например, в Мега Мэн. Полагаю, что в Мега Мэн на самом деле используется неограниченное ускорение, т.е. вы либо бежите на полной скорости, либо стоите на месте.

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

Как это работает

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

1. Определите скорость xTargetSpeed. Она должна быть 0, если игрок не нажимает кнопок джойстика, -maxSpeed если нажата кнопка «Влево» или +maxSpeed если нажата кнопка «Вправо».
2. Определить значение yTargetSpeed. Оно должно быть 0, если игрок стоит на платформе. В противном случае +terminalSpeed.
3. Для каждой оси увеличить текущую скорость до заданной, используя либо среднее взвешенное, либо добавочное ускорение.

Два вида ускорения:
Среднее взвешенное: число (“a”) от 0 (без движения) до 1 (мгновенное ускорение).
Используйте это значение для вставки между заданной и текущей скоростью, а результат установите как заданную скорость.

vector2f curSpeed = a * targetSpeed + (1-a) * curSpeed;
if (fabs(curSpeed.x) < threshold) curSpeed.x = 0;
if (fabs(curSpeed.y) < threshold) curSpeed.y = 0;

Добавочное ускорение: Мы определим, в каком направлении добавить ускорение (используя функцию sign, которая возвращает 1 если аргумент больше нуля и -1 если меньше), затем проверим, не вышли ли мы за рамки.

vector2f direction = vector2f(sign(targetSpeed.x – curSpeed.x), sign(targetSpeed.y – curSpeed.y));
curSpeed += acceleration * direction;
if (sign(targetSpeed.x – curSpeed.x) != direction.x)
curSpeed.x = targetSpeed.x;
if (sign(targetSpeed.y – curSpeed.y) != direction.y)
curSpeed.y = targetSpeed.y;

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

Когда персонаж натыкается на препятствие, лучше всего снизить его скорость до нуля.

Контроль прыжков


Super Metroid, Самус выполняет «Космический прыжок» (с использованием Screw Attack)

Возмность прыжка в игре-платформере сводиться к определению стоит ли игрок на земле (или, то что он был на земле последние n кадров). В таком случае персонажу задается отрицательная начальная скорость y speed (соответствует физическому термину «импульс»), остальное – дело гравитации.

Существуют четыре основных способа управления прыжками:

1. Импульс : используется в таких играх, как Super Mario World и Sonic the Hedgehog. Прыжок сохраняет импульс (на игровом жаргоне скорость), который был у персонажа до него. В некоторых играх это единственный способ повлиять на дугу прыжка – совсем как в реальной жизни. Здесь специально реализовавыть ничего не надо.
2. Воздушное ускорение : сохранение контроля над горизонтальным движением в воздухе. В реальности это невозможно, но в играх эта функция очень популярна, так как делает персонажа более управляемым. Она есть почти в каждом платформере, за исключением игр вроде Принца Персии.
Как правило, в воздухе ускорение значительно снижается, так что важен импульс, но некоторые игры предоставляют вам полный воздушный контроль. Обычно это осуществляется как настройка параметра ускорения, в то время когда вы находитесь в воздухе.
3. Контроль подъема : еще одно физически невозможное, но чрезвычайно популярное действие, т.к. предоставляет больший контроль над персонажем. Чем дольше вы удерживаете кнопку прыжка, тем выше персонаж прыгает. Обычно это осуществляется постепенным добавлением импульса персонажу (хотя импульс может также постепенно уменьшаться) или сопротивлением гравитации, пока удерживается кнопка. Накладывается ограничение по времени, если вы не хотите, чтобы персонаж прыгал бесконечно.
4. Многократные прыжки : в некоторых играх подпрыгнувшему игроку позволяется прыгнуть еще раз, возможно, неограниченное (как в Прыжке в Космос в Super Metroid или в полете в Одиссее Талбота) или ограниченное количество раз до того, как он коснется земли («двойной прыжок» – самый распространенный вариант). Это может быть достигнуто при помощи счетчика, который увеличивает значение на единицу после каждого прыжка и уменьшает, когда вы стоите на земле (будьте осторожны, когда обновляете его, иначе вы можете сбросить его сразу после первого прыжка). Дальнейшие прыжки возможны, если показания счетчика низкие. Иногда второй прыжок короче начального. Могут применятся другие ограничения – Прыжок в Космос возможен только после того, как вы выполнили вращательный прыжок и начали падать.

Анимация и управление

Black Thorne, анимация персонажа замедляется перед выстрелом назад (кнопка Y)

Во многих играх анимация вашего персонажа будет проигрываться до реального выполнения требуемого действия, во всяком случае, в играх, основанных на резких движениях. Это разочарует игроков, поэтому НЕ ДЕЛАЙТЕ ЭТОГО! Вам следует ставить на первое место анимацию, когда речь идет о прыжках и беге, но если вам не все равно, ограничьтесь такой анимацией, чтобы само действие происходило независимо от анимации.

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

· Используйте числа с плавающей запятой (тип float) для всех расчетов и хранения данных положения, и подводите итог в целых числах всякий раз, когда вы визуализируете изображение или рассчитываете коллизии. Быстро и просто, но при удалении от (0,0) начинает теряться точность. Это, вероятно, не имеет значения, если у вас очень большое игровое поле, но об этом следует помнить. В противном случае используется тип double.

· Используйте числа с фиксированной запятой для всех расчетов и положения и снова подведите итог в целых числах, когда визуализируете изображение или рассчитываете коллизии. Менее точный, чем float и с более узким диапазоном формат, но в этом случае точность всегда одна и та же, а на некоторых устройствах работа с ним протекает быстрее (особенно медленно работа протекает с числами с плавающей запятой на мобильных устройствах).

· Храните данные о положении в виде целых чисел, но держите «остаток» в типе float. Рассчитайте дельта-движение как число с плавающей запятой, приплюсуйте к нему остаток, затем целую часть добавьте к положению, а дробную – к полю «остаток». В следующем кадре к остатку будет добавлено значение. Преимущество этого метода в том, что вы используете целые числа везде, кроме расчета движения, что гарантирует отсутствие сложностей с плавающей запятой и повышает производительность. Этот способ также подойдет, если в вашем фреймворке положение объекта должно быть выражено целым числом, или если float, но это же положение используется для отрисовки на экран. В этом случае вы можете хранить только целочисленные значения, чтобы отрисовка всегда выравнивалась по пикселям.

Unity одинаково подходит для создания как 2D так и 3D игр. Но в чём отличие? Когда вы создаёте новый проект, вам предоставляется выбор: начать в режиме 2D или 3D. Вероятно, вы можете заранее знать, что именно хотите создать, но есть несколько тонких нюансов, которые могут повлиять на то, какой режим выбрать.

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

Полноценное 3D

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

Ортографическое 3D


Иногда игры используют 3D графику, но при этом применяют ортографическую камеру вместо перспективы. Эта технология используется в играх, где отображение происходит с высоты птичьего полёта, обычно такие игры называются “2.5D”. Если вы создаёте игру подобную этой, вы должны так же использовать редактор в 3D режиме, так как несмотря на отсутствие перспективы, вы будете по прежнему работать с 3D моделями и ассетами. Вам нужно будет лишь переключить ваши камеру и вид сцены в режим Orthographic . (выше приведены сцены от Synty Studios и BITGEM)

Полноценное 2D


Многие 2D игры используют плоскую графику, иногда именуемую спрайтами, которая в принципе не имеет трёхмерной геометрии. Спрайты отображаются на экране как плоские картинки, а камера при этом не имеет перспективы. Для таких игр вам следует выбрать режим 2D .

2D геймплей с трёхмерной графикой


Некоторые игры используют трёхмерные модели для персонажей и окружения, но при этом ограничивают геймплей двумя измерениями. Например: камера может использовать “боковое скольжение”(“side scrolling view”) и игрок может двигаться только в двух измерениях, но игра по прежнему использует трёхмерные модели в качестве препятствий, а камера имеет перспективу. Для таких игр 3D выполняет скорее стилистическую роль, нежели функциональную. Такой тип игр так же иногда называют “2.5D”. Хотя геймплей и двухмерный, вы всё равно будете управлять трёхмерными моделями, поэтому для создания такой игры следует выбирать режим 3D .

2D геймплей и графика с использованием перспективной камеры


Двухмерный стиль игры “Картонный театр” создающий эффект параллакса при движении

Это ещё один популярный стиль двухмерных игр, использующий 2D графику, но с перспективной камерой, чтобы создать эффект параллакса (смещения) при движении. Это сцена в стиле “Картонный театр”, где вся графика является двухмерной, но она расположена на разном расстоянии от камеры. Наиболее вероятно, что для такой игры вам подойдёт режим 2D , однако в вашей игре нужно будет переключить режим камеры на перспективную(Perspective ) и отображение сцены в 3D режим. (представленная выше сцена принадлежит One Point Six Studio)

Другие стили

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

Полезная информация о 2D проекте

Какой бы тип проекта вы не выбрали, 2D или 3D, вот несколько полезных страниц, которые помогут вам начать Есть так же много конкретных страниц именно по особенностям 2D

Начало работы с Unity

Обзор 2D

2D графика

2D Физика

  • Физика - Введение в 2D и 3D физику в Unity.
  • Rididbody 2D - Размещение игрового объекта под управлением физического 2D движка.
  • Physics 2D Manager - Управление глобальными настройками для двухмерной физики.

Из этой статьи вы получите общие представления, как рисовать крутую 2D графику для игр. Это не пошаговый туториал, это что-то в разы более крутое!

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

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

Список тем:

  • Формы
  • Анатомия и пропорции
  • Перспектива
  • Наука о цвете
  • Освещение и затенение
  • Оттачивание навыков

Если эти пункты не схватили вас за живое, наглядная демонстрация ваших способностей «до» и «после» идет ниже:

Факт из интернета!

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

В повседневной жизни мы привыкли часто видеть 2D изображения. Но понимать, что вещь выглядит красиво, не то же самое, что знать, почему это так. Любое двумерное изображение можно разбить на базовые элементы, поэтому вы можете представлять себе создание двумерной графики как объединение этих элементов, чтобы: 1) Получилось похоже на то, что вы имели ввиду; и 2) Не было супер уродливо. Например, мы все знаем, как выглядят квадрат и сфера, но какое отношение это имеет к созданию понятного на вид персонажа?

Чтобы ответить на это, мы приступаем к первой части:

Формы

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

Начинайте с самых простых форм: кругов, квадратов и прямоугольников. Попробуйте нарисовать персонаж, состоящий только из квадратов или только из треугольников, а затем посмотрите, кто из них будет больше похож на героя, а кто – на злодея. Сохраняя свои первоначальные задумки в виде зарисовок с простыми фигурами, вы сможете генерировать много идей, преждевременно не отвлекаясь на проработку деталей (об этом много говорится в части «Оттачивание навыков»).

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

Перспектива

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

Геометрическая перспектива

В большинстве 2D игр создатели просто не желают связываться с геометрической перспективой, потому что ее реалистичная реализация в графике будет безумно трудоемкой. Чтобы пойти легким путем, разработчики пользуются нереалистичным предположением, что сбоку все видно одинаково хорошо (как в классическом платформере Super Mario), или разворачивают графику в более реальной на вид, но все же далекой от реальности изометрической проекции.

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

Еще больше впечатления внушил бы несущийся навстречу поезд

Вы обратили внимание как сходятся параллельные линии (реальные и воображаемые)?

Можно добавить еще больше красных линий, но и так все понятно

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

Точка схода и линия горизонта по своей сути воплощают простую идею: предметы, которые находятся вдали, выглядят меньше предметов, которые ближе к нам. А приближенная к нам сторона предмета кажется больше, чем удаленная. В приведенном выше примере использована только одна точка схода, но на самом деле на картине будет столько точек схода, сколько присутствует наборов параллельных линий – для каждого своя. Звучит слишком сложно? Так и есть, поэтому в рисунках перспектива обычно упрощается до одно-, двух- и трехточечной. В одно- и двухточечной перспективе предполагается, что один или несколько наборов параллельных линий остаются параллельными навсегда и никогда не сходятся. Вот пример куба и параллелепипеда в одноточечной перспективе:

Карандаш и бумага… А вы на что надеялись?

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

Изображая объекты в перспективе, часто принято прорисовывать их обратную сторону, чтобы лучше почувствовать трехмерность

Здесь прежде параллельные горизонтальные линии обрели свою точку схода. Вертикальные грани остаются параллельными. Наконец, трехточечная перспектива:

В трехточечной перспективе объект выглядит эпично, по крайней мере, с точки зрения высоты

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

Для рисования трубок и других круглых предметов в правильной перспективе существует важная хитрость, потому что в перспективе круг деформируется особым образом. Когда на них смотрят наклонно, круги выглядят как эллипсы. Чем больше наклон, тем сильнее сжат эллипс:

Круг превращается в эллипс

Вот простое правило. Когда вы смотрите на край цилиндра (например, крышу круглого здания), кривая выгибается вверх. Когда вы смотрите вниз, например, на основание ствола дерева, кривая выгибается вниз. Через середину этого изображения проходит линия горизонта.

Чтобы показать объем фигур, их следовало бы заштриховать, но мы оставим так

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

Ракурс

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

Грубо, но понятно

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

Цилиндры рисовать проще, чем людей

Помните, что персонажи, в особенности человеческие, могут быть представлены как ряд более простых объектов, которые легче скомпоновать. Это нормально, когда набросок фигуры делают в виде соединенных суставами цилиндров, а внутри них потом рисуют человека.

Перекрытие и параллакс

С перекрытием все просто: ближайшие к нам объекты будут накладываться на отдаленные и скрывать их. Весьма необходимая вещь для 2D игр, поскольку это самый простой способ показать игроку его позицию по отношению к объектам. Давайте рассмотрим чрезвычайно простой пример:

Картинка вошла в историю как странные холмы на фоне всех игр серии Super Mario

Этот набор линий создает у вас впечатление, что маленькая круглая штучка справа (куст?) находится перед остальными, а самая большая – позади. Эффект иногда называют «T-правилом», поскольку пересечение линий объектов впереди и позади образует нечто наподобие буквы T. Это просто, но довольно мощно. В приведенном примере все Т перевернуты вверх ногами:

Ветераны программирования могут вспомнить про ASCII 193

Параллакс – еще один важный эффект перспективы, связанный с отношениями перекрывающихся объектов. Его суть в том, что при движении зрителя далекие объекты смещаются меньше по сравнению с более близкими. Параллакс отлично подходит для 2D игр, потому что его довольно легко реализовать, и вы, несомненно, сталкивались с ним. Достаточно информации для начала можно почерпнуть из вот этой статьи в Википедии.

Поскольку 2D игры часто преднамеренно нарушают обычные правила перспективы по той простой причине, что их легче нарисовать без них, приходится полагаться на другие способы получить представление о глубине. Еще один из простых способов – делать объекты, предположительно удаленные от зрителя, более размытыми и менее подробными на вид. Вот пример из реальной жизни, на фотографии городского пейзажа промышленного Китая:

Городской смог во всей красе

Вы также можете заметить эффект геометрической перспективы, хотя в данном случае основная точка схода будет слева от кадра. Почти каждый 2D-платформер, когда-либо созданный, использует воздушную перспективу. Например (снова Super Mario World):

А также перекрытие и параллакс

Обратите внимание, что чем дальше на фоне находится объект, тем более размытым он выглядит. О близости объекта к игроку можно сказать даже только по цвету контуров. Это непосредственно сводится к идее контраста. Контраст расскажет игроку, что важно, а что нет.

Посмотрите снова на скриншот из Super Mario World. Слегка затененные голубые холмы? Не важно. Труба с белым бликом и черными контурами? Важно. Единственный ярко-красный предмет на экране? Супер важно. Помните, что интерактивные объекты в игре должны всегда выделяться по отношению к не интерактивным, если нет конкретной причины скрывать что-то от игрока.

Линейная и воздушная перспектива на ArtyFactory.com , Тьюториал от perspective-book.com

Наука о цвете

Цвет – это хитрая тема, и одна из наиболее субъективных в искусстве в целом. На цвет товарища нет, а цветовые сочетания и их значения различаются в разных культурах. Белый цвет может быть цветом чистоты на Западе, но в Японии он часто означает смерть. Тем не менее, есть несколько основных идей относительно цвета, которые помогут вам понять, что происходит с вашей графикой. Давайте для начала подумаем о том, из чего состоит определенный цвет.

Оттенок, насыщенность, яркость

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

Начнем со сравнения двух цветов:

Красный и синий

Красный и синий. Понятно, что это разные цвета, не так ли? Но на самом деле есть более точный термин Оттенок (Hue). Левый квадрат имеет красный оттенок, а правый имеет синий оттенок. Другие оттенки включают зеленый, оранжевый, фиолетовый и т. д. Хотя оттенок может показаться избыточным термином для определения цвета, это не так, потому что количество любого оттенка в цвете может измениться:

Красный и бледно-красный

Итак, перед вами два красных цвета, но чем они отличаются? Тот, что справа, как бы слегка… выцвел. У него меньшая Насыщенность (Saturation).

Насыщенность обозначает, насколько много цвета в цвете, или какой у него оттенок. О насыщенности можно думать, как о количестве серого в данном цвете. Нет серого – насыщенный цвет. Много серого – ненасыщенный. Так что в данном случае квадрат слева является полностью насыщенным, а справа – менее насыщенным. Чистый серый цвет – это просто цвет без насыщения. Насыщенность самое хитрое из свойств цвета, на котором может подскользнуться новичок. Просто имейте в виду, что насыщение оказывает большое влияние на атмосферу вашей графики. Высоко насыщенные цвета при использовании в больших количествах имеют тенденцию выглядеть более дружелюбно, а ненасыщенные цвета связаны с серьезным стилем.

Последнее свойство – Яркость (Brightness). Иногда вместо него используют Значение (Value). Яркость намного проще в понимании: показывает, насколько цвет ярче. Вот такой же красный, как выше, и его менее яркая (т.е. темная) версия:

Красный и темно-красный (менее яркий)

В связи между яркостью и насыщенностью надо немного разобраться:

Эти свойства можно изменять одновременно

Вот пример как цвет может влиять на атмосферу игры. Сравниваются New Super Mario (если вам уже надоели примеры из старого) и Castlevania: Lords of Shadow.

Также обратите внимание, что от Марио не полетели кровавые ошметки, когда он наступил на гриб

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

Говоря о цвете, мы можем снова вспомнить про… Барни и Годзиллу! Подумайте, как цвет делает их такими разными с точки зрения оттенка, яркости и насыщенности, и что произойдет, если одно или несколько из этих свойств изменить. Что произойдет, если вы возьмете только одно свойство, и наделите им обоих персонажей? По-прежнему ли вам хочется обнять серого Барни?

Вкратце про RGB

Примите поздравления! Теперь вы разбираетесь в цветовой модели HSB (Hue Saturation Brightness/Тон Насыщенность Яркость) или HSV (Значение = Яркость). Практически любая программа для обработки изображений пользуется этим термином наряду с RGB (цветовая модель Красный Зеленый Синий) и CMYK (Голубой Пурпурный Желтый Черный). Но HSB, по всей видимости, проще всего объясняет, что происходит с цветами. Особенно в отношении того, насколько ярким или насыщенным является нужный вам цвет когда вы работаете над шейдингом. Однако в разных приложениях вам придется иметь дело с цветовой моделью RGB , поэтому кратко рассмотрим и ее. RGB попросту описывает все цвета с точки зрения красного, зеленого и синего, так как все цвета можно описать как комбинацию этих трех. Аналогичным образом информацию о цвете обрабатывает человеческий глаз. Потратьте немного времени, чтобы поиграть с цветовыми значениями и увидеть, как изменяются значения HSB и RGB, и как они связаны друг с другом. Вот стандартная диаграмма RGB (обратите внимание, что происходит, когда цвета перекрываются):

Также известна как аддитивная цветовая модель, поскольку цвета создаются путем добавления света, а не его поглощения (как в субтрактивной модели)

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

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

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

Типичное цветовое колесо

Оттенки также обычно подразделяются на теплые и холодные, в терминах цветовой температуры. Причем красно-желтые цвета считают теплыми, а синие цвета прохладными, как показано ниже:

Занимательный факт. Чтобы показать жару в кадре, в фильм «Делай как надо» (1989) режиссер добавил больше оранжевого тона

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

Другие отношения между цветами также можно объяснить при помощи цветового колеса. Аналогичные цвета – это просто оттенки рядом друг с другом, такие как зеленый, желтый и цвета между ними. Контрастные цвета – это цвета (оттенки) на 180 градусов отстоящие друг от друга, которые кажутся более яркими при использовании вместе. Вероятно, вы видели их в действии, даже если не знали почему. Синий и оранжевый даже стали тропом (стандартным стилистическим приемом).

Если вы используете Firefox, посмотрите на иконку. Снова синий и оранжевый!

При работе над игровой графикой попробуйте связать цвета с определенными расами или врагами, средами или уровнями. Обозначение цветом не является обязательным, однако вы можете использовать его как способ влияния на восприятие игроков. Подумайте о наборе цветов для плохих парней, но используйте, например, уникальные оттенки этих цветов для конкретных врагов. Не бойтесь экспериментировать и старайтесь использовать более редкие цвета. В любой достаточно продвинутой программе для обработки изображений (например, в GIMP) цвет изменить проще, чем любое другое свойство. Это одна из немногих вещей, которые можно легко изменить в готовом рисунке.

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

Рекомендуем изучить (на английском): Теория цвета для дизайнеров

Освещение и затенение

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

Источники света

Начинающие художники часто не понимают, зачем на самом деле рисуют свет и тень. Затенение (или шейдинг) рисунка обычно означает применение разных оттенков, чтобы создать иллюзию света на чертеже, точно так же, как перспектива – это иллюзия глубины. И точно так же как с перспективой, вам необходимо создать какие-то 2D аналоги видимых в реальности эффектов. Тут есть только одно правило: свет должен откуда-то исходить. Он не может быть везде, поэтому если вы просто раскрасите рисунок, это будет выглядеть неправильно. Когда новички пытаются нарисовать тень, но не понимают как, это приводит к объектам, которые выглядят вот так:

Серьезно, так делать не надо

Сравните с вариантом без теней:

Лучше оставить так, чем как было выше

Это называется подушечным затенением, и его очень просто нарисовать не задумываясь. Кажется естественным оттенить предметы по внешним контурам… но это выглядит абсолютно ненатурально. Чтобы освещение выглядело правильно, оно должно иметь направление, и освещение/затенение поверхности нужно выстраивать в зависимости от того, с какой стороны на объект направлен источник света. Источником света может выступать солнце, лампа, озеро с кипящей лавой и т.д., или его можно оставить абстрактным.

Например, вы можете просто предположить, что почти весь свет падает от бесконечно удаленного источника под углом 45 градусов. Этого достаточно, чтобы красиво оттенить объекты в большинстве случаев. Анимированным спрайтам, которые будут использоваться на различных фонах, небольшая неопределенность помогает сохранить везде уместный вид.

Вот пример с источником света в верхнем левом углу:

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

Обращенные к источнику света части будут светлее, а противоположные им – темнее. Что может быть проще? Но это не всегда именно так…

Плоские и изогнутые поверхности

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

Американский бомбардировщик F-117. Плоские поверхности

Более привычный на вид F-15. Изогнутые поверхности

Снова вернемся к параграфу о формах. Кто из этих плохих ребят покажется вам хорошим, а кто насторожит вас одним внешним видом?

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

Источник света для куба и сферы не совсем одинаков. В чем разница?

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

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

Такой шейдинг позволяет лучше почувствовать объем

Еще пара цифровых примеров на ту же тему.

Если бы сферы находились на голубой поверхности, отраженный свет имел бы голубой оттенок

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

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

Наиболее часто с изменением тона можно встретиться у объектов, которые освещаются солнцем. Прямой солнечный свет имеет желтый тон, но голубое небо отражает на тени свой цвет, поэтому мы получаем желтые блики и тени голубого тона.

Вспомним про теплые и холодные цвета. Блики имеют теплый оттенок, а тени – холодный

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

Если использовать оттенки слишком много, игра будет напоминать Instagram

Стоит знать еще, что тени быть менее насыщенными, и что менее насыщенные цвета могут казаться более темными, чем они есть на самом деле.

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

Шейдинг и текстурирование

Шейдинг может подсказать не только форму объекта, но и его текстуру. Текстура объекта влияет на то, как от него отражается свет. Поэтому изменяя шейдинг вы иногда можете изменить впечатление от текстуры. Чтобы различать некоторые типы текстур существуют свои термины:

Это когда-нибудь пригодится вам при покупке краски для ремонта

От поверхности с глянцевой текстурой свет отражается хорошо и с очень небольшим рассеянием. Это означает, что освещенная часть предмета будет очень яркой (из-за хорошего отражения), а неосвещенная – очень темной (потому что дополнительная подсветка идет от рассеянного света, а его нет). Хорошим примером глянцевой текстуры является только что отполированный кузов автомобиля.

Матовая текстура отражает не очень хорошо и рассеивает свет при отражении. Это означает, что она кажется более ровно освещенной. Хорошим примером поверхности с матовой текстурой служит старая автомобильная шина.

Гладкая текстура стоит где-то посередине. Она хорошо отражает, но сильно рассеивает свет при отражении. Гладкую текстуру часто имеет пластик, например, большинство компьютерных клавиатур.

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

Короче говоря: Чтобы 2D графика смотрелась достоверной, свет должен иметь направление.

Оттачивание навыков

Что делать теперь, когда изложены все основы? Вперед! Начинайте пробовать! Это правда: рисовать может любой. Конечно, у некоторых людей есть больше навыков, но самая большая разница между плохим художником и хорошим – это то, насколько много они практиковались. Чем больше практики, тем лучше вы владеете навыком. Но практикуйтесь с умом. Отличную возможность для этого дают игровые проекты. Если вы мечтали о своей игре, начинайте делать наброски для нее параллельно читая эту статью.

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

Карандаш и бумага

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

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

Приобретите блокнот для зарисовок (на обложке написано sketchbook), карандаши и хорошую стирательную резинку. Резинкой вам придется пользоваться очень часто. А вот блокнот для зарисовок необязателен. Ключевая идея в том, что вам нужна практика, поэтому можете рисовать хоть на полях своей школьной тетрадки. Но в блокноте все работы будут в одном месте, поэтому не придется впоследствии жалеть, что самый удачный рисунок злодея оказался на листке с домашней работой.

Наброски (они же скетчи)

В карандашных набросках лучше считать, что все линии – лишь временные предположения, а не окончательный вариант. Не попадайте в зависимость от своих линий. Рисуйте поверх, стирайте и рисуйте снова без оглядки на то, что уже есть. Конечно, для этого надо делать линии достаточно легкими. Начинайте с основной формы вашего объекта и постепенно добавляйте детали. Большинство объектов можно аппроксимировать основными формами, то есть сферой, цилиндром и «коробкой», что особенно полезно для рисования в перспективе.

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

На этом видео отлично показано, как художник строит базовую структуру персонажа, накладывает грубые фигуры поверх, при этом все больше добавляет новые детали, а также стирает и снова рисует детали, которые выглядят плохо. А вот картинка из блокнота начинающего художника:

Типичный скетч

Черновик, черновик, опять черновик

Сначала это может казаться безумным, но вы должны набросать карандашом на бумаге хотя бы три версии любого персонажа/объекта/элемента меню. Только после этого можно переносить их для доработки на компьютер. Крупные студии часто создают буквально десятки концепций одного персонажа, прежде чем даже подумают о выборе. Набросок трех версий даже для неинтерактивных фоновых ресурсов, таких как деревья или кусты, – обычное дело. Вы сильно рискуете, если полагаетесь на первый вариант как на единственный и окончательный. Придумав три разных варианта, вы можете взять лучшее от каждого и объединить их в финале. Вот простой пример, где каждый из крутых космических шлемов отличается от окончательного варианта ниже (тот основан на еще более грубых ранних набросках):

Повторите раздел про анатомию и пропорции. Не зная строения черепа трудно придумать годный шлем

Верхняя штучка вообще-то должна отбрасывать тень на забрало

Если кажется, что следовать такому совету очень трудно, продолжайте помнить: вы рисуете грубые, очень грубые, грубейшие наброски. Не тратьте на них время. На самом деле в большинстве случаев чем меньше, тем лучше. Чем дольше вы работаете над вариантом, тем сложнее вам согласиться на его переделку или на создание другого варианта. Оставляйте в стороне детали, просто передайте общую идею и идите дальше. Вы всегда можете вернуться назад и проработать эскиз, если он вам понравился.

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

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

Заключение и дальнейшее чтение

Теперь вы знаете основы и полностью готовы к созданию приличной графики для 2D игр. Если вам интересно узнать больше по теме, то на протяжении статьи вы можете заметить ссылки на дополнительные источники. Сама же статья во многом основывается на книге Криса Соларски «Drawing Basics and Video Game Art». Вы можете прочитать некоторые из его сочинений . Дерзайте!

Оригинал статьи на английском языке: Total beginner guide for better 2d game art

P.S.

В первой главе вы найдете основную информацию по загрузке и установке Unity и подготовке первой сцены нашей игры.

Настройка среды в Unity

Начнем с самого простого: загрузки и настройки Unity .

Загрузите последнюю версию с официального сайта или торрента и запустите установочный файл.

Для редактирования кода в Unity (4.0.1 и выше) служит редактор MonoDevelop. Если вы работаете в Windows, вы можете (и я вам советую) использовать альтернативый редактор Visual Studio 2013 Desktop (C#) для Windows , после чего в настройках Unity измените редактор по умолчанию на Visual Studio.

Полезно знать: невозможно использовать отладчик Visual Studio 2013 Express с Unity. Вы должны иметь Pro версию Visual Studio и купить UnityVS плагин. С версией Express, вы будете иметь лучший редактор кода, но отсутствие отладчика сведет на нет все его достоинства.

Mac OS X

Заметка о папке Resources : если вы уже работали с Unity, вы знает, что Resources – полезная и уникальная папка. Она позволяет загрузить в скрипт объект или файл (с помощью статичного класса Resources). Она понадобится нам в самом конце (в главе, посвященной меню). Проще говоря, пока мы не будем ее добавлять.

Наша первая игровая сцена

Панель Hierarchy (Иерархия) содержит все объекты, которые доступны в сцене. Это то, чем вы манипулируете, когда начинаете игру с помощью кнопки "Play".

Каждый объект сцены является игровым объектом для Unity. Вы можете создать объект в главной сцене, или в другом объекте игры. Также вы можете в любое время переместить объект чтобы изменить его родителя.


Как вы можете видеть здесь, у нас здесь 3 потомка для объекта Level .

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

Убедитесь, что все они имеют координаты (0, 0, 0) и тогда вы сможете легко их найти! Пустые объекты никак не используют свои координаты, но они влияют на относительные координаты их потомков. Мы не будем говорить об этой теме в этом уроке, давайте просто обнулим координаты ныших пустых объектов.

Заполнение сцены

По умолчанию, новая сцена создается с объектом Main Camera (Главная камера). Перетащите ее на сцену.

Для начала создайте эти пустые объекты:

Scripts Мы добавим наши скрипты сюда. Мы используем этот объект, чтобы прикрепить сценарии, которые не связаны с объектом – например, скрипт гейм-менеджера. Render Здесь будет наша камера и источники света. Level

В Level создайте 3 пустых объекта:

  • 0 - Background
  • 1 - Middleground
  • 2 - Foreground

Сохраните сцену в папке Scenes . Назовите ее как угодно, например Stage1 . Вот, что у нас получилось:

Совет: по умолчанию игровой объект привязан к положению родителя. Это приводит к интересному побочному эффекту при использовании объекта камеры: если камера является дочерним объектом, она автоматически будет отслеживать положение родителя. Если же она является корневым объектом сцены или находится внутри пустого игрового объекта, она всегда показывает один и тот же вид. Однако если вы поместите камеру в движущийся игровой объект, она будет следовать за его передвижениями в пределах сцены. В данном случае нам нужна фиксированная камера, поэтому мы помещаем ее в пустой объект Render . Но запомните это свойство объекта камеры, оно может вам пригодиться. Мы подробно остановимся на этой теме в главе "Паралаксный скроллинг".

Мы только что создали базовую структуру нашей игры. На следующем этапе мы начнем делать забавные вещи: добавим на сцену фон и кое-что еще!

Добавляем фон в сцену

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


Импортируйте изображение в папку Textures (Текстуры). Просто скопируйте файл в нее, или перетащите его из проводника. Не беспокойтесь сейчас о настройках импорта.

Создайте в Unity новый игровой объект Sprite на сцене.

Что такое спрайт?

По сути, спрайт – это 2D-изображение, используемое в видео-игре. В данном случае это объект Unity для создания 2D-игр.

Добавляем текстуру спрайта

Unity может автоматически установить фон для вашего спрайта. Если ничего такого не произошло, или если вы хотите изменить текстуру, перейдите на вкладку инспектора и выберите background : (фон)


Вы должны нажать на маленький круглый значок справа от поля ввода, чтобы появилось Select Sprite (Выбрать спрайт) в Инспекторе

Мой спрайт не появляется в диалоговом окне! Убедитесь, что вы находитесь в вкдадке Assets диалогового окна "Select Sprite" (Выбрать спрайт). Если вы видите диалоговое окно пустым, - не пугайтечсь. Дело в том, что для некоторых установок Unity, даже со свежим новым 2D проектом изображения импортируются как "Текстура", а не "Спрайт". Чтобы это исправить, необходимо выбрать изображение на панели "Проект", и в "Инспекторе", изменить свойство "Текстура Type" имущество "Sprite":

Итак, мы создали простой спрайт отображающий облака на небе. Давайте внесем изменения в сцену. В панели Hierarchy (Иерархия) выберите New Sprite . Переименуйте его в Background1 или что-то такое, что легко запомнить. Переименуйте его в Background1 или что-то такое, что легко запомнить. Затем переместите объект в нужное место: Level -> 0 - Background . Измените координаты на (0, 0, 0) .


Создайте копию фона и поместите его в (20, 0, 0) . Это должно отлично подойти к первой части.

Tip : Вы можете создать копию объекта с помощью клавиш cmd + D в OS X или ctrl + D Windows .

Слои со спрайтами

Следующее утверждение очевидно, но обладает некими неудобствами: мы отображения 2D мир. Это означает, что все изображения на одной и той же глубине, то есть 0 . И вы графический движок не знает, что отображать в первую очередь. Слои спрайтов позволяют нам обозначить, что находится спереди, а что сзади.

В Unity мы можем изменить "Z" наших элементов, что позволит нам работать со слоями. Это то, что мы делали в этом руководстве перед обновлением до Unity 5, но нам понравилась идея идея использовать слои со спрайтами. У вашего компонента Sprite Renderer есть поле с именем Sorting Layer с дефолтным значением. Если щелкнуть на нем, то вы увидите:

Давайте добавим несколько слоев под наши нужды (используйте кнопку +):

Добавьте фоновый слой к вашему спрайту фона:

Настройка Order in Layer - это способ ограничить подслои. Спрайты с меньшим номером оказываются перед спрайтами с большими числами.

Слой Default нельзя удалить, так как это слой, используемый 3D-элементами. Вы можете иметь 3D-объекты в 2D игре, в частности, частицы рассматриваются как 3D-объекты Unity, так что они будут рендериться на этом слое.

Добавление элементов фона

Также известных как props . Эти элементы никак не влияют на геймплей, но позволяют усовершенствовать графику игры. Вот некоторые простые спрайты для летающих платформ:


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

Получение двух спрайтов из одного изображения

Выполняйте следующие действия:

  1. Импортируйте изображения в папку "Текстуры"
  2. Выберите спрайт Platform и перейдите к панели Инспектор
  3. Измените "Sprite Mode" на "Multiple"
  4. Нажмите на кнопку Sprite Editor (Редактор спрайта)

В новом окне (Sprite Editor) вы можете рисовать прямоугольники вокруг каждой платформы, чтобы разрезать текстуру на более мелкие части:


Кнопка Slice в левом верхнем углу позволит вам быстро и автоматически проделать эту утомительную работу:

Unity найдет объекты внутри изображения и будет нарежет их автоматически. Вы можете установить дефолтное значение для точки вращения или минимальный размер каждого фрагмента. Для простого изображения без артефактов, это необычайно эффективно. Тем не менее, если вы используете этот инструмент, будьте осторожны и проверьте результат, чтобы убедиться, что вы получили то, что хотели.

В этом уроке проделаем эту операцию вручную. Назовите платформы platform1 и platform2 . Теперь, под файлом изображения, вы должны увидеть два спрайта отдельно:


Добавим их в сцену. Для этого мы будем выполнять те же действия что и для фона: создадим новый спрайт и выберим platform1 . Потом повторим эти действия для platform2 . Поместите их в объект 1 - Middleground . Убедитесь, что их позиция по оси Z равна нулю.


Prefabs (Префабы)


Таким образом вы создадите Prefab , точно отвечающий оригинальному игровому объекту. Вы увидите, что игровой объект, который вы конвертировали в Prefab , представляет собой новый ряд кнопок прямо под его именем:


Заметка о кнопках "Prefab": При последующей модификации игрового объекта, вы можете использовать кнопку "Apply", чтобы применить эти изменения к Prefab , или кнопку "Revert", чтобы отменить все изменения игрового объекта в свойстваъ Prefab . Кнопка "Select" переместит выбранные свойства в ассет Prefab в окне проекта (они будут выделены).

Создание префабов с объектами-платформами упростит их повторное использование. Просто перетащите Prefab на сцену, чтобы добавить копию. Попробуйте добавить другую платформу таким же образом.

Теперь вы можете добавить больше платформ, меняющих свои координаты, размеры и плоскости (вы можете поместить их на заднем или переднем плане, просто установите координату Z для платформы на 0).

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

Слои

Прежде чем двигаться дальше, мы модифицируем наши слои, чтобы избежать каких-либо проблем с порядком их отображения. Для этого просто измените позицию игровых объектов по оси Z во вкладке Hierarchy (Иерархия) следующим образом:

При переключении из 2D режима в 3D, в окне "Scene" (Сцена) вы будете четко видеть слои:


Кликнув на игровом объекте Main Camera , вы увидите, что флажок Projection установлен на Orthographic . Эта настройка позволяет камере визуализировать 2D игру без учета трехмерных свойств объектов. Имейте в виду, что даже если вы работаете с 2D объектами, Unity по-прежнему использует свой 3D движок для визуализации сцены. Рисунок выше это наглядно демонстрирует.

В следующем уроке:

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

Доброго времени суток! Перед тем как приступить непосредственно к созданию 2D шутера мне хотелось бы немного размыть эту статью вводной частью. Итак, сейчас Вы читаете мою первую статью на этом сайте. Честно сказать я не профи в разработке игр и работаю пока преимущественно с Game Maker, дабы набить руку перед серьезными проектами. Так вот, в этой статье, а вернее сказать в этом уроке я попробую снабдить Вас некоторыми своими знаниями в области геймдева. Конкретно, я расскажу о том, как сделать наипростейший 2D шутер в стиле Контры.

Ладно. Приступим к созданию игры. Для начала нам нужно запастись спрайтами:

player_go_right и player_go_left – спрайты движения игрока влево и вправо (анимация).


gun_right – спрайт ружья, направленного вправо. Для этого спрайта установите центр вращения на рукояти, как показано на скриншоте.
bullet_spr – спрайт пули. Никаких особых критериев.
wall_sprite – спрайт стены. Желательно размера 32x32.

Когда спрайты готовы, самое время создать необходимые объекты и естественно настроить их. Начнем с самого простого – стены. Создайте объект wall_obj и присвойте ему спрайт wall_sprite . Также для этого объекта установите свойство Твердость(Solid) .

Далее переходим к пулям. Создайте объет bullet_obj и присвойте ему bullet_spr . Чтобы в будущем пуля вела себя более естественно в событии Столкновнение с wall_obj добавьте действие Destroy Instance () . По желанию можете увеличить глубину пули.

Все второстепенные объекты готовы. Приступаем к самому сложному. Создайте объект игрока player_obj и присвойте ему спрайт player_go_right или player_go_left . Для player_obj в событии Create введите скрипт():

200?"200px":""+(this.scrollHeight+5)+"px");">
image_speed=0
right=true
gravity=1

Этот скрипт запускает гравитацию для игрока и уменьшает скорость спрайта до 0. Так же этим кодом мы вводим новую переменную right , с помощью который мы в дальнейшем будем определять направление игрока.

Перейдем к управлению. В событии Step напишите следующий код():

200?"200px":""+(this.scrollHeight+5)+"px");">
//Движение вправо
if keyboard_check(vk_right) then
hspeed=5

//Движение влево
if keyboard_check(vk_left) then
hspeed=-5

//Под ногами не пусто? Нажата ли кнопка вверх?
if (not place_free(x,y+3)) and (keyboard_check(vk_up)) then
vspeed=-15 //Прыжок
//Если ничего не нажато
if keyboard_check(vk_nokey) then
begin
hspeed=0
image_index=0
image_speed=0
end;

Этот скрипт позволит игроку ходить влево, вправо и даже прыгать.

Итак, гравитация есть, управление есть, а опоры нет. Чтобы опора появилась добавьте событие Столкновение с wall_obj и введите в это событие:

200?"200px":""+(this.scrollHeight+5)+"px");">
vspeed=0

Ну вот, практически все готово. Игрок уже может смело прыгать по платформе. Но к сожалению анимации движения не будет. Для того чтобы это исправить в событие press введите скрипт:

200?"200px":""+(this.scrollHeight+5)+"px");">
sprite_index=player_go_left //Смена спрайта
image_speed=0.2 //Скорость спрайта
right=false //Игрок не повернут направо

И в событие press введите аналогичный скрипт:

200?"200px":""+(this.scrollHeight+5)+"px");">
sprite_index=player_go_right
image_speed=0.2
right=true//Игрок повернут направо

Осталось только научить игрока стрелять. Для начала в этих целях мы дадим ему оружие. В этих целях введите в событие Draw следующий скрипт:

200?"200px":""+(this.scrollHeight+5)+"px");">
//Определение направления оружия
rotate=point_direction(x,y,mouse_x,mouse_y);

//Игрок повернут направо?
if right=true then
gun_x=x+15 //Смена положения ружья по X
else
gun_x=x+1

Gun_y=y+15//Смена положения ружья по Y

Draw_sprite(sprite_index,image_index,x,y) //Прорисовка игрока
draw_sprite_ext(gun_right,0,gun_x,gun_y,image_xscale,image_yscale,rotate,image_blend,image_alpha) //Прорисовка ружья

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

Если же все работает замечательно, давайте продолжать. Добавьте событие Glob Left Pressed и в него перенесите действие Create Moving () с следующими значениями:

Object = bullet_obj;
x= gun_x
y = gun_y
speed= 10
direction= rotate

Ну вот и все! Смело расставляйте объекты в комнате и наслаждайтесь своей игрой. Кстати, не забудьте оставить комментарий.



Шахматы