Илья Стремовский: лицом к интерфейсу

Спецматериалы Илья Стремовский: лицом к интерфейсу 001.09.2007 08:05  |  ...Все элементы на экране несут интерфейсную нагрузку. Юниты в стратегиях, враги в шутерах, красивая бижутерия в казуальных аркадах — все это, по сути своей, затейливо разукрашенные кнопки. Кликнул на врага — он изобразил свою гибель, поо Спецматериалы

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

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

Передовое производство

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

Исторически случилось так, что игры всегда оказывались на переднем краю дизайна интерфейсов. Они всегда заметно опережали по этому параметру бизнес-приложения и продолжают делать это до сих пор. Иногда проходили годы между появлением инноваций в играх и обычных программах. Например, первая компьютерная игра Tennis for Two (1958) имела примитивный графический интерфейс. Для другой старушки, Spacewar! (1962), был разработан первый игровой манипулятор прототип современных джойстиков и гeймпадов. В жизнь офисных работников графический интерфейс и мышь вошли только в 1984 году с появлением первого Macintosh.

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

Потехе время, делу час

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

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

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

В случае коммерческой программы офисного назначения интерфейс призван облегчать пользователю достижение нужного ему результата. Результат ставится во главу угла, он должен достигаться быстро и эффективно. Любые препятствия на этом пути ухудшают восприятие пользователем программы. Работа в офисном приложении может быть очень разнообразной. Поэтому даже очень маленькая офисная программа может иметь сложный интерфейс. Он может позволять разные способы достижения одной и той же цели, иметь много настроек, удобств для разных людей. Здесь царит принцип «клиент всегда прав». Если бы это было возможно технически, то в интерфейсе была бы кнопка «Написать интересную статью», и все были бы рады.

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

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

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

В играх нет документов как таковых. Все элементы на экране несут интерфейсную нагрузку. Юниты в стратегиях, враги в шутерах, красивая бижутерия в казуальных аркадах все это, по сути своей, затейливо разукрашенные кнопки. Кликнул на врага он изобразил свою гибель, поощрил правильные действия игрока. Если не кликнуть, тот же враг проиграет анимацию атаки и намекнет, что действовать надо по-другому. Эдакое ходячее сообщение об ошибке. Это как если бы человек выбирал бы пункты из меню в MS Word, кликал бы по кнопочкам на тулбарах, а на чистом листе появлялись бы и исчезали сообщения вроде тех, что произносят юниты в стратегиях: «Нас атакуют!», «Осталось 25% брони!», «Задание выполнено», ну и так далее.

Семь законов игротехники

Из-за этих отличий разнится и подход к построению игровых и офисных интерфейсов. Для создания качественного игрового интерфейса дизайнер должен соблюдать ряд основных принципов.

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

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

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

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

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

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

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

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

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

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

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

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

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

В переносном смысле

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

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

Когда появился персональный компьютер Macintosh, главной причиной его успеха было не то, что графический интерфейс был красив, а то, что им было очень легко пользоваться. Он был интуитивно понятен. Секрет такой доступности был в использовании метафоры письменного стола. Дизайнеры говорили пользователям это не экран компьютера, это письменный стол, и вы можете работать на нем, как на письменном столе. Все. Этого оказалось достаточно, чтобы люди начали работать. Файлы листки бумаги. Чтобы их рассортировать, надо разложить их по папкам. Если файл больше не нужен, его бросают в мусорную корзину. Элементарно!

Разумеется, ни листков, ни папок, ни мусорной корзины не существует. Есть только символические изображения на экране монитора. Глядя на эти символы, человек начинает приписывать им некоторый смысл и предполагать, что именно они могут означать. На самом деле означать они могут все что угодно, и каждый человек пытается угадать значение, пользуясь своим жизненным опытом, тем, что именно эти знаки означали в прошлом и в каких комбинациях встречались. Понятно, что для разных людей результат может быть самым разным. Для успеха необходимо так выбрать эти символы, чтобы они одинаково воспринимались как можно большим количеством людей. А это совсем не просто. Легкость, с которой это удалось Стиву Джобсу, обманчива. Это было гениальное решение. С тех пор заметных прорывов в этой области не было. Мы все также используем мусорную корзину, папки и прямоугольники с загнутым уголком.

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

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

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

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

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

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

