Что скрывается за кнопкой «Арендовать»: разработка сайта Kengo

Что сложного в том, чтобы арендовать сто стульев на мероприятие? Для клиента — выбрать модель, количество и даты. Для сайта все интереснее: один и тот же товар участвует во множестве заказов, стоимость меняется вместе со сроком аренды, а в одной корзине могут оказаться десятки разных позиций.

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

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

Что меняется, когда товар нужно вернуть

В классическом e-commerce товар проходит довольно простой путь: его выбрали, купили и получили.

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

Поэтому к привычным характеристикам товара добавляется срок аренды.

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

Для клиента сценарий остается знакомым: каталог, карточка товара, корзина. Основная сложность должна скрываться внутри, и дополнительные параметры должны выглядеть интуитивно.

Два одинаковых заказа могут стоить по-разному

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

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

Когда в корзине оборудование для целого мероприятия, привычной формулы «цена × количество» уже недостаточно.

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

Так большая B2B-заявка собирается через привычный интерфейс интернет-магазина, хотя внутри работает совсем другая логика.

Как убрать разрыв между готовым дизайном и версткой

Одна из главных особенностей проекта была задана еще до старта разработки: дизайн делала другая команда.

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

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

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

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

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

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

Как не потеряться среди 2000+ товаров

Большой ассортимент добавил еще одну задачу. B2B-клиент обычно приходит на сайт с конкретным мероприятием и должен легко найти для него комплект. Ему важно быстро перейти от общей задачи к подходящим позициям и собрать весь набор.

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

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

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

Сайт готовит заказ к работе менеджера

В аренде мебели значительная часть условий зависит от конкретного мероприятия: площадки, времени заезда, объема заказа и логистики. Поэтому финальное согласование остается за менеджером Kengo.

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

Дальше команда Kengo проверяет фактическое наличие, подтверждает сроки и согласовывает детали доставки. Менеджеру не приходится начинать разговор с подбора мебели и сбора базовой информации — его время остается на задачах, где действительно нужен опыт и знание конкретной ситуации.

Для B2B-модели Kengo такой сценарий особенно органичен. Компания работает с организаторами мероприятий и другими клиентами, которые могут возвращаться с новыми заказами, поэтому персональная коммуникация остается важной частью сервиса. Сайт при этом берет на себя повторяющуюся часть процесса и позволяет менеджерам сосредоточиться на условиях конкретного мероприятия.

После релиза проект продолжает расти

Основной этап разработки завершился в начале 2024 года. Дальше сайт уже жил вместе с бизнесом, и стало видно, какие сценарии стоит менять после реального использования.

Где-то требовалась более удобная работа календаря. Где-то была необходима корректировка каталога или заказа. Появлялись задачи вокруг календаря, карточек и пользовательских сценариев. Источником изменений становились запросы команды Kengo, обратная связь пользователей и регулярный анализ продукта со стороны Фьюче.

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

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

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

На старте задача звучала как разработка нового сайта по готовому дизайну. В результате проект затронул гораздо больше уровней продукта:

• каталог из 2000+ позиций стал частью полноценного сценария заказа;

• клиент может собрать большой комплект, выбрать даты и заранее рассчитать стоимость аренды;

• сайт учитывает разные тарифы в зависимости от срока;

• фильтры и навигация помогают быстрее работать с большим ассортиментом;

• команда Kengo получила больше возможностей самостоятельно управлять каталогом и контентом;

• готовый дизайн получил техническую адаптацию с последующими интерфейс-доработками;

• после запуска сайт продолжает развиваться и находится под техническим мониторингом.

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

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

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