Интерфейс Такси

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

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

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

Разработчики повысили роль истории, как инструмента поиска данных:

• Вместо истории изменений разработчики реализовали историю открытий;
• Увеличили количество сохраняемых в истории элементов;
• Переработали диалог отображения истории. Разделили записи по датам, реализовали удобный поиск;

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

Разработчики повысили роль избранного, как инструмента доступа к частым данным и функциям:

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

• Переработали диалог отображения избранного и реализовали в нем новый поиск;
• Реализовали возможность переименовывать элементы избранного;

• Сделали панель избранного. Дали возможность «фиксировать» элементы избранного. Панель избранного можно использовать и как панель «любимых» команд: добавить в избранное основные команды и «зафиксировать» их;

Разработчики предложили больше и чаще использовать механизм полнотекстового поиска данных:

• Реализовали стандартную форму поиска. Теперь полнотекстовый поиск доступен во всех прикладных решениях;

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

Кроме этого разработчики:

• Реализовали панель инструментов, с помощью которой можно обратиться ко всем основным способам навигации по приложению: меню функций, избранное, история, поиск в данных;

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

• Убрали связь между разделом «Основное» и начальной страницей. Теперь это две отдельные несвязанные между собой сущности.
• Закрепили за разделами роль «логической группы команд»:
  • Раздел – это не рабочее место;
  • Раздел – это способ получения доступа к списку команд, объединенных прикладным смыслом.
• Реализовали быстрый доступ к начальной странице;

• Реализовали альтернативную навигацию по открытым формам в парадигме Вперед/Назад.

Рабочее пространство пользователя

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

Понимая, что сделать одно решение, которое подойдет всем, у нас не получится, разработчики решили дать возможность «конструировать» рабочее место.

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

При этом все возможности навигации по приложению остаются доступны из панели инструментов.

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

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

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

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

Юзабилити поля ввода

Разработчики существенно улучшили юзабилити поля ввода при выборе значения. Тут существовало несколько проблем.

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

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

И, в-третьих, ситуация, когда у поля есть кнопка выбора и кнопка выбора из выпадающего списка, часто ставит пользователя в тупик. Какую кнопку надо нажимать?

Проанализировав эти проблемы, разработчики решили изменить поведение поля ввода. Теперь основной механизм для выбора значения – это новый выпадающий список. Этот список объединяет в себе несколько сущностей:

• Подобранные значения;
• История выбора;
• Список выбора (из соответствующего свойства элемента формы).

Он открывается по новой кнопке (кнопка выпадающего списка), при активизации поля ввода мышью и при подборе.

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

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

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

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

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

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

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

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

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

Новый дизайн

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

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

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

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

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

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

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

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

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

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

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