аналитика проектирование дизайн разработка

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

Коллаж с изображениями сайта
О проекте

Разработали интерактивный конфигуратор кухонь, внедрив в него каталог встраиваемой техники

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

Какие задачи мы решили

  • 01
    Проектирование удобного интерфейса. Мы продумали логику и механику конструктора, отработали несколько вариантов юзер-флоу и выбрали лучший из них, основываясь на потребностях и поведении пользователя.
  • 02
    Объединение двух каталогов: Кухонных гарнитуров и бытовой техники. Для увеличения количества продаж бытовой техники, мы синхронизировали 1С каталог товаров с конструктором и реализовали интуитивное управление.
  • 03
    Дизайн, вёрстка и разработка. Мы разработали дизайн с множеством нестандартных, но простых в использовании элементов, после чего сверстали и запрограммировали конечный продукт, готовый к использованию!
Прототипирование

С помощью модерируемого тестирования мы выявили наиболее понятный пользователям интерфейс

Дизайн

Разработанный фирменный стиль создает образ комфортного и удобного пространства

Промо-лендинг

Основная задача промо-страницы — рассказать о существовании конструктора кухонь, раскрыть его преимущества и дать пользователям доступ к удобному функционалу выбора и заказа.

Меню и авторизация

Мы решили спрятать все пункты меню за «бургер-иконкой», так как тестирования показали увеличение времени перехода на страницу конструктора при показе всех пунктов меню в стандартной шапке сайта. Как только мы скрыли пункты меню за кнопкой-бургером, скорость попадания пользователей на страницу Конструктора увеличилась на 34,8%.
КОНСТРУКТОР КУХОНЬ

Первый вход в конструктор кухонь — это краткая on-board инструкция о том, как использовать функционал

Шаг 1: выбор параметров помещения

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

Выбор цвета и текстур

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

Выбор цвета и текстур

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

Шаг 2:
Выбор коллекции и модели кухонного гарнитура

Конфигурация и коллекция

Выбор конфигурации кухни — своего рода фильтр, позволяющий показывать только релевантные коллекции.

Выбор модели из коллекции

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

Шаг 3: стилизация кухни в режиме реального времени

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

Мы предусмотрели десятки мелочей

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

Шаг 4:
Выбираем комплектацию

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

Первый вход на шаг комплектации и типы карточек

Активные

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

Неактивные

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

Выбор модели бытовой техники

Как создавался мини интернет-магазин в конструкторе кухонь, и почему это гениально

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

Описание товара

Достаточно кликнуть по модели и в появившемся поп-апе будет показана вся доступная информация.

Шаг 5:
Оформление заявки и заказ кухни

Финальный шаг конфигурации кухни — регистрация или авторизация и переход в личный кабинет для мониторинга заказа
КОНСТРУКТОР НА МОБИЛЬНЫХ УСТРОЙСТВАХ

Мы учли и пользователей мобильных устройств. Для них были подготовлены отдельные адаптивные интерфейсы.

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

Личный кабинет

Мои проекты
Мои заказы
Профиль
Вызов замерщика
Вызов замерщика
Оплата
Проект