11.4.24

UX-мечты в Циан: исследование, дизайн, разработка

UX-мечты в Циан: исследование, дизайн, разработка
No items found.

Перед тем, как взяться за разработку чего-то нового, мы должны убедиться в том, что это принесёт пользу и бизнесу, и пользователям. За это отвечает команда Discovery, которая состоит из продакт-менеджеров, исследователей, дизайнеров, аналитиков и UX-редакторов. Рассказываем, как этот процесс работает в Циан.

Рождение гипотезы

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

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

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

У нас появилась  гипотеза о том, что если мы упростим путь пользователя и минимизируем риск ошибки при создании объявления, это повысит конверсию в публикацию.

Владимир Кулишин, Team Lead команды «Собственники»: Повышать конверсию можно двумя способами. Первый — реагировать на изменения рынка и своевременно добавлять для пользователя фичи, чтобы у него была высокая мотивация заполнить всю форму и опубликоваться. Второй — убирать барьеры при публикации, то есть добавлять какие-то подсказки, проверку данных. Оба способа предполагают регулярное внесение изменений в форму подачи, которые обходились бы слишком дорого: необходимо нарисовать дизайн и реализовать логику для всех платформ, на которых представлен Циан: обычный сайт, сайт для мобильных устройств, iOS и Android.

Какая проблема была в разработке, как она касалась пользователя и как мы переписали форму подачи объявления под Backend-Driven UI, Владимир Кулишин подробно рассказал на Frontend Conf. Можно послушать доклад и скачать презентацию 👀

Качественное исследование

Наши пользователи делятся на две сегмента: риелторы и собственники недвижимости. Как они подают объявления? Мы решили начать исследование с тех, кому приходится создавать объявления чаще — риелторов.

МОни создавали объявления, а мы собирали аналитические данные и проводили глубинные делали custdev-интервью. Во время беседы риелторы создавали объявления, а мы: спрашивали, что вызывало сложности и почему, чего не хватает, что можно было бы улучшить. Следующий этап – это анализ интервью. Важно не просто описать действия, но проследить паттерны в мышлении и поведении респондентов. А еще понять, почему они мыслят и действуют так. Мы составили список проблем, которые нашли во время тестирования. Затем каждую проблему приоритизировали по тому, насколько она блокирует выполнение главной задачи – выложить объявление. После этого исследователь и команда продукта разрабатывают варианты решения. Часто их может быть несколько на одну проблему: например, если пользователи не замечают важный элемент, его можно сделать ярче, перенести в другое место или вообще поменять пользовательский сценарий. Команда вместе ищет оптимальное решение. После начинается вторая итерация работы над прототипом. В первую очередь в работу берутся самые критичные проблемы – из-за таких пользователи не могут выполнить задачу и уходят или обращаются в поддержку. Но мы хотим предотвратить и то, и другое.   Так нам удалось оформить предположения в прототип.

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

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

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

Прототипирование и количественный анализ

На основе качественных данных мы формируем прототипы нескольких вариантов решений, которое затем тестируется на пользователях. По результатам этого тестирования мы определяем, какой именно вариант мы передадим в разработку. Имея уже готовое решение, мы проводим  коридорное и A/B-тестирование, что посмотреть на поведение пользователей на сайте и найти проблемные места,  также провести доработку элементов интерфейса и текста, которые могут повлиять на UX.

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

Eщё про команду:
Маленькие традиции большой компании
Маленькие традиции большой компании
Команда продуктовой вертикали
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.
UX-мечты в Циан: исследование, дизайн, разработка
UX-мечты в Циан: исследование, дизайн, разработка
Команда продуктовой вертикали
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.
Главное о команде
Главное о команде
Команда продуктовой вертикали
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.
Почитать о других:
Главное о команде
Главное о команде
Команда DevOps инженеров
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.
Как мы поддерживаем командный дух
Как мы поддерживаем командный дух
Команда разработчиков мобильного приложения
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.
Мой коллега — псих: самые странные привычки соседей по офису из первых уст
Мой коллега — псих: самые странные привычки соседей по офису из первых уст
Core Team
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.
Главное о команде
Главное о команде
Команда редакции приложения
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.
Как мы упрощаем жизнь всей компании
Как мы упрощаем жизнь всей компании
Команда Fullstack разработчиков
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.
Главное о команде Golang-разработчиков
Главное о команде Golang-разработчиков
Команда Golang-разработчиков
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.