company_banner
28 ноября 2013 в 09:25

Обзор мобильного приложения «Ostrovok» для платформы Android

Мы подготовили очередной обзор приложения для Android, содержащий практические рекомендации по улучшению дизайна, архитектуры и эргономичности интерфейса. Сегодня мы поговорим о приложении «Ostrovok». Ранее мы уже рассмотрели приложения «@to Music», «auto.ru», «Pronto» и «ЖД Билеты». Обзоры подготовлены совместно с компанией UsabilityLab.

О приложении


Ostrovok – приложение для поиска и бронирования отелей. С его помощью можно подобрать и забронировать подходящий отель, введя данные банковской карты. Отличительные функции приложения: поиск отелей, находящихся рядом с пользователем, и бронирование отеля на ближайшую ночь в Москве, Санкт-Петербурге и Киеве со скидкой 60%.

Общий рейтинг приложения в Google Play по оценкам 231 пользователя достаточно высокий — 4,3. Большее количество пользователей оценили его функциональность в 5 звездочек.

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

Запуск приложения


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

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



Информация для разработчиков
Проблема
Критичность
Рекомендация
В всплывающем окне «Новая функция: Отель на эту ночь!» картинки не кликабельны. Клик по фотографии города должен переводить на форму поиска отеля в выбранном городе.

Навигация


В руководстве для разработчиков под Android подробно описаны стандарты Navigation Drawer. Но в приложении работают не все паттерны взаимодействия, предусмотренные руководством.

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

Навигационное Меню. В данном случае мы находимся на экране «Поиск отелей», который предусмотрительно отмечен в меню. И опять недочет – если пользователь по привычке нажмет на значок Навигационного меню еще раз, чтобы вернуться к экрану поиска отелей, то ничего не произойдет. Данный паттерн прекрасно работает в таких популярных приложениях как Facebook и Vkontakte. Пользователи уже привыкли к этому действию, и переучить их будет очень сложно.



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

Поиск отеля


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

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



При нажатии на поле с датами открывается календарь. Когда пользователь выбирает дату, в календаре автоматически выделяется следующее число. Это удобно. Но если пользователь ищет отель на несколько суток, ему нужно использовать жест «удержать и перетащить» (Swipe). Пользователю потребуется время, прежде чем он об этом догадается.

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

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

Сравним расположение вкладок в приложении Ostrovok и в руководстве для платформы Android. На скриншоте мы видим правильное расположение Action Bar, меню действий (1) и Tabs, вкладки (2).



Информация для разработчиков
Проблема
Критичность
Рекомендация
Вкладки (tabs) «Все отели» и «На эту ночь» находятся на месте меню действий (action bar) приложения. Разместить вкладки (tabs) ниже, под меню действий (action tabs). См. руководство по стилю.
Когда разворачивается поле «Выбор направления», клавиатура не появляется автоматически. Показывать клавиатуру, как только пользователь переходит к этому полю.
Для выбора нескольких дней в календаре нужно пользоваться жестом «удержать и перетащить» (swipe). Поддерживать жест простого нажатия (touch), чтобы пользователь мог выбирать даты двумя нажатиями.

Результаты поиска


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



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

На экране находится список фильтров для поиска, однако вкладки (tabs) «Фильтры» и «Сортировка» скрывают название приложения. Название приложения всегда должно быть на виду: и с точки зрения удобства пользователя, а также следуя руководству по стилю для платформы Android, tabs должны располагаться под action bar. На скриншоте приведено сравнение экрана приложения Ostrovok и Google Play, где панель вкладок находится под элементом Action bar.



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

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

Представим, что пользователь ищет размещение для двух человек в дешевом хостеле. Его вполне устроит кровать в общем номере на 8-10 человек, целый номер ему не нужен. Однако найти хостелы с таким размещением невозможно, хотя они и есть в системе. А все потому, что в поиске в поле «Количество гостей» было введено 2 человека. В этом случае только некоторые упорные пользователи смогут найти хостелы, догадавшись ввести в поиске «1 гость».



