

Корпоративный сайт Северстали
Единая digital-платформа, объединяющая группу сайтов и суббрендов компании. Блочная разработка на TypeScript, Bitrix, формирование дизайн-системы и цифрового брендбука
Д. Ю. Поярков
начальник управления по ксо и бренду
Выражаю благодарность компании Only за успешную реализацию проектов по созданию корпоративного сайта Северстали и цифрового брендбука компании.
Отдельно хотелось бы отметить высокий уровень компетенций компании Only в дизайне сайтов и разработке на 1С-Битрикс, а также профессионализм и клиентоцентричность менеджеров проектов.
Д. Ю. Поярков
начальник управления по ксо и бренду
Выражаю благодарность компании Only за успешную реализацию проектов по созданию корпоративного сайта Северстали и цифрового брендбука компании.
Отдельно хотелось бы отметить высокий уровень компетенций компании Only в дизайне сайтов и разработке на 1С-Битрикс, а также профессионализм и клиентоцентричность менеджеров проектов.
Северсталь — ведущий производитель продукции из стали, лидер металлургии будущего.
Серебро. Лучший usability / UX

Основная проблема
В группу Северстали входит несколько суббрендов и предприятий — ЧерМК, Метиз, ИТЗ, Шексна, Олкон, Карельский окатыш, Воркутауголь — и у каждого из них был свой личный сайт. Ранее мы делали единую дизайн-систему для сайтов всех дочерних предприятий, а теперь нам требовалось объединить все бизнес-единицы в одну диджитал платформу, которая раскрывает полную информацию о компании, имеет удобный каталог по обновленной линейке продукции и обеспечивает доступ к сервисам и услугам для партнеров и клиентов.


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


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


Единая дизайн-система
Единая дизайн-система, синхронизированная с новым брендом и стратегией.
На этапе дизайна оказалось крайне важно разработать единую систему принципов, стилей и методов для работы над сложной системой корпоративного сайта. Подобное руководство позволяет добиться единой стилистики при проектировании страниц, легкой масштабируемости и удобной работы с разными объемами информации.
Дизайн-система для сайта Северстали включает в себя 5 схем модульной компоновки и 74 типа блока, а с альтернативными вариантами — более 200. В части фронта мы использовали систему поблочной сборки на базе «1С-Битрикс». 127 готовых шаблонов блоков позволяют быстро создавать новые страницы, а также масштабировать и корректировать уже существующие без привлечения разработчиков.



В рамках работы над каталогом продуктов и услуг Северстали мы спроектировали 3D-модели для каждой категории товара. Отдельно стоит отметить работу по адаптации нового брендбука Северстали в диджитал, которая развивается в рамках параллельного проекта — диджитал-брендбука, и затрагивает визуал всех диджитал-материалов компании, включая мобильные приложения, соцсети, рассылки и другие каналы.
Заключение
Корпоративный сайт Северстали — результат тщательной работы на каждом этапе. Серьезная сервисная история с акцентом на визуальной идентичности. При этом сложная архитектура внутри поддерживается простыми решениями снаружи — благодаря проработанной структуре единой дизайн-системы и удобной блочной сборке.