Можно использовать несколько более мелких метафор и собрать из них одну. Скажем, взять аналог дисплеев авиадиспетчеров, которые накладывают движущиеся точки поверх карты местности. Тут важно заметить, что метафора не обязана принадлежать тому игровому миру, что изображается в игре. Такая авиационная мини-карта при должном оформлении прекрасно работает и в Battlefield 2142, и в фэнтезийном Warcraft 3. К ней можно добавить метафору цифровой клавиатуры справа, и уже готова основа для классического интерфейса игры в жанре RTS.

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

Это похоже на ситуацию с видеомагнитофонами. В течение многих лет они использовали одну и ту же схему интерфейса набор кнопок, унаследованных еще от первых магнитофонов для проигрывания звука: треугольник Play, квадрат Stop. Потом в какой-то момент одна фирма (кажется, великие инноваторы из Sony) представили на рынке схему управления в виде колесика. Этот элемент присутствовал ранее на профессиональной видеоаппаратуре для более удобного и точного управления при монтаже. Инновация удалась. Но так и не стала основным фактором конкурентной борьбы. Все равно пользователи используют дистанционный пульт с той самой классической схемой. Более того, именно его Nintendo взяла за основу для своей действительно инновационной консоли Wii.

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

Борьба на невидимом фронте

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

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

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

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

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

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

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

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

В чужой монастырь

Помимо человеческого фактора на дизайн интерфейсов напрямую влияют устройства ввода и вывода и аппаратная часть. С персоналками все более или менее понятно. Монитор (или два), клавиатура, мышь, гоночный руль с педалями, джойстик для авиасимуляторов. Для вывода звука наушники или колонки. Плюс микрофон, чтобы обкладывать друг друга во время сетевой игры. Для каждого устройства нужно принимать решение. Поддерживать или не поддерживать его в игре, а если поддерживать, то как именно это повлияет на интерфейс? Проблемы могут быть нетривиальными: от дополнительных опций в меню настройки до сложностей с прострaнcтвенным позиционированием звуковых откликов от юнитов. На консолях все еще интереснее. Возьмем для начала традиционный гeймпад и телевизор. 13-14 кнопок на гeймпаде, включая аналоговые рукоятки, и не самое высокое телевизионное разрешение (в случае с консолями прошлого поколения). Привычные к клавиатурно-мышиному изобилию дизайнеры чувствуют себя на голодном пайке. После месяцев такого аскетизма развивается невиданная виртуозность в решениях. Впрочем, выше головы не прыгнуть, так что с играми на консолях случается жанровая деформация. До недавних пор стратегии на консолях выглядели в диковинку, ведь этот жанр в немалой степени обязан своему происхождению мыши. Шутеры от первого лица для неподготовленного человека тоже непростое развлечение. У привыкших к связке «клавиатура + мышь» людей в первое время гeймпад выпадает из рук. С другой стороны, файтинги и забористые платформеры с адреналином, как в детстве, пасутся на тучных консольных лугах не менее тучными стадами. Для них нужно очень аккуратно разложить прыжки, удары, выстрелы, комбы и прочее великолепие на скудный запас кнопок. Wii выступает в своей собственной категории. Новый контроллер произвел переворот в игровых интерфейсах. Все остальные играют в догонялки. Дизайнеры в счастливом ошалении они до сих пор не могут толком понять, что делать со свалившимся богатством. У портативных приставок все те ограничения, что и у больших консолей, и еще более жесткие ограничения по графическим возможностям и средствам управления. Но Nintendo и тут на коне вовсю использует сенсорный экран и стилус, который как мышь, да не совсем, и даже микрофончик с возможностями голосового ввода. В последние годы в стане игровых устройств прибыло. Маскировавшиеся под средство связи мобильники вышли из подполья и заявили о себе. Из ограничений кнопок почти как на консолях, экран почти как на хендхелдах. В погоне за прибылью игры нередко выходят на нескольких платформах сразу, и задуматься о том, как созданный интерфейс будет работать на другом железе, совсем не лишне.