Зангезурский медно-молибденовый комбинат

Задача

Разработать корпоративный сайт, который повысит прозрачность деятельности компании, укрепит её репутацию и продемонстрирует высокотехнологичный характер производства. Сайт должен соответствовать современным стандартам UX/UI-дизайна, с акцентом на вклад компании в развитие региона и её социальных инициативах.

Аналитика
и проектирование

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

Над проектом работала международная команда менеджеров и аналитиков.

Для бенчмаркинга мы использовали лучшие практики ведущих горнодобывающих компаний, таких как Rio Tinto, Polymetal, Newmont, Nornickel, «Северсталь», Vale и Polyus. Также были проанализированы сайты компаний из рейтинга Webranking, включая SSAB, Outokumpu, Hydro и Anglo American.

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

Идея и дизайн-подход

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

Дизайн, digital-айдентика
и UI-kit

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

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

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

Айдентика сочетает традиционные армянские узоры с фотостилем и инфографикой, подчеркивая связь компании с регионом и его культурным наследием.

Разработка. Фронтенд

Для анимаций мы использовали GSAP и IntersectionObserver API. Блок с историей сделан с помощью синхронизированных слайдеров на библиотеке Swiper.

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

Для визуализации эффективности работы компании мы добавили SVG-анимацию графика роста производительности руды. Ценности компании выделены с помощью диаграммы, которая анимируется через CSS, SVG и TypeScript.

Графики анимируются с использованием SVG-изображений и CSS Animation. Для создания эффектов применяются изменения свойств, например clip-path.

Виджеты с курсами металлов и погодой работают на данных из онлайн-сервисов, таких как OpenWeatherMap. Также на сайте интегрирована карта Google Maps. Запросы к API включают параметры, например город или тип металла, а полученные данные отображаются в виджетах.

Разработка. Бэкенд

Мы использовали Pug и PHP, чтобы сократить работу с чистым HTML и ускорить интеграцию компонентов. Также оптимизировали контент и загрузку ресурсов для максимально быстрой работы сайта.

Результат

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