Как адаптировать классику жанра hack'n'slash, игру Titan Quest, любимую целым поколением компьютерных игроков, под смартфоны и планшеты? Я недавно пришёл в DotEmu и это стало вопросом, на который мне нужно было ответить. Но это был не только вопрос, это был вызов, потребовавший почти 20 месяцев размышлений, итераций и разработки для правильной «перезагрузки» потрясающей игры для её армии фанатов!

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

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

UX: упрощаем управление, оставляем только необходимое

Как получить из этого (Рис. 1) вот это (Рис. 2)?



В какую бы hack'n'slash-игру вы ни играете, вы всегда ждёте, что на экране будет множество элементов: заклинания, эликсиры, оружие, питомцы и т.д., короче, всё то интересное, что есть в этом жанре. Факт в том, что в вашем путешествии каждая кнопка имеет важную и чётко заданную роль. Однако, здесь присутствует определённая сложность, потому что каждый игрок может настроить свой «набор кнопок» в зависимости от класса и развития персонажа. На ПК это сделать просто — персонаж перемещается мышью, а клавиши клавиатуры выполняют действия. Но при игре на сенсорном экране у игрока есть только пальцы! Для удобства люди обычно играют большими пальцами на повернутом горизонтально мобильном устройстве.

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



Кроме того, в такой игре, как Titan Quest, перемещение персонажа касанием экрана неприменимо, потому что пальцы игрока не должны закрывать игровое поле. Вместо этого большие пальцы игрока постоянно «приклеены» к экрану, перемещая персонажа и активируя действия. Здесь идеальным выбором стал виртуальный джойстик. Он хорошо известен игрокам, такое устройство мы встраивали во множество наших игр, потому что оно не занимает много места. И, разумеется, интерфейс должен быть достаточно узким, чтобы не снижать видимость.



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



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



Постоянно видны четыре заклинания, каждое из них можно настроить, удерживая в течение двух секунд нужную кнопку. Открывается раскрывающееся меню с доступными заклинаниями. Коснувшись нужного заклинания, можно настроить кнопку. Под кругом действий находится кнопка переключения заклинаний. В Titan Quest доступно впечатляющее количество заклинаний, поэтому мы не хотели ограничивать игроков всего четырьмя. Вместо этого я создал два набора из четырёх заклинаний (в наборе А находятся заклинания 1-4, а в наборе Б — 5-8). Нажимая кнопку переключения заклинаний, игрок может переключаться между наборами А и Б.

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



«Заклинание оружия» — это ещё одна кнопка под кругом действий. Она позволяет игроку назначить постоянное заклинание для выбранного оружия. Это даёт игроку постоянное заклинание оружия, а не просто базовую атаку, но оно стоит единиц маны. Когда полоска маны пуста, заклинание оружия снова превращается в базовую атаку. В правой части экрана, над кругом действий показаны эликсиры и их количество. Мы добавили включенную по умолчанию настройку автоматического использования эликсиров, когда здоровье игрока снижается до определённого уровня.



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

Создание нового интерфейса с сохранением оригинальных элементов и стиля

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



Также я создал различные значки для круга действий, чтобы игрок получал наглядную обратную связь от каждого выбранного действия. Поэтому было необходимо не только создать значок для каждого типа оружия (мечи, луки и посохи), но и два вида предполагаемых действий: значок поднятия/взаимодействия и значок диалога с NPC. При работе над последними двумя действиями я вдохновлялся искусством Древней Греции, и в особенности рисунками людей на фресках и чашах, которые часто представляли собой чёрные фигуры с контуром из охры.

Адаптация экранов

Экраны инвентаря, умений и квестов тоже подверглись адаптации. В версии для ПК эти экраны открываются в отдельных окнах, и игра не останавливается, когда они открыты. Но для адаптации под мобильные устройства мы решили сделать эти окна полноэкранными и приостанавливать игру на фоне. Соответственно, необходимо было перенастроить элементы каждого из экранов, потому что мы хотели отобразить такой же объём информации, что и на экранах ПК. Например, мы выбрали раскрывающееся окно для отображения всей статистики игрока. В версии для ПК она отображается в двух отдельных вкладках. Для управления предметами в инвентаре в версии для ПК использовался простой drag'n'drop и для назначения предмета «активной экипировкой» (набор 1 или 2), и для выбрасывания. Сенсорный экран позволяет использовать тот же подход. Для выбрасывания предметов я создал простое поле «мусора».



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



И, наконец, для экрана управления «умениями» я адаптировал систему «очков», потому что система на ПК была слишком маленькой и сложной в использовании. Благодаря добавлению в нижнюю часть экрана модуля распределения очков игрок может быстро повышать уровень заклинаний, которые он хочет использовать. Все относящиеся к умениям значки тоже переработаны, чтобы лучше было видно выделенные и невыделенные пункты. Для экрана квестов и карты достаточно было простой перекомпоновки.

Модуль распределения очков, добавленный на экран «умений» мобильной версии:

Новый значок

Теперь мы переходим к одному из самых важных элементов мобильной игры: основной значок.

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

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



Итак, чему же я научился при работе над Titan Quest? Многому: я узнал, что хотя адаптация компьютерной hack'n'slash на мобильные устройства — сложная задача, она действительно захватывает. Погружение в уже существовавшую стилистику конечно ограничивало мои дизайнерские возможности, но и помогало расширить границы моей креативности. Оно позволило создать более точные и значительные результаты, по сравнению с работой «с нуля».

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

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