Что упускает «Жизньмарт», или редизайн интерфейсов для сети продуктовых нового формата
Провела качественный опрос среди не-дизайнеров. Выяснила, какие проблемы приложения и сайта существуют. И придумала фичу для аллергиков и тех, кто на диете.
Жизньмарт — сеть продуктовых магазинов в формате «у дома». У ребят есть сайт, приложение и клёвый брендбук. Это тестовое на вакансию продуктового дизайнера, которое мне так понравилось, что я решила его оформить в кейс.
Структура кейса
Кейс я разбила по смысловым блокам, чтобы облегчить восприятие. Кликайте на ссылки и откроется соответствующий раздел в проекте.
Задачи:
- Проанализировать сайт и приложение Жизньмарт, предложить что можно улучшить и почему
- Придумать фичу, которая будет выделять приложение Жизньмарта среди конкурентов
- Уложиться в дедлайн 5 часов
Аналитика
Целевая аудитория сайта и приложения не сильно отличается.
И первая, и вторая группа заказывает доставку продуктов или готовых блюд, также смотрят, в каком именно магазине продаются нужные им товары и пользуются программой лояльности.
Ниже полная сводка про основных покупателей Жизньмарта, мне было интересно, откуда приходят люди, как часто они покупают в онлайн- и офлайн-формате, и какую выгоду они ищут.
Про конкурентов
- Магазины продуктов, их сайты и приложения: Перекресток, Вкусвилл, Пятёрочка
- Кафе, точки быстрого питания
- Сервисы доставки еды: Самокат, Лавка, Сбермаркет
Исследование
Я решила опросить 8 своих друзей не-дизайнеров, чтобы собрать разный опыт пользования как приложением, так и сайтом.
1. Оцени сайт и приложение по 10-балльной шкале
В среднем, респонденты оценили приложение на 7,2 балла, а сайт на 5,4
2. Что бы ты хотел(-а) изменить, какие действия у тебя вызывают затруднения в пользовании?
Ответы были такие (прим.: жм — Жизньмарт):
3. Чего тебе не хватает в приложении Жизньмарта?
Ответы были или похожи друг на друга, или их просто не было. Выбрала самые интересные:
Собрав все предложения, я сделала матрицу влияния-усилий:
План такой:
- Редизайню аппку: главная, фильтры и правки в корзине
- Делаю редизайн главной на сайте
- Дизайню фичу, которая выделит Жизньмарт среди конкурентов
Редизайн (приложение, сайт)
1. Это приложение сейчас, главный экран
• Неочевидное расположение карточки. Это краткая версия рассказа респондента: открываешь приложение, карта на прелоадере появилась, через несколько секунд приложение полностью прогрузилось, а карту из вида ты потерял. Из-за того, что на загрузке карточка находится внизу, а на главном экране она в самом правом углу, карточку не сразу получается найти
• Непривычное расположение иконок в таббаре. 3 из 8 опрошенных мною друзей, поделились, что случайно тапали на корзину, когда хотели нажать на профиль. Исправим эту проблему!
Я не стала скрывать карточку под тап и вынесла её на главный экран. Теперь она заметная и не нужно будет ждать дополнительные несколько миллисекунд прогрузки после тапа на неё. А ещё немного изменила расположение иконок в таббаре, поставив корзину посередине.
Раздел «Вам понравится» совсем незаметен из-за кнопок «Готовые блюда», «Продукты»… поэтому мы можем терять новых покупателей, которые ещё не знают что такое Жизньмарт и только-только скачали приложение. Поэтому я подтянула кнопки и выровняла отступы. Вуаля! Новые покупатели не теряются, а старички заказывают ещё проще :)
• Поиск магазина по параметрам
Слишком много магазинов и шанса быстро найти подходящий Жизньмарт нет :(
Добавила фильтрацию через чипсы, это ускорит контакт с фильтрацией и сделает интерфейс более дружелюбным к покупателю
• Нельзя увеличить количество товара в корзине
Нужно изменить количество тортов в корзине. Два варианта:
- «1×135 ₽» — окажется кнопкой, и по нажатию на неё вылезет что-либо, где можно увеличить количество позиций
- Увеличить количество товаров нельзя :(
Добавила функцию увеличения количества товаров
2. Главная страница сайта
Баннеры сейчас не выполняют главную функцию — рассказывать про акции, клёвые мероприятия и новинки. Незаметные кнопки для управления баннерами, пока что это мало походит на динамические элементы
Карточки в листинге сейчас они вызывают когнитивную нагрузку тем, что взгляд «скачет» + нет кнопки «В корзину» и приходится сначала нажимать на товар, а уже потом закидывать его в корзину (в два шага)
Улучшила баннеры тем, что изменила форму, добавила видимые элементы навигации и сделала их более современными
Полностью пересобрала карточки, добавила цену по карте и цену без карты, это должно увеличить процент интереса к программе лояльности. Ещё считаю нужным вынести кнопку «В корзину» сразу же, поскольку товаров не десятки тысяч + пользователю не придется делать лишних движений, а, выбрав товар, всего лишь добавить его к себе (в один шаг)
А ещё сайт и приложение теперь консистентны! Большие кнопки с иллюстрациями (Готовые блюда, Продукты, Мои покупки…) есть и на главной в приложении :)
Фича
Вдохновившись одним из ответов своего знакомого, я предложила подборки продуктов, которые будут основываться на вкусовых/аллергенных/диетических предпочтениях человека
Плюсы такой фичи:
- Добавить только в приложение => увеличить скачиваемость приложения из-за уникальной функции
- У большого количества людей есть минимум 1 пищевая аллергия => таким подбором будут пользоваться
- Повышение лояльности покупателя из-за заботы о его здоровье и предпочтениях
Сколько всё заняло по времени:
Ссылка на фигму и то, как я работаю с макетами
фигма: Жизньмарт, Алина Устьянцева
UI-kit:
Спасибо за внимание! Буду рада корректной критике работы в комментах, а, ну и хештеги #жизньмарт #uxuidesign #redesign
Контакты:
Телеграм: @alinaustyantseva
Почта: alinaust70@gmail.com
Очень интересно было почитать, посмотреть на привычные вещи под другим углом, понять, что действительно нет предела совершенству. Могу уверенно сказать, что если бы жм сделал такие обновления, то было бы и приятнее, и проще
верные замечания! классная реализация.
тоже делал редизайн главной
https://www.behance.net/gallery/176057281/zhiznmart-redizajn-glavnoj
кейс супер! рада, что ты тоже поделился :)
Вот это смышленые юикс юай дезигнеры пошли! Лайк и репост!!!!!
Вышло намного лучше чем есть, имхо. Очень понравился подход, грамотно, достойно, структурировать.
Красиво получилось
Здорово и очень полезно получилось))