Все
разделы

Публикации

Как применить опыт автопрома в банковском обслуживании, или Интерфейс рулит

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

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

  1. Основных органов управления мало.
  2. Они крупные, и ими удобно пользоваться.
  3. Они разные, и их сложно перепутать.
  4. Ими можно пользоваться одновременно.
  5. Второстепенные органы управления сгруппированы по назначению и расположены тем удобнее, чем чаще они нужны.
  6. Прямо перед глазами водителя — только основная информация.
  7. Второстепенная информация отображается на дополнительных дисплеях и, подобно органам управления, тоже тематически сгруппирована.

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

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

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

Принцип организации управления: важная информация крупно и «перед носом», второстепенная — где-то сбоку.

А вот какая у вас играет радиостанция или какая выставлена температура в салоне — без этой информации вы можете вполне успешно ехать сколь угодно долго. Поэтому вся подобная информация обычно вынесена на отдельный дисплей (или дисплеи) на центральной консоли. Этот принцип организации обратной связи машины с водителем очень похож на принцип организации управления: важная информация крупно и «перед носом», второстепенная — где-то сбоку.

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

Не надо конформизма

Пять принципов в организации интерфейса.

Когда компания задумалась о разработке АРМ «Единое окно обслуживания физических лиц» в АБС RS-Bank V.6 — рабочего места операциониста, оказывающего клиенту — физическому лицу полный спектр банковских услуг, свою работу мы начали с того, что сформулировали общие принципы организации интерфейса, очень похожие на «автомобильные».

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

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

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

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

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

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

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

Единое и неделимое

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

 

Предлагаю пройтись по ранее сформулированным принципам и посмотреть, как они воплотились в новом интерфейсе.

1, 2. Самые важные органы управления всегда под рукой. Самая важная информация всегда на виду.

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

3, 4. Всего этого достаточно немного, чтобы пользователь не запутался. Элементы управления и визуализации сгруппированы, выделены цветом и пиктограммами таким образом, чтобы пользователь не запутался, даже если очень захочет.

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

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

 

При начале выполнения операции по продукту экранные формы операции замещают список доступных операций по продукту:

 

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

 

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

 

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

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

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

 

В области информации о клиенте (I) отображаются сведения об обслуживаемом физическом лице. Здесь предусмотрены два режима работы: ввод данных с целью идентификации клиента в БД системы или вывод информации о нем.

  • В область продуктов клиента и разовых услуг (II) можно выбрать продукт клиента или связанный с ним прикладной объект (счет, карту) для дальнейшего выполнения операций по нему, либо разовую услугу.
  • В области информации о выбранном продукте/услуге (III) в виде справочной информации представлены основные сведения о выбранном продукте, прикладном объекте или разовой услуге.
  • Область выбора / выполнения операции (IV) имеет два режима работы: либо в ней отображается список доступных действий по выбранному объекту, либо она применяется для непосредственного выполнения выбранного действия (содержит диалоговые окна операции).

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

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

Надежда Сперанская