Дизайн-агенція цифрових продуктів Excited зробила редизайн продукту XILO. Продукт працює на ринку США і має на меті спрощення та автоматизацію роботи страхових агенцій.

Після співпраці з Excited компанії вдалося завершити seed раунд, залучивши $2 млн інвестицій.

Олександр, дизайн директор та співзасновник агенції, розповів про дизайн рішення, процес співпраці та особливості продукту для ринку страхування США.

Нашу співпрацю з продуктом XILO, заснованим 2017 року, ми почали взимку 2020 – напередодні пандемії. Продукт працює лише в США – ринок страхування там дуже розвинений. За допомогою цього продукту страхові агенції автоматизують процес збору інформації від клієнта для оформлення страховки.

Коли оформлюється страхування, агенти заповнюють велику кількість інформації, яка впливає на ціну полісу. XILO дає можливість створити форму з усіма питаннями, на які має відповісти клієнт перед отриманням страховки. Агенції, які користуються продуктом, легко додають цю форму собі на сайт, де потенційні клієнти можуть самостійно відповісти на всі питання та отримати пропозиції щодо страхування авто, будинку, життя чи будь-чого іншого.

Основним запитом від клієнта на той час був редизайн одного з їхніх продуктів – Customer forms. Але нам одразу було відомо, що компанія має й інші продукти, які потрібно покращувати, й до яких потрібно додавати новий функціонал. Тож ми знали що потенційно це дуже об’ємний проєкт. Ще під час останніх фаз редизайну Customer Forms, ми домовились про наступні етапи роботи.

Попередній вигляд продукту XILO

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

В результаті у новій версії форм користувач бачить одне питання, але водночас розуміє, скільки з них вже заповнено, а скільки ще залишилось.

Нашою основною стратегією для нового дизайну форм було:

• зробити процес заповнення лінійним;
• знизити когнітивне навантаження, зменшивши кількість питань, які показуються одночасно;
• створити досвід користування схожий на розмову з агентом, де клієнт просто відповідає на конкретні питання.

Юзабіліті тестування

Перед тим як передати нову версію в розробку ми організували тестування юзабіліті. По-перше, визначили критерії наших користувачів. Ми вирішили тестувати форму для однієї з найпопулярніших страховок — страхування авто. Тож основними критеріями для нас були: 1)географія користувачів у США (ми старались обирати респондентів з різних штатів); 2) вік 21 — 60; 3) користувачі вже мають автомобіль та попередній досвід придбання автострахування.

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

Далі ми створили гіпотези, завдання для юзерів, підготували прототип та запросили користувачів до участі.

Першочергово ми перевіряли:

1. чи люди зрозуміють як побудована навігація між питаннями
2. чи зрозуміють різницю між питаннями з однією можливою відповіддю та декількома
3. чи розберуться як додавати декількох водіїв та декілька автівок в одну страховку.

Додаткові завдання перевіряли чи легко/складно повертатися користувачам до конкретного питання, чи розуміють вони різницю між різними пропозиціями, які їм пропонує сервіс тощо. Також в процесі розпитували людей як вони шукають і купують страховки, якими компаніями чи маркетплейсами користуються, який вигляд зазвичай у них має цей процес.

Основною ціллю для всіх користувачів, що взяли участь у тестуванні, було отримати quote (пропозицію ціни) для автомобільної страховки. Якихось суперумов в нас не було: люди вводили свою інформацію так, ніби вони користуються справжнім продуктом. Щоб у прототипі все виглядало максимально правдиво, ми напередодні запитали в кожного з учасників, яка в них марка авто. Цю інформацію додали в прототип, і як результат, все працювало максимально наближено до справжнього експіріенсу.

Прототип

Оскільки наш продукт мав велику кількість інпутів різних типів, дуже важливо було побачити як люди будуть ними користуватись: як вводитимуть різні типи даних, та як цей процес відрізнятиметься на мобільних телефонах.

Ми одразу розуміли, що прототип будемо створювати у Protopie. Важливо було мати функціонал справжніх інпутів, і потім всю введену інформацію (ім’я та інші особисті дані користувачів) відображати в потрібних місцях (наприклад, у підсумку перед оформленням страховки), щоб все було максимально схоже на користування справжнім продуктом.

Пошук користувачів

Ми вже не раз користувались сервісом з рекрутингу користувачів userinterviews.com, тож і в цей раз використали його для їх пошуку та відбору. Якщо ви маєте справу з ринком США, дуже рекомендую. Зараз до списку географії користувачів також додалась Канада, Австралія, Південна Африка та декілька європейських країн.

Читайте також: Як влаштована команда дизайн-агенції цифрових продуктів Excited

Результати тестування

Після восьми сесій ми дізнались декілька місць, які нам потрібно було покращити. Основні інсайти: людям не відразу було зрозуміло, як можна легко та швидко повернутись на попереднє питання, також важко було знайти як викликається секція підсумку (Summary), на деяких екранах, через їхній розмір, було складно знайти кнопку «Далі» (Next).
Ґрунтуючись на інсайтах, ми одразу ж після тестування оновили дизайн та підготували все до розробки.

Back office для створення форм, автоматизації та роботи з продажами

Наступним етапом, і найбільшим (ми й досі працюємо над цією частиною сервісу), було покращення наявного функціонала та створення нових фіч для вебдодатка, яким власне і користуються страхові агенції.

Одним з найскладніших завдань був дизайн Form-builder. За допомогою цього функціонала агенції створюють свої форми, налаштовують інтеграції з надсиланням даних в інші системи, та налаштовують процес автоматизації комунікації з клієнтом.

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

Один зі співзасновників XILO — страховий агент. Ми легко та швидко отримували від нього перший фідбек щодо рішень, оскільки він досконально знає індустрію, і до того ж повністю підпадає під критерій кінцевого користувача.

Також дуже помічним в нашому процесі є Тайлер — один з працівників customer support на стороні XILO. Він завжди присутній на наших дзвінках і знає проблеми, з якими стикаються користувачі, бо щодня працює над ][ розв’язанням. Тож ми регулярно чуємо від нього якісь інсайти.

Шляхом ітерацій, експериментів та фідбеків від користувачів ми зупинились на варіанті, де кожне питання мало свою секцію налаштувань та «живе» preview.

Основною проблемою що зупиняла ріст XILO був мануальний онбординг кожного клієнта. Для кожної агенції потрібно налаштувати платформу, а це великий пласт роботи. Наш новий інструмент для створення форм дозволив оновити та пришвидшити онбординг, покращити процес data mapping та налаштування автоматизацій. Тепер онбординг нового корпоративного клієнта відбувається майже без залучення команди сапорту.

Дизайн система

XILO складається з чотирьох продуктів: 1) форма для кастомерів: 2) форма для агентів; 3) вебдодаток для агенцій та 4) маркетинговий сайт. Щоб досягти консистентності бренду між всіма продуктами та на рівні компонентів і стилів, ми з самого початку мали чотири дизайн системи, компоненти з яких ми використовуємо у відповідних продуктах.

Маркетинг

Команда Excited була тісно залучена в маркетингові активності та працювала з командою XILO над дизайном нового сайту та його розробкою за допомогою Webflow. Також ми створили дизайн презентацій, які компанія використовувала під час інвестиційного seed раунду.

Ми продовжуємо роботу із XILO. Попереду ще багато амбітних цілей.