Философия интерфейсов. Часть 1, удобство.

О, интерфейс, как много в этом слове для сердца кодера слилось! Как много в нем отозвалось!

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

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

Что же нужно сделать чтобы интерфейс был удобным?

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

Рассмотрим пункты по отдельности:

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

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

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

Да, как бы это странно не звучало, но этим пунктом пренебрегают очень часто. Сделали поле для ввода логина и пароля, а Enter или Tab не перебрасывает между полями ввода. Enter не заставляет кнопку Submit нажаться. Колсёсико мыши, не прокручивает список. Разумеется, есть и более сложные случаи, например выбора элементов выпадающего списка по стрелочкам курсора. 

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

Не забывайте про «горячие кнопки».

и

Старайтесь дублировать любое действие.

Эти два пункта взаимодополняющие. Любое действие (например кнопку) всегда можно продублировать «горячей клавишей» или действием мышкой. Вспомним стратегии: можно поднести мышь к краю экрана, зажать правую кнопку и двигать мышь, нажимать курсорные стрелочки, или кликать по миникарте. И любое из этих действий делает одно и то же! Перемещает камеру. Если мы постараемся вспомнить, то найдем еще множество подобных действий. Атака. Щелчком правой кнопкой мыши на враге, нажатием кнопки «Атака» на панели управления юнитом, нажатием кнопки «А» или зажатием Ctrl. 

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

Не заставляйте пользователя ждать там, где это не нужно.

О да, это знакомо всем. Не скидывается заставка или ролик? Кнопка играет анимацию, прежде чем сработать? Красиво, и первый раз нравится, но чем дальше, тем больше вызывает ярости. «Ядрёны биты, я уже всё это видел миллион раз! Хватит!» — не надо мучать пользователя и он останется благодарен вам за это. Не надо ставить простой в загрузке программы только для того, чтобы показать насколько красивая у вас панель со статусом загрузки, дайте программе грузиться столько времени, сколько ей нужно.

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

Охохо. Этот пункт сопровождает любое сообщение об ошибке, или запросе каких-либо данных от пользователя. Пример «Ошибка по адресу 0х00FF0F31» — Что это сказало пользователю? А разработчику? Ничего, абсолютно, по крайней мере пользователю. Даже если эта ошибка неизвестна и Вы не знаете что писать, все равно не забудьте приписать чем она грозит пользователю и что ему делать при возникновении (повторном) этой ошибки. «Неизвестная ошибка. Перезапустите приложение. Возможно будут потеряны данные за последнюю сессию.» Правда понятнее?  :)

Не делайте непонятных, неудобных и неочевидных элементов.

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

 

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

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

Всем спасибо за внимание, Илья aka Darthman.