Северсталь - vol.2
Сага о том, как одностраничный промосайт для выставки превратился в большой и умный интернет-магазин
![<p>В начале 2018-го к нам пришёл крупный заказчик «Северсталь»: задача была амбициозной, а сроки очень сжатыми. Тогда за два месяца мы создали классный промосайт для профильной выставки. Во второй итерации нужно было развить проект в полноценный интернет-магазин.</p>](https://s29805.cdn.ngenix.net/wp-content/2018-12-05-severstal_v2/x010.png.pagespeed.ic.fwbir7DwlB.jpg)
Задачи
- Добавить каталог.
- Рассказать об услугах и помочь пользователям с выбором продукции, ассортимент которой во второй версии проекта расширился: помимо металлочерепицы добавились фальцевая кровля и профнастил.
Решение
![<p>На обновлённой главной в промоблоке теперь сочный рендер с загородным домом и плюсиками-подсказками на крыше, которые рассказывают о преимуществах кровли. Ниже, как и в первой версии, выбор между материалами — «Стальным бархатом», «Стальным шёлком» и «Стальным кашемиром» — но теперь их ключевые характеристики появляются при клике. Под блоком с материалами — типы кровли: металлочерепица, фальцевая кровля и профнастил, которые при клике сменяют друг друга в галерее-карусельке. Также на странице появилось больше справочной информации для потребителя и гораздо больше крутой анимации. </p>](https://s29805.cdn.ngenix.net/wp-content/2018-12-05-severstal_v2/01.jpg)
![<p>Каталог</p> <p>Сюда можно попасть сразу из промоблока. Внутри — карточки с характеристиками кровли и лаконичный фильтр сверху. Можно сортировать по материалу, профилю (рисунку кровли), покрытию, цветам и дилерам. Под каталогом — блок с популярными группами товаров, здесь можно просмотреть подборки с серией профилей или все товары конкретного цвета. Предустановки всплывающей формы «Оформить заявку» меняются в зависимости от того, на какой странице она вызвана.</p>](https://s29805.cdn.ngenix.net/wp-content/2018-12-05-severstal_v2/02.jpg)
![<p>Детальная страница позволяет выбирать цвета, материал и профиль, а также — где купить. Дилеров можно посмотреть списком или в режиме карты.</p>](https://s29805.cdn.ngenix.net/wp-content/2018-12-05-severstal_v2/x03.jpg.pagespeed.ic.1d9JtfXeRy.jpg)
![<p>На страницах материалов подробно рассказывается об их характеристиках: есть видео, сертификаты качества, преимущества, схема слоёв, таблица параметров. </p>](https://s29805.cdn.ngenix.net/wp-content/2018-12-05-severstal_v2/04.jpg)
Результат
Одностраничный промосайт после второй итерации превратился в большой и умный интернет-магазин. В планах третья итерация — будем разрабатывать очень функциональный личный кабинет для дилеров. В итоге должен получиться удобный В2В-инструмент.