Workspace Digital Awards 2025 — успейте номинировать кейсы по льготной цене до 1 декабря. Принять участие!
Сибирикс
Интернет-магазин Dr. Sleep
Сибирикс
#Сайт под ключ

Интернет-магазин Dr. Sleep

77 
Сибирикс
Сибирикс Россия, Москва
Поделиться:
Интернет-магазин Dr. Sleep
Клиент

Фомлайн

Сфера

Мебель и интерьер

Регион

Россия, Москва

Тип сайта

Интернет-магазин

Сдано

Декабрь 2023

Задача

Dr. Sleep — интернет-магазин готовой продукции «Фомлайн»: компания производит не только пенополиуретан для изготовления мебели и матрасов, но и товары под собственной маркой: удобные матрасы, мягкие топперы и подушки для идеального сна, которые можно купить у дилеров.

Изначально основной аудиторией бренда Doctor Sleep были B2B-клиенты — оптовые покупатели, которые реализуют продукцию в своих торговых точках. Появление сайта — логичный шаг к завоеванию B2C-аудитории.

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

Решение

Для начала запустили MVP проекта — а теперь продолжаем его улучшать и «нанизывать» новую функциональность.

1Дизайн

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

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

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

2Альтернативная версия

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

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

Основная идея дизайна альтернативной версии — сделать из главной страницы витрину, чтобы её хотелось рассматривать. А внутренние страницы оставить максимально функциональными, чтобы хотелось купить. Поэтому главная — с крупной типографикой, анимациями в стиле заставки к «Звёздным войнам», наслаивающимися друг на друга блоками и другими «фишками». Внутренние страницы — четкие, на светлом фоне, а в качестве цветовых акцентов работают кнопки и редкие баннеры-перебивки. В итоге альтернативная версия дизайна победила — заказчик принял её с восторгом.

3Детальная страница с акцентом на товаре

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

4Посадочная страница для партнёров

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

5Анимации

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

6Сопутствующие товары

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

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

7Умная корзина для B2B-пользователей

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

Результат

Бывают заказчики, которые становятся тебе почти родными — потому что вслед за одним проектом они приходят за вторым. А потом — и за третьим. Так случилось с «Фомлайн»: сначала мы реализовали для клиента маркетплейс мебельных комплектующих, потом стильный корпоративный сайт, а теперь — интернет-магазин товаров для сна и отдыха под собственным брендом Dr. Sleep.

https://doctor-sleep.ru/

Стек технологий

  • JavaScript JavaScript Язык программирования
  • PHP PHP Язык программирования
  • Visual Basic Visual Basic Язык программирования
  • jQuery jQuery Фреймворк/библиотека
  • Laravel Laravel Фреймворк/библиотека
  • Vue.js Vue.js Фреймворк/библиотека

Выскажите мнение
Авторизуйтесь, чтобы добавить свой комментарий.
оставить заявку

Хотите заказать похожий проект?

Сибирикс с удовольствием обсудит вашу задачу

Оставить заявку