Дизайн интерфейса Яндекс Здоровья

Помогли проверить гипотезу, что трафик на инструкции к лекарствам можно конвертировать в покупателей

Клиент

Яндекс Здоровье

Платформа

Веб, мобильная

версия

Что сделали

Проектирование, дизайн интерфейсов, UI-кит, тексты

Ссылка

Сайт (в архиве)

Всё начиналось с Яндекс Здоровья, где был каталог лекарств с инструкциями. На эти страницы приходило много SEO-трафика. У клиента появилась гипотеза, что этих пользователей можно превратить в покупателей лекарств.

Наши задачи:

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

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

Мы проработали типографику, выбрали цвета и нарисовали пиктограммы.

Цвета

Шрифты

Иконки

Все гипотезы сначала проверяли в мобильной версии — основной трафик был там. И только после удачного А/В-тестирования рисовали декстопную версию. Ее тоже проверяли через A/B-тесты.

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

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

Добавили на экран блок с картой и ценами сразу после инструкции, чтобы пользователь видел, что может сразу купить нужное лекарство. Получили почти половину переходов в корзину.

Разместили в корзине кнопку «Добавить лекарство», чтобы показать пользователю, что он может купить сразу несколько препаратов. Подсветили, что некоторые лекарства отпускаются строго по рецепту.

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

Переделали флоу выбора способа доставки. Теперь можно увидеть все аптеки сразу, выбрать удобную, а уже в карточке аптеки определиться со способом доставки.

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

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

Собрали библиотеку шрифтов и цветов. Предусмотрели все состояния базовых компонентов для десктопа и мобильной версии.

Отзыв клиента

Вы были для нас полноценной продуктовой командой. Ребята максимально вовлекались в проект, участвовали в кастдевах, предлагали идеи. Понравился очень высокий уровень артдирекшена и скорость исполнения. Фактически всё, что есть в новом продукте, мы сделали с командой Луча. Довольно крутой опыт!

Роман Куликов, CEO Яндекс Здоровье