1 из 44

3 проблемы каналов ДБО,отталкивающие ваших клиентов

2 из 44

3 канала ДБО:

интернет-банк, мобильные приложения, банкоматы.

Интерфейс разный, проблемы общие.

3 из 44

3 самые проблемные области:

навигация;

подсказки и сообщения об ошибке;

ввод данных.

4 из 44

Навигация

5 из 44

Почему это важно

Хорошая навигация демонстрирует возможности системы («что тут есть»);

побуждает к исследованию системы;

дает возможность быстро и безошибочно выполнить свою задачу.

6 из 44

Главные проблемы

Непонятные названия разделов;

нелогичная структура разделов;

недостаточная или избыточная ширина «дерева» навигации;

неочевидное расположение элементов управления.

7 из 44

Нелогичное размещение элементов управления:

кнопка «отменить платеж» находится в правом верхнем углу

экрана и плохо заметна для пользователей

8 из 44

Неочевидная навигация в мобильном приложении:

кнопка «перевести» расположена в необычном месте, ее не замечают.

9 из 44

Другой пример нелогичного размещения элементов управления:

кнопка «да» незаметна;

кнопка «нет» автоматически воспринимается как единственный верный ответ.

10 из 44

Слишком широкое дерево навигации.

Пользователи теряются, увидев такое количество пунктов.

Верхнее меню также перегружено.

11 из 44

Еще один пример перегруженного меню.

12 из 44

Слишком узкая и запутанная навигация:

«Заявка на кредит» в колонке «Быстрое снятие наличных»;

непонятный пункт «другая сумма»;

много разнородных пунктов в разделе «другие операции».

Вверху – главный экран,

внизу – экран «другие операции»

13 из 44

Нелогичное название кнопки:

кнопка «Нажмите для возврата в меню» ведет на

следующий экран, а не в меню.

14 из 44

Нелогичное расположение разделов:

«Перевод с карты на карту» есть только на «внешнем»

экране приложения, а пользователи ищут его «внутри».

15 из 44

Нелогичное расположение разделов и кнопок

в интернет-банке: «История платежей» в разделе

«Оплатить услуги»;

Кнопка «Оплачивать услуги периодически» незаметна

для пользователей;

пользователи ищут эту возможность непосредственно

на странице платежа.

16 из 44

Что делать

Проверка навигации:– карточная сортировка;

– юзабилити-тестирование.

Создание навигации:– карточная сортировка;

– продумывание сценариев работы пользователей в системе.

Расположение кнопок на экране:

– порядок восприятия: сверху вниз, слева направо..

17 из 44

Ввод данных

18 из 44

Почему это важно

Минимизация ошибок пользователя, совершенных по невнимательности или неловкости;

уменьшение времени на совершение одной операции;

снижение порога вхождения в систему.

19 из 44

Главные проблемы

Неудобные элементы управления;

отсутствие группировки длинных цепочек цифр;

нелогичный порядок полей.

20 из 44

Распространенная среди мобильных приложений проблема:

клавиатура перекрывает кнопку «Продолжить»;

возможность перехода на другое поле/экран при помощи клавиши «Ввод» есть не всегда.

21 из 44

Неудачная виртуальная клавиатура:

мелкие кнопки, буквы сливаются с фоном

22 из 44

Проблема, характерная для многих систем ДБО:

длинные цепочки цифр не разбиваются на группы

23 из 44

Нелогичная последовательность шагов: сначала требуется

указать куда, а потом – откуда осуществляется перевод.

Естественная последовательность действий – обратная

(откуда-куда).

24 из 44

Перевод с рублевого счета на валютный.

Достаточно заполнить только одно поле «сумма»,

но пользователи пытаются заполнить оба и ошибаются.

25 из 44

Перевод юридическому лицу.

Название полностью вводится вручную,

никаких автоподстановок нет.

Юзабилити-тестирование показало, что пользователи

часто делают ошибки в этом поле.

26 из 44

При клике на поле курсор встает в место клика,

а не в начало поля. Пользователи этого не замечают

и делают ошибки.

27 из 44

Что делать

Подставлять данные автоматически там, где это возможно;

группировать длинные цепочки цифр;

соблюдать естественную логику выполнения задачи;

исследовать поведение пользователей (юзабилити-тестирование).

28 из 44

Подсказки и

сообщения об ошибках

29 из 44

Почему это важно

Минимизация ошибок пользователя, совершенных по незнанию;

повышение уверенности пользователя в правильности выполняемых действий.

30 из 44

Главные проблемы

• отсутствие;

• неудачное расположение;

• низкая степень информативности.

31 из 44

Пример отсутствия подсказки в мобильном приложении:

неизвестно, в каком формате указывать оплачиваемый период

32 из 44

Неудачное расположение подсказки:

• желтый фон,

• слишком большая длина

(даже на скриншот не поместилось);

• слишком далеко от поля.

Из-за этого текст не выглядит как подсказка, пользователи

его не читают.

33 из 44

Пример неполной подсказки: валюта перевода указана, а

ограничение по сумме – нет.

34 из 44

Оплата ЖКХ.

Нет пояснений, что указывать в поле «Дата оплаты»:

– в квитанции указан только месяц и год;

– при выборе будущей даты списание все равно

происходит немедленно

35 из 44

Пример слишком длинной подсказки:

чтобы ее понять, надо прочитать полностью;

в условиях дефицита времени это может быть критично.

36 из 44

Типичный пример неудачного расположения сообщения об ошибке:

внимание пользователя сосредоточено внизу, а сообщение –наверху.

Это особенно критично на длинных страницах.

37 из 44

Это же сообщение как показательный пример

неинфомативности: невозможно понять, в чем проблема

(опечатка в номере счета).

38 из 44

Сообщение, которое отображается при любой ошибке, со

стороны как пользователя, так и системы.

39 из 44

Плохо, когда сообщения об ошибке нет совсем.

Пользователь оплатил не того оператора.

На чеке ничего настораживающего.

У банкомата –технические ограничения, но эта же проблема характерна для других каналов ДБО.

40 из 44

Что делать

считать все очевидное неочевидным;

считать пользователей глупее, чем они есть на самом деле;

не лениться писать разные сообщения об ошибках;

тестировать заметность и достаточность подсказок на реальных пользователях

– возможно с применением eye-tracking

41 из 44

О чем еще

можно подумать

42 из 44

термины (банковские или «понятные»);

выписки: полнота информации и ее доступность для понимания;

способы подтверждения платежа;

обратная связь об успешности проведения операции.

43 из 44

Чем мы можем вам

помочь?Исследованияюзабилити-тестирование

юзабилити-аудит

карточная сортировка

исследование пользователей

Проектированиевеб-сайты

настольные приложения

мобильные приложения

Повышение конверсиинастройка GA и Яндекс.Метрики

A/B тестирование

«юзабилити-поддержка»

44 из 44

Будем рады

сотрудничеству!

Куколева Олеся

ведущий специалист

USABILITYLAB

Тел.: +7 (495) 933-01-37

o.kukoleva@usabilitylab.net

www.usabilitylab.ru

Специалист на проекте и автор презентации:

Мария Новикова, ведущий специалист USABILITYLAB

m.novikova@usabilitylab.net