Внедрение мобильной версии сайта и технологии PWA для компании строительных материалов

Веб-разработка
E-commerce
PWA
Строительство и ремонт

О бренде

Торговая Сеть ТЕХНОНИКОЛЬ (ТСТН) – крупнейшая торговая компания, управляющая сетью собственных торговых отделений, расположенных в России, Беларуси и Казахстане. Сеть реализует как продукцию корпорации Технониколь, неотъемлемой частью которой является, так и широкий ассортимент строительных и отделочных материалов для промышленного, гражданского и частного домостроения от известных производителей. Компания основана Сергеем Колесниковым и Игорем Рыбаковым.

1992

год основания

+100

торговых отделений

Внедрение мобильной версии сайта и технологии PWA для компании строительных материалов, блок 3, фото 1

Задачи

Бизнес-цель заказчика — увеличить процент заказов с мобильных устройств.

Исходя из цели заказчика, бюджета и потребностей целевой аудитории ТСТН было выбрано решение. Перед Progressive Media стояла задача по разработке функциональной мобильной версии сайта для покупки строительных материалов.

Решение

Для мобильной версии tstn.ru было сделано 16 макетов страниц, а с учетом различных состояний и поведений пользователей, попапов, форм обратной связи отрисовано более 60 уникальных дизайн-макетов. В макетах использованы лучшие практики сайтов e-commerce.

Аналитика

Концепция и дизайн

Разработка

Главная страница

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

Внедрение мобильной версии сайта и технологии PWA для компании строительных материалов, блок 9, фото 1

Каталог

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

Внедрение мобильной версии сайта и технологии PWA для компании строительных материалов, блок 11, фото 1

Карточка товара

Посетитель всего в 2–3 клика может ознакомиться с фактурой, материалом, декоративными элементами, технической информацией, рассчитать доставку и количество материала. Особенности товара раскрыты и доступны при открытии карточки товара. Добавлен раздел «‎Вам могут пригодиться» - сопутствующие товары, пользователь имеет возможность перейти и посмотреть следующую модель, также доступна информация о готовых решениях и последних просмотренных товарах.

Функционал

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

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

Удобное расположение блоков в корзине помогает пользователю смартфона совершить конверсионное действие.

Для мобильной версии разработана страница «‎Клуб ТСТН» с информацией о клубе, акциях и сервисах Торговой Сети ТЕХНОНИКОЛЬ.

Внедрение мобильной версии сайта и технологии PWA для компании строительных материалов, блок 14, фото 1

Внедрение технологии PWA

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

Отзыв

Мобильная версия сайта получила высокую оценку покупателей продукции ТЕХНОНИКОЛЬ и положительный отзыв заказчика. Использование PWA увеличило вовлеченность пользователей и дало заказчику дополнительные конкурентные преимущества. Технология стала драйвером роста ключевых показателей бизнеса.

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

Юрий Савицкий

Технический директор торговой сети ТЕХНОНИКОЛЬ

Посетить сайт

Следующие кейсы

Внедрение BI-системы для решений бизнес-задач компании специализированного питания

Herbalife

Внедрение BI-системы для решений бизнес-задач компании специализированного питания

Сопровождение сайта сети фирменных магазинов техники Apple

restore:

Сопровождение сайта сети фирменных магазинов техники Apple

Все кейсы