SuperGood

Домашняя еда, и заказ больше не похож на лотерею.

Повтор привычного заказа сократился примерно с 60 секунд до 5. После релиза рейтинг в магазинах приложений вырос с 3,1 до 3,7, а одна кодовая база заменила две.

Продуктовый дизайнер и единственный мобильный разработчик в PizzaSushiWok, небольшой компании
11 месяцев, 2024
Вышло на iOS и Android, позже проект закрыли по финансовым причинам.

Меню SuperGood с закреплённой панелью: время доставки, количество позиций и сумма.Карточка блюда с весом, ценой, КБЖУ, составом и кнопкой «В корзину».Оформление заказа: адрес, время доставки, оплата, бонусы и итог на одном экране.

Коротко

Ситуация. SuperGood доставлял домашнюю еду, и у него было два отдельных приложения: для iOS и для Android. В отзывах сомневались, что еда стоит своих денег, а приложение только усложняло заказ.

Задача. Сделать повседневный заказ быстрым и понятным, особенно привычный обед в будни, и собрать из двух приложений одно. Работал над этим я один.

Действия. Разобрал около 150 отзывов в магазинах приложений, провёл контекстное исследование с 10 людьми, которые заказывают еду на работе, и проверял изменения сравнительным юзабилити-тестированием на 10 коллегах. Переделал меню, карточку блюда и повтор заказа и собрал всё на Flutter.

Результат. Повтор привычного заказа сократился примерно с 60 секунд до 5. После релиза рейтинг в магазинах приложений вырос с 3,1 до 3,7, а одна кодовая база заменила две.

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

Проблема

Люди сомневались, что еда стоит своих денег, а приложение не помогало. SuperGood конкурировал с «Кухней на районе» за повседневные заказы: обед на работе или ужин, когда готовить совсем не хочется. Чтобы понять, почему люди сомневались, я начал с публичных отзывов.

На что жаловались в публичных отзывах
≈30%
Приложение. Это была моя часть.
≈70%
Еда за свои деньги. Кухня и цены не входили в мою зону ответственности.

Примерное соотношение по 150 отзывам в App Store и Google Play.

Большинство жалоб было на еду за свои деньги, а это я поменять не мог. Претензии к приложению сводились к трём вещам.

  1. Пока выбираешь блюда, не видно ни времени доставки, ни итоговой суммы.Ответ: решение 2. Закреплённая панель со временем и суммой
  2. Категории сдвигаются при прокрутке, и легко потеряться.Ответ: решение 2. Закреплённая панель со временем и суммой
  3. Каждый будний обед приходится заново искать те же блюда.Ответ: решение 1. Повтор заказа из истории

Цель

Я пришёл мобильным разработчиком. Кухня и цены были не в моей власти, поэтому я взял то, что было: весь процесс заказа, от исследования до пересборки на Flutter.

Цель была убрать причины сомневаться перед оплатой и сделать так, чтобы привычный заказ занимал секунды. Понять, получилось ли, я собирался по времени, доле успешных попыток и лёгкости (SEQ) повтора заказа, по жалобам на приложение в отзывах и по рейтингу в магазинах. Ограничения были понятны сразу: никакого влияния на еду и цены и один разработчик на две платформы.

Исследование

Редизайн вырос из четырёх видов исследования:

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

Услышанное я записал в виде трёх job stories (Jobs to be Done). Каждая привела к одному из первых трёх решений:

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

Решения

  1. 1. Повтор заказа из историиПовтор заказа сократился с 8 шагов до 3 и примерно с 60 секунд до 5.
  2. 2. Закреплённая панель со временем и суммойВремя и сумма теперь всегда на виду, а не в двух касаниях.
  3. 3. Вес, КБЖУ и состав в карточке блюдаНовая карточка блюда показала себя лучше старой.
  4. 4. Оставить знакомые паттерныВ отзывах потом писали, что выглядит свежее, а переучиваться не нужно.
  5. 5. Одно приложение на Flutter для iOS и AndroidДве кодовые базы стали одной, собранной в одиночку за 11 месяцев.

1. Повтор заказа из истории

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

История заказов: раскрытый заказ, кнопка «Повторить» у каждого блюда и кнопка «Добавить весь заказ».
  1. Повторить одно блюдо
  2. Или вернуть весь заказ

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

Большинство будничных заказов были повторами, так что прошлый заказ и так был самым коротким путём к следующему.

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

