UX Рефакторинг. Вверх с вершины. Начинайте изменения с последнего шага

Kirill Kuzmin — less + more
lessplusmore
Published in
10 min readFeb 25, 2019

--

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

Ближе к концу — меньше риски, влияние ошибок и проще исправлять

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

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

До конечных целей доходят единицы. Если конверсия достигла 3–4%, то считайте, что повезло.

Естественно, на рынке множество техник и методик как попробовать увеличить превращение посетителей в покупателей. Объединяет их всех одно — если вы начинаете с любого этапа, кроме последнего, то эти изменения аналогичны попыткам носить воду решетом, наливая больше воды. Хотя, в первую очередь, нужно сделать поменьше дырочек. Еще лучше было бы — изначально взять ведро или миску.

Из теории вероятности известно, что достижение события на данном этапе воронки — это произведение вероятности событий на предыдущих этапах.

Конверсия в данном контексте — это вероятность прохождения этого этапа, изолированного от воздействия других. Например, жена нашла в онлайн-магазине товары, сложила в корзину и переслала вам для оформления заказа и дальнейшей оплаты. Вот сколько таких мужей оформят заказ — как раз конверсия этого шага.

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

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

Но вот если изменение было на последнем шаге, дальше уже не на что влиять. Это минимизация воздействия ошибок на систему. Да и пользователей там сотые доли от изначальных. Ваш позор будет не так виден (минимизация репутационных издержек).

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

Связность или Изоляция? Равновесие Нэша или эффективность Парето?

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

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

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

Концепция связности широко применяется в некоторых отраслях. Например, в лингвистике, программировании или математике. Просьба не путать с концепцией равномерной связности (Uniform Connectedness) в дизайне, пришедшей из гештальт-психологии.

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

Чтобы перейти к следующему равновесному состоянию потребуется одновременно изменить несколько частей конструкции, сайта или приложения. Например, вы захотели продавать наборы товаров (bundle):

  • как рассчитывать цену и выдавать на поиске?
  • как отображать эти товары в корзине?
  • как возвращать один товар из набора и как это учесть на стороне сайта?

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

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

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

Концепция изоляции известна в программировании и при работе с СУБД. С тем же успехом ее можно применять при анализе систем, чтобы отделить изменяемые части.

Изоляция — это обратная сторона связности

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

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

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

“Всякое изменение, которое никому не приносит убытков, а некоторым людям приносит пользу (по их собственной оценке), является улучшением” (с) В. Парето

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

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

Изолируйте последние шаги процесса и меняйте их, не трогая другие

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

Где границы воронки?

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

Дональд Норман определял UX так: “Пользовательский опыт охватывает все аспекты взаимодействия конечного пользователя с компанией, ее товарами и услугами”.

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

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

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

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

Но для них-то форма оплаты у вас на сайте — первый шаг в их воронке.

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

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

Сильная связность — это неправильно, но и слабая тоже неправильно. Нужен баланс между связностью и изоляцией.

Гордиев узел изоляции и связности надо развязать, а не разрубить.

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

Всеми любимый Uber также пример замечательного связывания воронок пассажира и таксиста. Где кончается воронка пассажира — органично вплетено начало воронки таксиста.

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

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

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

Страх новизны против эффекта владения

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

А если изменение в конце? Да, там тоже есть этот риск. Но пользователь уже прошел почти весь путь и осталось сделать этот последний шаг (например, оплату товара). Он уже высоко замотивирован, потому что в игру включился эффект владения. Мы сильнее боимся потерять то, что уже имеем. А если вы уже нашли нужный товар в поиске, заполнили необходимые формы с адресом для доставки, то в голове вы уже мысленно представили что он ваш, как будете его использовать, что скажут родственники и друзья и т. д.

Кстати, этим прекрасно пользуются продавцы, когда заявляют о том, что осталось совсем немного, последние запасы на складе и подобные рекламные ходы. Тут они задействован принцип дефицита основанном на том же мнимом обладании: “Удовольствие заключается не в испытании на опыте дефицитного товара, а в овладении им”, Роберт Чайлдини, “Психология влияния”.

Более явное применение эффекта владения видим у уличных торговцев. Часто в руки прям таки насильно впихивают вещь, чтобы вы подержали или примерили, а потом начинается торг.

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

Правило двойного пика

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

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

Тут два момента:

  • изменения, сфокусированные на последнем шаге, позволяют быстро улучшить последнее эмоциональное переживание пользователя. Оно проще определяется, чем первый пик, который возможен как с положительным окрасом (на этом сайте я нашел нужный товар!), так и с отрицательным (ну вот зачем они ввели это обновление при оформлении заказа?!)
Очередь в первый макдональдс, 1990 г.
  • если внедряемое изменение является максимально негативным переживанием при работе с процессом (первым пиком) и находится в конце, то есть возможность компенсировать его позитивной эмоцией от успешного завершения всего процесса (вторым пиком). Да, на сайте сделано обновление и пользователь его видит сразу, но оно помогает ему более быстро и просто завершить процесс и достигнуть цели. Совпадение двух пиков на последнем этапе, один гасит второй. Для примера показана очередь в первый Макдональдс в Москве, в 1990 году. Люди стояли часами (огромный негативный первый пик), чтобы купить заветный гамбургер в конце (второй пик).

Стреляйте в яблочко

Распределение пользователей по достижению цели в процессе (например, покупка товара на сайте) можно описать колоколообразной кривой, на которой часть не купит точно (случайно попали на сайт), часть купит однозначно и часть между ними, которая определится в процессе.

Работа с изменениями на последнем этапе — это работа с самой целевой частью аудитории.

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

Facebook: facebook.com/lessplusmore
Telegram: t.me/lessplusmore
VKontakte: vk.com/lessplusmore
Twitter: twitter.com/lessplusmore

Если вам понравилась статья — не стесняйтесь апплодировать!

Отдельное спасибо Wova Roodnyy за идеи, методику и консультации.

--

--