Книга «Дизайн пользовательского опыта инструментов разработки игр» второго издания, автором которой является Дэвид Лайтбаун, теперь доступна. Она опубликована издательством CRC Press, подразделением Taylor & Francis, входящим в группу Game Developer и Informa Festivals.
Отрывок:
Скрытое на виду
Вы могли не догадываться, но уже знакомы с некоторыми концепциями дизайна и их применением к инструментам для игр, даже до прочтения этой книги. Источник этого знания всегда был у вас перед глазами: игры!
Соревновательные игры, где важны скорость и точность, такие как стратегии в реальном времени и файтинги, помогают понять многие концепции пользовательского опыта, которые можно применить к инструментам. Давайте разберём некоторые из этих концепций, и, возможно, вы удивитесь тому, сколько вы уже знаете!
Стратегии в реальном времени и группировка
Во-первых, если вы знакомы с стратегиями в реальном времени, вы, вероятно, уже понимаете концепцию группировки.
Чемпион Brood War BoxeR
Один из величайших игроков в Starcraft: Brood War — это BoxeR. Среди множества навыков профессионального игрока в Starcraft — способность строить именно те юниты, которые необходимы для защиты от атаки.
Starcraft, как и многие отличные RTS-игры, имеет дизайн «камень-ножницы-бумага», где каждый юнит силён против определённых и слаб против других. Если противники BoxeR атакуют с юнитами, эквивалентными «ножницам», BoxeR быстро защищается юнитами, эквивалентными «камню», а не «бумаге».
Например, если противник BoxeR играет за Zerg и атакует с комбинацией Mutalisks и Zerglings, известной как «Mutaling», BoxeR сразу же начинает строить Siege Tanks и Marines, так как они эффективны против этой композиции.
Как BoxeR удаётся действовать так быстро? Во многом это благодаря эффективному использованию группировки.
Шахматы и группировка
Одно из лучших демонстраций группировки и игр происходит из эксперимента, проведенного психологами Кристофером Чабрисом и Даниэлем Симонсом.
В их исследовании участникам показывали серию карточек, каждая из которых изображала шахматную доску с фигурами в различных позициях. Участники имели 30 секунд на изучение карточки, после чего должны были расставить шахматные фигуры на реальной доске в тех же позициях.
Уровень мастерства участников варьировался от новичков до гроссмейстеров. Неудивительно, что на определённых карточках гроссмейстеры были значительно лучше новичков. Однако, на некоторых карточках новички справлялись наравне с гроссмейстерами. Как это возможно?
Дело в том, что карточки, на которых гроссмейстеры преуспевали, показывали реальные шахматные партии с правдоподобными позициями, а карточки, на которых они были наравне с новичками, имели случайно расставленные фигуры.
Для гроссмейстеров позиции на карточках не состоят из отдельных фигур, а представляют собой «кластеры» фигур, которые они видели в бесчисленных шахматных партиях. Со временем они усваиваются как группы.
Карточки с случайно размещёнными фигурами могли содержать невозможные сценарии, например, два короля рядом или два белых слона на одинаковых клетках. Такие ситуации шахматисты никогда не видели, и поэтому не могли усвоить как группы.
Вместо запоминания позиций каждой фигуры по отдельности, гроссмейстеры запоминали несколько групп, которые они уже усвоили, видя их снова и снова. Тем временем, новички, не имеющие такого же количества и разнообразия групп, должны были запоминать позиции большинства фигур по отдельности.
Однако, когда карточки были со случайными шахматными позициями, гроссмейстеры не могли использовать свои группы для запоминания, и поэтому были наравне с новичками.
Так же происходит и с BoxeR: когда он видит комбинацию Mutalisks и Zerglings, он воспринимает её не как отдельные юниты, а как группу, что позволяет ему быстрее реагировать и строить необходимую защиту.
Группировка TRS
Как же все эти идеи можно применить к дизайну инструментов?
Одним из самых распространённых интерфейсных паттернов в редакторах уровней и 3D-анимации является контроль Translate Rotate Scale, или TRS. Это трёхрядная сетка числовых входов, представляющих значения X, Y и Z для трансляции (позиции), вращения и масштаба.
Она почти всегда выглядит одинаково: первый горизонтальный ряд числовых входов представляет трансляцию XYZ (позицию объекта), второй — три оси вращения, третий — масштаб (размер объекта).
С помощью использования этого типа контроля TRS, пользователи начинают формировать группы, позволяющие быстро интерпретировать числа. Например, если первый ряд состоит из трёх нулей, второй ряд — три нуля, а третий ряд — три единицы, они знают, что объект находится в центре мира без вращения и масштабирования.
Что произойдёт, если контроль TRS не в том же порядке или ориентации? В редакторе игрового движка Stingray ориентация числовых входов вертикальная, а Softimage|XSI сначала ставит масштаб, затем вращение, затем позицию (трансляцию).
Одним из недостатков такого подхода является то, что пользователи не могут использовать те же группы, которые они усвоили, используя другое программное обеспечение. Поэтому первый ряд из трёх нулей, второй ряд из трёх нулей и третий ряд из трёх единиц будут означать совершенно другое.
Также, если кто-то работает с двумя разными инструментами (одним для создания активов и другим для их размещения в уровне) с различными TRS-контролями, это может привести к путанице при переключении между ними.
Урок здесь в том, что важно представлять данные в последовательном порядке во всех частях инструмента, чтобы пользователи могли группировать их из одной части инструмента в другую. Если одни и те же данные представлены по-разному в различных частях инструмента, пользователям будет сложнее усваивать группы информации и использовать их для повышения эффективности.
Кроме того, если вы создаёте инструмент, использующий тот же шаблон, что и другое известное пользователям программное обеспечение (например, контроль TRS), используйте тот же порядок и конфигурацию, чтобы пользователи могли воспользоваться уже усвоенными группами.
Файтинги и человеческое зрение
Теперь давайте рассмотрим, как знание файтингов может означать, что вы уже знаете немного о том, как глаза и мозг работают вместе.
Саккадическое маскирование
Чтобы понять саккадическое маскирование, сначала нужно понять саккады и фиксации. Фиксация — это точка, на которой сосредоточен ваш взгляд, а саккада — это когда ваш фокус перемещается с одной точки на другую.
Когда глаз совершает саккаду, мозг временно блокирует визуальную обработку, чтобы воспринимать мир стабильным и уменьшить размытие в движении. Это означает, что мы слепы на долю секунды, даже не осознавая этого!
Одно из лучших исследований эффектов саккадического маскирования было проведено Тимом Смитом. В исследовании участникам показывали изображение, отслеживая их глаза с помощью устройства для отслеживания взгляда. Когда устройство обнаруживало саккаду, элементы изображения изменялись или исчезали. Участники не замечали большинства изменений, так как были фактически слепы в эти моменты.
Фовеальное и периферическое зрение
Фовеальное зрение иногда называют «центральным зрением», это часть нашего зрения в середине, которая наиболее чёткая. Периферическое зрение — это всё, что окружает центр. Оно не такое чёткое, как наше фовеальное зрение.
Некоторые измерения показывают, что разрешение на крайнем краю нашего периферического зрения составляет всего три пикселя на фут (однако оно лучше распознаёт цвет и движение). Наш мозг компенсирует это, «заполняя» часть разрешения, особенно если это что-то, что мы уже видели раньше. Это означает, что если мы не смотрим прямо на что-то, мы не видим это так чётко, как нам может казаться.
Как всё это связано с файтингами?
Sako и Sentry
Sako — один из лучших игроков в файтинги, известный своими навыками в Street Fighter. Он настолько известен своим Evil Ryu, что у него даже есть комбо, названное в его честь.
В начале 2010-х компания Steelseries выпустила устройство под названием Sentry Eye Tracker, чтобы принести отслеживание взгляда в игровое сообщество. Целью было помочь геймерам увидеть свои движения глазами, чтобы улучшить свои навыки. Они объединились с Sako, чтобы выпустить видео, где он играет в Street Fighter с использованием Sentry Eye Tracker.
Если бы вы посмотрели это видео, вы заметили бы, что он фиксирует взгляд прямо между обоими персонажами. Это одно из отличий его от новичков, которые склонны переключаться и фиксировать взгляд между обоими персонажами.
Делая так, он использует своё чёткое фовеальное зрение, чтобы держать обоих персонажей в фокусе одновременно, минимизируя количество саккад. Это означает, что когда его противник начинает движение, он с меньшей вероятностью пропустит первые несколько кадров... а в файтингах пропуск нескольких кадров может означать разницу между победой и поражением.
Кроме того, Sako, вероятно, уже усвоил группы различных поз, в которых находятся он и его противник, что позволяет ему быстрее считывать ситуацию и реагировать (ещё один хороший пример группировки!).
Расположение меток и отслеживание взгляда
Блог UX Matters провёл серию исследований, в которых использовались устройства для отслеживания взгляда, чтобы понять, на что люди смотрят в различных интерфейсах. Одно интересное исследование сравнивало три варианта размещения метки в форме: выравнивание по левому краю, по правому краю и сверху. Вот что они обнаружили.
Метки, выровненные сверху и справа, привели к наименьшему количеству саккад, что означает, что пользователи были более эффективны в интерпретации данных интерфейса. Однако метки, выровненные по левому краю, практически удвоили количество саккад, что означало, что пользователи перемещали глаза по интерфейсу больше, чем нужно.
Как мы можем применить всё это к дизайну инструментов?
Формы очень похожи на элемент интерфейса, встречающийся во многих инструментах: редакторы свойств. Они обычно состоят из метки, связанной с вводом (часто текстовым, но возможны и другие типы).
Например, метки в Maya Attribute Editor выровнены справа, что позволяет пользователю фиксировать взгляд в центре и читать как метку, так и значение, не переключая взгляд. Сравните это с Stingray, где метки выровнены по левому краю, требуя переключения взгляда между меткой и значением.
Эта проблема усугубляется при изменении размера редактора свойств по горизонтали, что ещё больше удаляет метки от вводов.
Наконец, хотя метки, выровненные сверху, работают так же хорошо, как и выровненные справа, их использование в редакторах свойств может быть проблематичным, так как они обычно требуют прокрутки из-за увеличенного использования вертикального пространства. Их следует использовать только в случаях, когда вводов немного. В редакторах свойств обычно много вводов, поэтому метки, выровненные справа, предпочтительнее.
Подводя итоги
Теперь вы видите, как некоторые виды игр могут не только помочь в изучении концепций дизайна инструментов, но и использоваться для объяснения этих концепций другим!
Однако помните, что некоторые игры намеренно увеличивают трение как часть игрового процесса. Хотя это может быть забавно в игре, это не весело, когда вы пытаетесь выполнить свою работу, поэтому лучше искать примеры из соревновательных игр, где важны скорость и точность.
Таким образом, теперь вы знаете о другом замечательном ресурсе для изучения концепций дизайна инструментов, который всё это время скрывался на виду: игры!
Очень интересно, как через игры можно изучать дизайн интерфейсов! Особенно понравилась идея о том, как файтинги помогают улучшать зрительное восприятие. Задумался, может, стоит попробовать применить это на практике в своих проектах.