Повтор заказа сократился с 8 шагов до 3 и примерно с 60 секунд до 5.

шаги посчитаны по сценарию, время из юзабилити-теста

Шагов, чтобы повторить привычный заказ
До: снова искать каждое блюдо
8 шагов
После: история, добавить весь заказ
3 шага

Посчитано по сценарию.

2. Закреплённая панель со временем и суммой

Люди то уходили из меню, то терялись в нём: время и сумма были спрятаны, а категории сдвигались.

Тёмное меню со строкой категорий и закреплённой панелью заказа: время, позиции, сумма.
  1. Категории не прыгают
  2. Время, позиции и сумма всегда на виду

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

Люди проверяли время и стоимость перед каждым заказом, а постоянные клиенты выбирают по памяти, так что экран не должен был прыгать.

Значок корзины только со счётчиком был бы проще, но за временем и суммой всё равно пришлось бы ходить в корзину.

Время и сумма теперь всегда на виду, а не в двух касаниях.

посчитано по сценарию

3. Вес, КБЖУ и состав в карточке блюда

По одной фотографии было не понять, стоит ли блюдо своих денег.

Тёмная карточка блюда: дополнительное время приготовления, вес, цена рядом с «В корзину», КБЖУ и состав.
  1. Дополнительное время приготовления
  2. Вес, и цена прямо рядом с «В корзину»
  3. КБЖУ и состав

Теперь в карточке блюда есть вес, состав, КБЖУ и дополнительное время приготовления, а цена стоит прямо рядом с кнопкой «В корзину».

Цену я поменять не мог, зато мог показать, что ты за неё получаешь, ещё до оплаты.

Новая карточка блюда показала себя лучше старой.

тот же юзабилити-тест

4. Оставить знакомые паттерны

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

Корзина с количеством, промокодом, предупреждением о минимальной сумме, способами оплаты и итогом.
  1. Выбор количества
  2. Промокод и предупреждение о минимальной сумме
  3. Способы оплаты
Корзина по паттернам, знакомым по приложениям доставки продуктов.

Я сохранил привычную структуру и взял паттерны у «Самоката» и «Яндекс Лавки», так что поменялся внешний вид, но не привычки.

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

В отзывах потом писали, что выглядит свежее, а переучиваться не нужно.

отзывы в магазинах приложений

5. Одно приложение на Flutter для iOS и Android

С двумя отдельными приложениями каждое изменение приходилось делать дважды, и на разных платформах оно могло работать по-разному.

Выбор адреса на карте с зоной доставки и подтверждением, что адрес в неё входит.

Проверка зоны доставки

Отслеживание заказа: ожидаемое время, этапы, карта маршрута и связь с курьером.

Отслеживание заказа

Я пересобрал оба приложения на Flutter в одной кодовой базе: от меню и оплаты с 3DS до отслеживания, лояльности и светлой и тёмной тем на моей дизайн-системе.

Я был единственным разработчиком, и с одной кодовой базой каждое исправление попадало на iOS и Android в один день.

Если оставить два нативных приложения, каждое изменение пришлось бы делать дважды, и всё одному.

Две кодовые базы стали одной, собранной в одиночку за 11 месяцев.

Результаты

Я проверил редизайн дважды: на юзабилити-тесте с коллегами и в магазинах приложений после релиза.

Время на повтор привычного заказа
До: снова искать каждое блюдо
≈60 с
После: история, добавить весь заказ
≈5 с

Одна отметка: 5 секунд. Юзабилити-тест, 10 коллег не из команды приложения.

На том же тесте привычный заказ правильно собрали все 10, а раньше только 2 из 10. Лёгкость по Single Ease Question выросла с 3 до 6 из 7.

Рейтинг в магазинах приложений, из 5
До редизайна
3,1
После релиза
3,7

Сравнение до и после релиза, так что редизайн не единственная возможная причина.

В новых отзывах жалобы на еду за свои деньги остались, а приложение хвалили: выглядит свежее, переучиваться не нужно, а история заказов правда помогает.

Позже SuperGood закрылся из-за финансового положения компании.

Выводы

То, что я сделал бы иначе, не про экраны. Бизнес часто продвигал свои идеи в первую очередь и в спешке, а исправления, которые были важнее для клиентов, ждали. Я спорил, но опирался на мнения, а не на процесс. В следующий раз я бы: