Работа над внутренними страницами сайта MMK
Роль: UX/UI дизайнер.
Задача: Масштабирование дизайн-системы на внутренние страницы сайта, проектирование новых страниц, а также подготовка макетов к разработке.
mmk.ru
Задача: Масштабирование дизайн-системы на внутренние страницы сайта, проектирование новых страниц, а также подготовка макетов к разработке.
mmk.ru
(01).
Контекст продукта
Компания. ММК — один из крупнейших производителей стали с большим объёмом продуктового и корпоративного контента.
Предпосылки: Агентство Only разработало для бренда новую digital-айдентику и дизайн-систему. Команде предстояло поэтапно и масштабно адаптировать под нее все внутренние разделы старого сайта ММК.
Предпосылки: Агентство Only разработало для бренда новую digital-айдентику и дизайн-систему. Команде предстояло поэтапно и масштабно адаптировать под нее все внутренние разделы старого сайта ММК.
(02).
Дизайн-система как конструктор
Задача. Сохранить единый визуальный язык интерфейса и предсказуемость компонентов, не превращая страницы в набор однотипных, скучных шаблонов.
Вызов: Применение дизайн-системы на практике всегда сталкивается с ограничениями реального контента и бизнес-задач.
Конструкторский подход: Большая часть страниц собиралась из ограниченного набора компонентов. Такой метод позволял быстро проектировать новые разделы с разными типами контента, поддерживать предсказуемый пользовательский опыт и сохранять целостность интерфейса.
Паттерны: Акцентные Hero-блоки · Текстовые секции с медиаконтентом · Сложные таблицы и справочные данные · Конверсионные CTA-блоки · Системы фильтрации и навигации.
Вызов: Применение дизайн-системы на практике всегда сталкивается с ограничениями реального контента и бизнес-задач.
Конструкторский подход: Большая часть страниц собиралась из ограниченного набора компонентов. Такой метод позволял быстро проектировать новые разделы с разными типами контента, поддерживать предсказуемый пользовательский опыт и сохранять целостность интерфейса.
Паттерны: Акцентные Hero-блоки · Текстовые секции с медиаконтентом · Сложные таблицы и справочные данные · Конверсионные CTA-блоки · Системы фильтрации и навигации.
Hero блоки
Баннеры
Информационно-медийные блоки
Документы и сертификаты
Ключевые показатели
(03).
Параллельная работа над потоками задач
Схема работы: Проект развивался итерационно и в высоком темпе. Пока часть страниц проходила согласование, другие уже передавались разработчикам, а следующие находились в проектировании.
Условия: Такой ритм требовал поддерживать актуальность компонентов и быстро адаптировать решения под новые вводные без потери качества.
Условия: Такой ритм требовал поддерживать актуальность компонентов и быстро адаптировать решения под новые вводные без потери качества.
Шаблоны страниц
(04).
Масштабирование системы на десятки сценариев
Тест системы. За 4 месяца дизайн-систему успешно применили более чем к 160 страницам различного назначения.
Результат. Это позволило проверить её гибкость в реальных условиях и сформировать бэклог паттернов для повторного использования.
Итоги проекта. Масштабное обновление сайта завершено точно в срок, а система шаблонов доказала свою жизнеспособность.
Что сделали.
Продукт получил:
✓ единый визуальный язык для всего сайта;
✓ ускоренную подготовку новых страниц;
✓ предсказуемую передачу макетов в разработку;
✓ возможность масштабировать систему без усложнения интерфейса.
Результат. Это позволило проверить её гибкость в реальных условиях и сформировать бэклог паттернов для повторного использования.
Итоги проекта. Масштабное обновление сайта завершено точно в срок, а система шаблонов доказала свою жизнеспособность.
Что сделали.
Продукт получил:
✓ единый визуальный язык для всего сайта;
✓ ускоренную подготовку новых страниц;
✓ предсказуемую передачу макетов в разработку;
✓ возможность масштабировать систему без усложнения интерфейса.
Контакты
Если у вас есть задача, проект или предложение о работе — пишите.
