Как передать комплексное состояние героя и не нарушить погружение — разбор UI в The Long Dark

Поиск баланса между наглядностью и минимализмом.

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

UI-дизайнер Юлиана Ю опубликовала на сайте Gamasutra подробный разбор интерфейса The Long Dark. Она рассказала, какие аспекты UI работают хорошо, а какие требуют доработки. Мы выбрали из текста главное.

В игровом мире The Long Dark преобладают оттенки синего и белого, с разным уровнем яркости. Это создаёт проблему для пользовательского интерфейса, поскольку он должен быть различим как на очень ярких, так и на тёмных поверхностях. Для решения этой проблемы разработчики использовали двухцветный подход: сплошной белый цвет применяется почти во всех элементах UI, а чёрный обеспечивает контраст для различных фонов.

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

Большая часть игровой информации представлена в виде текста. Разработчики создали пользовательский шрифт с различной высотой букв и разными стилями. Чаще всего текст написан заглавными буквами в обычном стиле: он используется для деталей, заметок и дополнительной информации. Цветом выделены важные части текста.

Многие элементы UI The Long Dark контекстные и появляются лишь в определённых ситуациях. Интерфейс можно разделить на семь отдельных зон: местоположение, ветер, инвентарь, болезнь, движение, общая информация и здоровье.

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

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

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

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

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

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

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

«Болезни» можно перенести в левую часть, так как это важнейшая информация. Сейчас они зависят от контекста и исчезают со временем, поэтому игрок может забыть о серьёзной травме. Лучше отображать болезни небольшими значками, которые не пропадают со временем.

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

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

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

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

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

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

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

В заключение UI-дизайнер собрала все основные советы, которые выделила во время разбора интерфейса The Long Dark.

Шрифт и цвет:

HUD:

Радиальное меню:

#ui #опыт