Информация для разработчиков
Проблема
Критичность
Рекомендация
Невозможно найти дешевый хостел, если пользователь ищет размещение для двух и более человек. Показывать в результатах поиска варианты проживания в хостелах, где люди размещаются в общих номерах.
В результатах поиска шрифт слишком мелкий и недостаточно контрастный. Сделать тексты более контрастными.
Вкладки (tabs) «Фильтры» и «Сортировка» находятся на месте меню действий (action bar) и закрывают название приложения. Разместить вкладки (tabs) ниже, под меню действий (action tabs). См. руководство по стилю.
На экране с фильтрами нет кнопки для применения фильтров. Добавить кнопку для применения фильтров и возврата к списку отелей. Это может быть кнопка «Применить фильтры» или «Отфильтровать».
Приложение не запоминает сортировку, которую установил пользователь в прошлый раз. У пользователя должен быть выбор запомнить сортировку или обнулить.
После клика по типу сортировки приложение не переводит пользователя на отсортированный список отелей, а остается на этом же экране. По клику на какой-либо вид сортировки, перемещать пользователя на отсортированный список отелей.
Сортировка – это функция, которая часто используется, но чтобы до нее добраться нужно сделать 2 клика. Рекомендуется поставить в меню действий (action bar) прямую ссылку на сортировку результатов поиска.
В поле «Расстояние до отеля (в метрах)» не указано, какое расстояние имеется в виду. Обозначить точку отсчета расстояния.


Информация об отеле


На странице отеля пользователя в первую очередь интересует расположение, количество звезд, отзывы, стоимость и виды номеров, информация о питании, wi-fi, наличие сейфа и др. Эта информация должна быть представлены в кратком и удобном виде, чтобы текст или символы были понятны.

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

Судя по обратной связи от пользователей на Google Play, в приложении не хватает отзывов об отелях.

Кроме того, указывается рейтинг отеля без пояснений, по каким параметрам он присвоен.



Описание отеля представлено в виде длинного текста, хотя наиболее эффективным и простым решением будет переход от сплошного текста к легко читаемым спискам.

Информация о номерах находится в самом низу экрана с описанием отеля, вполне вероятно, что пользователь так её и не увидит.



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

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

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

Бронирование


На первом экране пользователь вводит информацию о себе и контактные данные, на втором экране — реквизиты банковской карты.

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





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

Немного о хорошем


На самом деле, некоторые функции приложения достойны похвалы.
  1. Отели можно добавлять в избранное.
  2. Есть возможность найти отель на ближайшую ночь, что очень нравится пользователям, судя по отзывам в Google Play.
  3. При включенном gps пользователь может посмотреть список ближайших отелей.

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

Подведем итог


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

