Українська ІТ-компанія Uklon знайома більшості саме завдяки однойменному застосункові виклику авто. Через російське вторгнення 24 лютого компанії довелось переглянути 50% продуктового плану. На перше місце вийшов запуск проєктів для українців «Волонтер» та «Евакуація», що допомагали з трансфером населення, доставкою продуктів, медикаментів та інших необхідних речей. Через кілька місяців команда продакт-дизайнерів, розробників та дизайнерів повернулись до проєкту, над яким працювали до 24 лютого. Мова про запуск SuperApp. Одним з найбільших викликів була зміна головного екрану Uklon під новий флоу замовлень. Артур Шефнер, Lead Product Designer, та Ростислав Матюк, Product UX/UI Designer, розказують, як відбувалось оновлення додатка, які інсайти винесли з тестування серед користувачів та чому очевидні речі далеко не завжди очевидні.
ПРОСТА-СКЛАДНА ЗАДАЧА: ЗРОБИТИ НОВЕ, НЕ ЗРУЙНУВАВШИ СТАРЕ
Все почалось, коли команда Uklon в тестовому режимі запустили сервіс доставки ще на початку пандемії COVID-19. Приблизно 2 роки продукт існував собі, його ніхто не чіпав. У цей час команда займалася іншими задачами, а за доставкою просто спостерігали. Та близько року тому компанія вирішила виділити на цей напрямок окрему команду і почати ітерувати. Перед командою поставили завдання: відділити доставку від основного флоу застосунку, і при цьому не «похерити» основний продукт – райдхелінг (замовлення машини через додаток), розповідає Артур.
Фактично, треба було зробити так, щоб стало простіше інтегрувати в додаток окремі незалежні сервіси, і не обвалити при цьому метрики замовлень ключових класів авто, зазначає Ростислав. Тоді постало питання: як зробити інтерфейс, щоб він був універсальний і готовий показувати різну кількість сервісів в залежності від міста (адже не весь перелік послуг доступний у кожному місті).
ЯК ПРИЙШЛИ ДО ТОГО, ЩО ТРЕБА НОВИЙ ГОЛОВНИЙ ЕКРАН
Коли хлопці зрозуміли, що мова йде про окремий підпродукт, і Uklon де-факто стане SuperApp, потрібно було «видалити зі своєї голови» традиційний до цього флоу «звідки — куди — на чому». Замість цього треба було подумати, як грамотно направити користувача на вже знайомий продукт, провести його відносно новим флоу, проте не викликати в нього реакцій на кшталт «а це шо за фігня?». Додатково до цього, ще й мінімізувати зміни для тих користувачів, які відкривають Uklon саме для виклику авто. На фініші мало вийти щось звичне, проте краще і «свіже». Ростислав порівнює це зі створенням такого собі «комбайну» для вирішення різних потреб користувачів. І як вже потім в процесі роботи стало зрозуміло, що цей «комбайн» трохи не «вміщувався» у нинішній вигляд головного екрану. Тому вирішили його теж трохи оновити, але залишити все на своїх місцях.
ІТЕРАЦІЯ ЗА ІТЕРАЦІЄЮ НА ШЛЯХУ ДО «ДИЗАЙНУ-ЦУКЕРОЧКИ»
До дизайну заходили здалеку. Починали з чогось кардинально іншого, дикого, без техобмежень та ігноруючи думки продуктової команди і юзерів. Повна свобода! Тож, для початку перемальовували «1 в 1» рішення прямих і непрямих конкурентів. Надихались ще продуктами, які взагалі не пов’язані з індустрією.
Це команда дещо копіювала та намагалась зрозуміти логіку конкурентних продуктів
Крутили, «приміряли» патерни дизайну цих додатків на бізнес-цілі компанії й паралельно висували гіпотези, чому прямі або непрямі конкуренти вдалися саме до таких рішень. Дещо для себе розкусили та побачили особливості в підходах у «неповоротких» глобальних гравців, але не хочеться розкривати всі карти ?
Пробували ще й такі варіанти. Тут зміни в UI були мінімальні, більше гралися з економією місця та розташуванням продуктів. Але цей варіант відсіяли.
Так крок за кроком наближались до фінальної версії. Проте вирішили не давати такий великий акцент на кнопки «Додому/робота», щоб не відволікали від сервісів, які винесли на головний екран.
Проводили тестування та збирали інсайти від користувачів різними шляхами. Так, під час роботи відбувалась одна конференція, де виступав CMO Uklon Вадим Іщенко. В рамках цієї конфи кожен відвідувач отримував промокод від Uklon на майбутню поїздку. На наступному продуктовому комітеті після конференції Вадим розказав, що до нього підходили люди і запитували «де ж їхній промокод?».
Дізнатись про промокод можна було у двох місцях екрана: 1) маленький інформер на кнопці бургера та 2) інформ-полоса на екрані підтвердження замовлення (тобто вже після вибору «звідки — куди»). Зрозумівши, що ці точки неочевидні, ми додали аналогічну інформ-полосу на головний екран. Як результат – значно підвищили конверсію промо-кампаній.
Варіанти, які вже були наближені до фінального та мали інформери промокодів
Хлопці знали, що низка варіантів відсіються, але класно було відповідати собі «чому саме це не підходить». Потроху, компонент за компонентом, почало вимальовуватись те, що теоретично могло б спрацювати. «На фініші вийшла цукерочка. Проте були побоювання, що зміни можуть бути надто кардинальними для нашого користувача», – зазначають в Uklon.
Попри те, що юзабіліті тестування прототипу проходило просто супер, а інтерфейс був інтуїтивно зрозумілим, вирішили не виливати все в одному релізі. Відкотили дизайн до варіанту, що був схожий до звичного. Проте та, фінальна, версія чекає свого часу. Чекає, поки користувач адаптується.
Який вигляд зараз має головний екран SuperApp
ЯК ПРОХОДИВ ПРОЦЕС ТЕСТУВАННЯ СЕРЕД КОРИСТУВАЧІВ
Роботу над задачею команда почала рік тому. Процес від конкурентного аналізу до передачі макетів команді розробки зайняв близько трьох місяців. Завжди були в контакті з BA, PO. Частенько бігали до розробників із питанням «а ви таке зможете реалізувати?». Ну і звісно – користувачі. Тестували на них гіпотези та правили власні рішення.
Наприклад, в процесі редизайну головного екрану, перебуваючи на стадії «зробити сексі», ми захотіли змінити кнопку вказування під’їзду. Зараз там текстом: «під’їзд». Обрали в бібліотеці іконку вхідних дверей, екран гарно розділився на блоки.
Пішли тестити. Всі користувачі подумали що це вихід з додатку. І тут ми запитали себе: «А з чого ми взяли, що існує користувач, який коли-небудь бачив іконку під’їзду?:)». І залишили текст.
Це Ростислав під час тестування
Коли тестували серед користувачів старшого віку (одним з них був охоронець у будівлі нашого офісу), зрозуміли що неймінг деяких продуктів абсолютно не очевидний. Слово «share» асоціювали як якась шара, але її там нема. «Driver – це шо? Драйвери на комп?». Зараз різні неймінги проходять A/B тест – побачимо, що з того вийде.
ЩО ЗАРАЗ
Основна задача залишається: не обвалити метрики райдхейлінгу. Бо якщо обвалити — то це вже все, провал.
Всі розуміли, що є фактор звикання до нового інтерфейсу, що може повпливати і на конверсію, і на task success.
На момент написання статті, новий дизайн вилитий на 50% юзерів Чернівців, Одеси та Львова (а це десятки тисяч користувачів, які прям тут і зараз користуються продуктом). І попередньо все окей. Так, у нас очікувано трохи виріс task success (час від запуску до розміщення замовлення). Користувачі знайомляться з інтерфейсом та сервісами, класами на головному екрані. Але згодом цей показник вирівнявся і навіть для напряму ride-hailing став меншим на 2 секунди. Ми виграємо і в конверсії від запуску до розміщення замовлення – він для Super App на 1% вищий. Ще рано святкувати, але позивні моменти вже фіксуємо!
КОРОТКІ ВИСНОВКИ ВІД ДИЗАЙН-КОМАНДИ UKLON
По-перше, корисно залучати до процесу більше людей. Що більше думок, то краще. Два дизайнери змогли придумати іконку «під’їзду». Третій міг би вчасно нас зупинити 🙂
По-друге, сміливо залучайте дев-команду і детально робіть рев’ю напрацювання до юзабіліті тестування. Це дозволить уникнути додаткових ітерацій.
По-третє, частіше запитуйте «чому?» – як і про нові ідеї, так і про вже реалізований функціонал. Артур, наприклад, не був залучений до розробки інтерфейсу, який лежить в основі додатка. Через це мусив ритись в старих дослідженнях, щоб зрозуміти, чому саме це рішення було прийнято. «На жаль, рився деколи після того, коли нагенерили 3-5 рішень, які потім просто видалялись через 1 речення з репорту в Confluence».