Дизайн BinaryDistrict Russia
1 719

Будущее UX: как сделать мобильное приложение удобным для каждого

Персонализация мобильных приложений — один из самых заметных трендов последних лет. Индивидуальный подход к потребителю начинает восприниматься как норма. Как сделать интерфейс приложения наиболее удобным для пользователей, рассказал руководитель отдела UX компании MOVER, спикер курса Product Design Weekend в Binary District Василий Гордеев.

В закладки
Аудио

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

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

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

Определять паттерны

Анализ поведения пользователей можно разделить на три этапа. Сначала надо установить некие входные данные и определить исходный пользовательский паттерн.

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

Третий этап — анализ собранной по меткам статистики. На этом этапе пользователей разбивают на различные группы. Некоторые аналитические сервисы сами предлагают такие группы: например, «девушки между 20 и 30 годами» или «мужчины за 40 лет». Обычно для этого используют самые простые признаки: пол, возраст и так далее. Анализ позволяет узнать, какой паттерн характерен для реальных клиентов компании.

Пример: после запуска первой версии приложения MOVER мы выяснили, что чаще всего им пользуются девушки, которые работают в офисе. Таких клиентов было больше 60%: однажды мы ради шутки даже изменили цвет приложения на розовый. Обычно они заказывали перевозку в конце рабочей недели, по пятницам. Девушки проходили пользовательский путь внутри приложения намного быстрее, чем мужчины. Это было связано с тем, что в начале они обращали внимание на меньшее число деталей. Для них было неважно, «Газель» повезет груз или Porter (грузовики «Газель» и Hyundai Porter — предмет постоянного обсуждения и сравнения на автомобильных форумах — прим. ред.). Главное, чтобы в эту машину все влезло и перед заказом можно было посмотреть, сколько стоит каждая отдельная услуга.

Василий Гордеев 

Внедрять изменения

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

После того, как новые элементы внедрены, на них ставят метки и смотрят, что получится. По-хорошему, надо также делать А/В-тестирование. Разбивать клиентов на две группы: для одной вводить изменения, для другой — нет, и изучать, насколько быстро они будут проходить пользовательский путь. Цель — чтобы они провели в приложении меньше времени, но потратили больше денег.

Мелкие изменения в любом приложении нужны постоянно. У нас они делаются раз в неделю-две. Заметные изменения — раз в три месяца. Например, сейчас у нас изменился основной пользовательский паттерн: услугами грузоперевозок стали пользоваться юрлица, которые выдают себя за обычных юзеров. Исходя из этого, мы разрабатываем обновления и скоро будем апдейтить приложение.

Отслеживать реакцию на апдейты

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

Сколько времени понадобится для того, чтобы понять, что изменения были неэффективными, зависит от количества пользователей. Facebook или Google может хватить нескольких минут, чтобы принять решение. Условно — перекрасят их дизайнеры кнопку в зеленый цвет для 1% пользователей в Азии, и практически сразу увидят, хорошая ли это идея. Им не нужно долго ждать, потому что у них миллиард пользователей.

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

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

Сокращать расстояние между дизайном и разработкой

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

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

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

Материал опубликован пользователем. Нажмите кнопку «Написать», чтобы поделиться мнением или рассказать о своём проекте.

Написать
{ "author_name": "BinaryDistrict Russia", "author_type": "self", "tags": [], "comments": 0, "likes": 26, "favorites": 29, "is_advertisement": false, "subsite_label": "design", "id": 53936, "is_wide": false, "is_ugc": true, "date": "Thu, 20 Dec 2018 16:50:28 +0300" }
{ "promo": {"title":"\u0411\u0435\u0441\u043f\u0438\u043b\u043e\u0442\u043d\u0438\u043a \u0432 \u0412\u0435\u0433\u0430\u0441\u0435","order_id":0,"state":80,"description":"\u0420\u0430\u0441\u0441\u043a\u0430\u0437 \u00ab\u042f\u043d\u0434\u0435\u043a\u0441.\u0422\u0430\u043a\u0441\u0438\u00bb \u043e CES","email":"kontsarenko@gmail.com","button_text_id":0,"link":"https:\/\/vc.ru\/yandex.taxi\/56184-bez-cheloveka-v-voditelskom-kresle-ne-kataetsya-nikto-a-my-nachali","app_store_link":null,"google_play_link":null,"color_id":1,"rejection_reason_text":null,"image":"{\"type\":\"image\",\"data\":{\"uuid\":\"fde0aad4-708e-e885-d18c-427be9d10fcd\",\"width\":488,\"height\":487,\"size\":70187,\"type\":\"jpg\",\"color\":\"1a1513\",\"external_service\":[]}}","total":15000,"with_payment":false,"dates":"[{\"year\":\"2019\",\"month\":\"01\",\"day\":\"24\",\"available\":\"true\",\"price\":\"15000\",\"discount\":\"0\",\"format\":\"backend\"}]","hits_count":40177,"scrolls_count":0,"clicks_count":123,"hits_limit":0,"scrolls_limit":0,"clicks_limit":0}, "link": "https://vc.ru/redirect?hash=1a74d55c23feefca512c69875bff37fcbe384ca617a5148499bcd799df76df7f&component=booster&id=113&type=daily&target=entry&url=aHR0cHM6Ly92Yy5ydS95YW5kZXgudGF4aS81NjE4NC1iZXotY2hlbG92ZWthLXYtdm9kaXRlbHNrb20ta3Jlc2xlLW5lLWthdGFldHN5YS1uaWt0by1hLW15LW5hY2hhbGk=", "buttonText": "Узнать", "location": "entry", "id": "113" }
{ "id": 53936, "author_id": 128754, "diff_limit": 1000, "urls": {"diff":"\/comments\/53936\/get","add":"\/comments\/53936\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/53936"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 199114, "possessions": [] }

Комментариев нет 0 комм.

Популярные

По порядку

0
{ "page_type": "article" }

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } } ]
Команда калифорнийского проекта
оказалась нейронной сетью
Подписаться на push-уведомления
{ "page_type": "default" }