Резюме для разработчиков по масштабу критичности всех обнаруженных проблем:
Проблема
Критичность
Рекомендация
При вводе несуществующего или неверного номера карты, CVV или других некорректных данных, приложение не сообщает пользователю об ошибке, а напротив говорит, что все хорошо. Данная проблема может привести к тому, что пользователь совершив ошибку при вводе данных, может потерять, как ему кажется, «забронированный» номер. Поэтому важно, чтобы приложение проверяло данные карты до того, как сообщить о результате бронирования.
Невозможно найти дешевый хостел, если пользователь ищет размещение для двух и более человек. Показывать в результатах поиска варианты проживания в хостелах, где люди размещаются в общих номерах.
Вкладки (tabs) «Все отели» и «На эту ночь» находятся на месте меню действий (action bar) приложения. Разместить вкладки (tabs) ниже, под меню действий (action tabs). См. руководство по стилю.
Пользователям может быть не понятно, как просмотреть фотографии отеля. По нажатию на фотографии отеля переходить к просмотру фотографий. Также можно слева и справа от фотографии показать фрагменты других фотографий, чтобы пользователь понял, что их можно пролистывать.
В приложении нет возможности читать отзывы. Добавить в приложение возможность чтения отзывов об отелях.
Информация об отеле представлена одним сплошным текстом, который трудно читать. Визуально разбить текст на блоки и сделать его более читабельным.
Нет возможности почитать подробную информацию о номерах. Добавить больше информации о номерах по клику по номеру.
Навигационное меню Navigation Drawer не закрывается с помощью кнопки Возврат телефона, вместо этого происходит полный выход из приложения. По нажатию на кнопку «Возврат» телефона должен просто закрываться Navigation Drawer и происходить возврат в текущий экран приложения.
В результатах поиска шрифт слишком мелкий и недостаточно контрастный. Сделать тексты более контрастными. По бледно-серому нужно писать более темным цветом, например, черным.
Вкладки (tabs) «Фильтры» и «Сортировка» находятся на месте меню действий (action bar) приложения. Разместить вкладки (tabs) ниже, под меню действий (action tabs). См. руководство по стилю.
На экране с фильтрами нет кнопки для применения фильтров. Добавить кнопку для применения фильтров и возврата к списку отелей. Это может быть кнопка «Применить фильтры» или «Отфильтровать».
Приложение не запоминает сортировку, которую установил пользователь в прошлый раз. Приложение должно запоминать сортировку, которую установил пользователь.
После клика по типу сортировки приложение не переводит пользователя на отсортированный список отелей, а остается на этом же экране. По клику на какой-либо вид сортировки, переводить пользователя на отсортированный список отелей.
Когда разворачивается поле «Выбор направления», клавиатура не появляется автоматически. При разворачивании данного поля сразу же раскрывать клавиатуру.
Для выбора нескольких дней в календаре нужно пользоваться жестом «удержать и перетащить» (swipe). Поддерживать также жест простого нажатия (touch), когда пользователь сможет выбирать начальную и конечную даты двумя нажатиями.
При нажатии на выделенный пункт навигационного меню ничего не происходит. По нажатию на выделенный пункт меню должен происходить возврат на активный экран приложения.
В сообщении о новой функции «Отель на эту ночь» фотографии городов не кликабельны. Клик по фотографии города должен переводить на форму поиска, в которой должен быть установлен выбранный город.
Сортировка – это функция, которой пользователи пользуются часто, но чтобы до нее добраться нужно сделать 2 клика. Рекомендуется поставить в меню действий (action bar) прямую ссылку на сортировку результатов поиска.
В поле «Расстояние до отеля (в метрах)» не указано, какое расстояние имеется в виду. Уточнить, какое расстояние имеется в виду. На данный момент об этом можно только догадываться.


Developers Relations Team, Google Россия
Автор: @Developers_Relations
Google
рейтинг 172,43
Филин Лаки

Комментарии (7)

  • +6
    «При вводе несуществующего или неверного номера карты, CVV или других некорректных данных, приложение не сообщает пользователю об ошибке, а напротив говорит, что все хорошо.»

    Браво. (FACEPALM)
  • –3
    Что еще одно внешне управляемое приложение оболочка «Над всем»? У меня уже есть две оболочки Firefox и Chrom, и управляю я ими сам.
  • +3
    По-моему, это образец того, как приложение делать не надо.

    Очень много фейлов в плане гайдов, фейл с номером карты просто фееричен!
    • +2
      Вы правы, есть несоответствия гайдлайнам Android, как минимум Action Bar.
      Мы (Ostrovok.ru) специально попросили Google и UsabilityLab оценить первую версию приложения, чтобы провести работу над ошибками.

      • 0
        Этого можно было бы избежать, если бы разработчик сразу делал по гайдам )

        Мы тоже по паре проектов получили рекомендации Гугла (впрочем их не сложно найти в секции Лучшие Приложения 2013), но в тех вопросах/моментах, когда надо что-то улучшить по их мнению, а не переделать так как должно было быть с самого начала.
        • +1
          Сегодня мы исправили ряд проблем в приложении, в добавок добавили возможность бронировать отели без банковской карты http://ostrovok.ru/android.

Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

Самое читаемое Дизайн