Основная проблема старого сайта — непродуманный интерфейс. Поэтому мы уделили большое количество времени проработке прототипов. На этом этапе мы рассмотрели основные пользовательские сценарии и проработали структуру всех страниц сайта. Также решили большую проблему — выбор адреса. У каждого ресторана небольшая зона доставки и поэтому нужно запрашивать адрес у пользователя на первый этапах работы с сервисом.
Очевидным решением является попап, который открывается при посещении сайта, однако это раздражает пользователей. Можно было сделать выбор адреса вместо первых баннеров, как это реализовано на многих современных сайтах доставки, но тогда мы теряем возможность показывать специальные предложения, что негативно скажется на конверсии. В итоге мы добавили выбор адреса в шапку, и при проверке это поле пропадает. Так у пользователя есть возможность ознакомиться с меню, а ввод адреса всегда на виду.
В дизайне мы решали имиджевую задачу, базируясь на только что обновлённом фирменном стиле компании. Для выбора правильных визуальных образов мы переработали семь дизайн концепций и остановились на текущем варианте. На сайте используются тонкие линии, округлые формы и мягкие тени. Такой подход в сочетании с фирменными цветами создает ощущение тепла и уюта.
По технической части было два нетривиальных момента. Прежде всего, это то, что каждый ресторан – это отдельное юр.лицо, у которого свой договор со сбербанком и своя iiko. Если первое не так важно, то второе говорит о том, что у каждого ресторана в выгрузке свои блюда/топинги и свой стоплист. Единственное решение, которое могло быть: сделать отдельное меню на сайте и к нему делать привязку блюд каждого ресторана. Второй момент был связан с тем, что на стороне iiko не были заведены зоны доставки (которые у каждого ресторана время от времени немного изменяются в зависимости от спроса клиентов), поэтому изменение зоны доставок были сделаны в административной панели.
Как конечный вариант мы сделали так, что новый ресторан можно добавлять в административной панели сайта, указав ключи по интеграции с iiko и шлюзом Сбербанка, а также на карте Leaflet полигоном выделить зону доставки. Проверка вхождения адреса (введённого пользователем) в зону доставки производится через интеграцию с сервисом Dadata и через проверку вхождения координат этого адреса в полигон зоны доставки. При отправке заказа в iiko, также передаётся уникальный идентификатор адреса (КЛАДР), чтобы iiko раскладывала адрес заказа по нужным ей полям, облегчая работу менеджеров доставки.
Более 70% заказов доставки приходятся на мобильные устройства. В связи с этим мы не просто делали адаптив, а прорабатывали отдельную мобильную версию сайта, всё для того, чтобы пользоваться было максимально удобно. На это можно обратить внимание по ряду элементов навигации, которые расположены в нижней части экрана телефона – чтобы было удобно дотягиваться пальцем, держа телефон в одной руке.
Спустя два месяца после запуска среди постоянной аудитории был произведён опрос, насколько сайт удобен в использовании. Из 101 респондента удобство отметили 89%, и по их обратной связи был внесён ряд изменений. Согласно обратной связи, сайт заметно выделяется на фоне других доставок и привлекает к себе внимание, что и являлось первой целью. Что касается продаж, то при том же объёме трафика заказов через новый сайт стало вдвое больше, чем было ранее.