кейси
Гуманізовані овочі та новий інтерфейс сайту: редизайн доставки продуктів OVO
24 Травня, 2021
Катерина Гончарова
Журналістка-редакторка у Telegraf.Design
Стати автором

Розповідаємо про те, чому і як OVO оновили свій сайт, показуємо оновлену айдентику від Fedoriv Agency та матеріали рекламної кампанії.

Редизайн сайту

Яким має бути сайт: аналіз поведінки користувачів

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

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

Ідея — цифровий супермаркет

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

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

Перший сайт сервісу розробили таким чином, щоб людина відчувала себе ніби в супермаркеті: спочатку купуєш овочі, потім фрукти, а в кінці зелень та сухофрукти з горіхами. У розробці нового сайту врахували те, що зі збільшенням асортименту все важче знаходити необхідні продукти. На оновленому сайті OVO залишили можливість переглядати всі товари на одній сторінці, а також додали окремі сторінки для кожної з категорій. Розробники дотримувалися принципів зручного вибору: огірки стоять поряд з томатами, а картопля — з буряком.

Перезапуск сайту: затримки, ітерації, оновлення

У квітні 2020 року OVO за сім днів зробили перший сайт і айдентиĸу. Тоді сайт працював повністю на ĸонструĸторі Tilda, тому було багато функціональних обмежень: проблеми з вибором ваги продуктів, додаванням нових товарів на сайт та формою для замовлень. Вже з осені сайт переїхав з Tilda на власну розробку, але зовнішній вигляд залишився схожим на попередній.

Попередня версія сайту Ovo

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

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

Три стадії у роботі з оновленням сайту:

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

Нова версія сайту Ovo

Оновлення на сайті:

  • зручніші навігація та пошук;
  • нові фото товарів;
  • зрозумілий вибір ваги (мінімальна вага та коригування невеликими кроками);
  • модифікований ĸошиĸ (легше обрати адресу і варіанти для зворотного зв’язку; можна одразу залишати чайові для кур’єрів);
  • розділ з рецептами (буде запущено невдовзі).

Оформлення замовлення на новому сайті OVO

Мобайл vs веб

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

Купівля продуктів на сайті без переходу на їхні сторінки

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

Перешкоди у роботі: підбір команди і фотографії

На старті в компанії вже була команда розробників, але OVO дуже довго не могли знайти усіх потрібних фахівців. Компанія найняла продаĸт-менеджера та беĸенд-розробниĸа, які потім і зібрали команду довкола себе. На одну закриту позицію надходило по 43 заявки.

Інша проблема — фотографії продуктів, адже один і той самий томат залежно від партії може мати різний відтінок. OVO вже зробили фото усіх продуктів, але продовжують обдумувати, як показати клієнтам саме той продукт, яĸий вони купують.

Пошук на сайті

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

Пошук на сайті

Коментарі до замовлень

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

Вибір ваги продукту

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

Доставка

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

Вибір часу для доставки

Рецепти

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

Розділ з рецептами

Айдентика та рекламна кампанія

Нову айдентиĸу для OVO розробила Fedoriv Agency. За словами Андрія Федоріва, агенція хотіла зробити рекламу, «яку нам би не затвердив жоден клієнт». Від зображень моркви на колесах зі старого сайту OVO дизайнери перейшли до теми гуманізованих овочів.

Стара версія логотипу

Персонажі для рекламної кампанії та айдентики OVO

Відео для соцмереж з рекламної кампанії OVO

Для комунікації час вибирали свідомо: за два дні до початку місцевих виборів восени, щоб овочі OVO були ще помітнішими: «У рекламі дуже важливо розуміти контекст. Не просто, що ви намалюєте, а й коли, де та як це з’явиться. Наші прекрасні помідори з’явилися практично замість політиків усього на сім днів», – Андрій Федорів.

Зовнішня реклама OVO від Fedoriv Agency

Результати

Після завершення комунікації показники OVO виявилися в середньому втричі-вчетверо вищими за ті, що були до неї. Стартап привернув увагу великої інвесторської компанії та вже восени 2020-го закрив новий раунд фінансування. Fedoriv Group також стали янгольськими інвесторами OVO.


Telegraf.Design живе за підтримки спільноти. Підтримуйте Telegraf.Design на Patreon.

avatar
Катерина Гончарова
Журналістка-редакторка у Telegraf.Design
Колонка

У нас є ще дещо для вас