Как дизайнеры и аналитики Сбербанка объединили усилия для улучшения UX

Конспект доклада Сергея Никольского и Ольги Мазаевой (Сбербанк-Технологии) на UX марафоне 2017 “Аналитика поведения пользователей”

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

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

Image for post
Image for post

Интересуетесь свежими статьями по дизайну? Вступайте в группу на Facebook.

Новое. Журнал для digital-дизайнеров. Посмотреть, что за зверь.

Системами онлайн и мобильного банкинга Сбербанка пользуются более 40 миллионов пользователей с разным уровнем технической и финансовой грамотности. Естественно, все эти люди взаимодействуют с банком через ряд каналов:

  • Сайт
  • Интернет банк
  • Мобильный банк
  • Платежные терминалы
  • Банкоматы

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

Сергей и Ольга в своем выступлении рассказали о том, какие проблемы существовали между дизайнерами и аналитиками, и какое решение появилось в результате.

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

Сергей и Ольга привели в пример такой процесс, как оплата просроченной задолженности. Для пользователя оплата задолженности — это один цельный процесс, состоящий из шагов:

Image for post
Image for post
Процесс оплаты просроченной задолженности глазами пользователя

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

Image for post
Image for post
Тот же процесс контексте существования команд разной специализации

Когда в процесс вступает аналитик, ему необходим цельный прототип, который можно тестировать. Чтобы создать цельный прототип нужно объединять разные дизайн-команды, а на это уходит драгоценное время.

Image for post
Image for post

Конечно, когда дизайнер работает над страницей, он качественно ее прорабатывает: в соответствии с гайдлайнами, с использованием элементов из UI-кита, с целью сделать красиво и функционально.

Проблема в том, что дизайнер не видит всю картину, которую видит аналитик.

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

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

Image for post
Image for post
  1. Гипотезы. Дизайнер сам формулирует предположения о том, какую пользовательскую задачу решает на определенном этапе. У аналитиков большой накопленный опыт в этой области, они помогают с формулировкой гипотезы. Примеры правильных и неправильных (серым цветом) гипотез:
Image for post
Image for post
Image for post
Image for post
Image for post
Image for post

2. Сценарий. На основании гипотез прорабатывается логичный сценарий, в основе которого лежат цели пользователя.

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

Image for post
Image for post

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

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

Открытое UX-тестирование — это онлайн-тестирование которое проводится в СберТехе. За ходом тестирования дизайнеры могут наблюдать в режиме реального времени. Это дает возможность:

  • Найти свои ошибки
  • Внести правки до появления отчета
  • Посмотреть прототипы коллег
  • Оперативно протестировать свои гипотезы

Идея в том, чтобы дизайнер видел результаты своей работы “в реальной жизни” — это позволит ему усовершенствовать свои методы и улучшить будущие гипотезы.

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

Мобильное приложение «Заметки о психике» | Mental Notes

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

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

Скачать приложение в Appstore

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

Breezzly — это среда для тренировки digital-навыков. Здесь вы встретите комплекты видеокурсов в актуальных инструментах интерактивного дизайна, среди них Figma, Principle и Invision Studio. А каждый проект — это живой кейс с историей, собранной по горячим следам!

Посмотреть каталог курсов →

Written by

Ольга Жолудова. Копирайтер и переводчик. Беру переводы на заказ, делаю круто) Обращайтесь в директ >> https://www.facebook.com/nancy.pong4

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store