![metall](/local/templates/um_new/img/case/metall/phones.png)
![metall](/local/templates/um_new/img/case/metall/logo.png)
Разработка информационного портала для СМИ
>90
макетов страниц разработано нашей командой
≈1500
пользователей заходят на портал ежедневно
>70 000
статей размещено
на информационном сайте
О компании
Магнитогорский металл — общегородская газета (г. Магнитогорск), выходящая с 1935. Тематика газеты — освещение событий в Магнитогорске и за его пределами, аналитика и комментарии, обзор вопросов бизнеса и экономики, событий культурной и спортивной жизни.
![metall](/local/templates/um_new/img/case/metall/circle-large.png)
![metall](/local/templates/um_new/img/case/metall/circle-small.png)
![metall](/local/templates/um_new/img/case/metall/circle-medium.png)
![metall](/local/templates/um_new/img/case/metall/circle-small__right.png)
![metall](/local/templates/um_new/img/case/metall/circle-medium__right.png)
![metall](/local/templates/um_new/img/case/metall/circle-large__right.png)
Финалисты в номинации «СМИ, издательства»
![metall](/local/templates/um_new/img/case/metall/nomination2.png)
![metall](/local/templates/um_new/img/case/metall/nomination1.png)
![metall](/local/templates/um_new/img/case/metall/letter1.png)
Благодарственное письмо
от редакции газеты
По завершении проекта наша команда получила благодарственное письмо
от главного редактора АНО «Редакции газеты магнитогорский металл».
А еще про нашу работу написали интересную статью https://magmetall.ru/news/o-chem-govoryat/buterbrodnoe-menyu-s-chem-ego-edyat ;)
![Письмо](/local/templates/um_new/img/case/metall/letter2.png)
Что мы сделали?
Проанализировали нынешний UX сайта
и предложили решения по улучшению пользовательского опыта
Переработали дизайн в соответствии
с фирменным стилем и адаптировали
под смартфоны и планшеты
Создали дизайн-систему и библиотеку компонентов для единой стилистики продукта
и оперативного внедрения новых решений
![metall](/local/templates/um_new/img/case/metall/doingbg.png)
![metall](/local/templates/um_new/img/case/metall/mobile_icon.png)
Новое мобильное приложение
Теперь смотреть новости можно в приложении на телефоне!
Наша команда разработала мобильное приложение для информационного портала «Магнитогорский Металл». Знакомьтесь с последними новостями и событиями любимого города.
Это приложение позволит вам в режиме реального времени узнавать о самых последних новостях в городе Магнитогорске и за его пределами. Всегда актуальные новости, аналитика и комментарии, обзор вопросов бизнеса и экономики, события культурной и спортивной жизни - все это теперь можно просматривать с помощью нашего приложения.
![metall](/local/templates/um_new/img/case/metall/phone.png)
Главная страница
Основная страница сайта, на которой можно получить самую главную новостную информацию за последнее время.
![metall](/local/templates/um_new/img/case/metall/mainpage1.png)
Большой объем информации удачно расположен на адаптивной версии сайта и удобно просматривается с помощью верхнего и бокового меню.
![metall](/local/templates/um_new/img/case/metall/mainpage320.png)
![metall](/local/templates/um_new/img/case/metall/mainpage320-2.png)
Изюминка проекта
Отдельное внимание заслуживает страница «История города». На сайте для проекта газеты «Магнитогорский металл» было отведено отдельное место, на котором можно будет делиться фотографиями города Магнитогорска разных лет, начиная с 1930 года. На данный момент в фотоархиве редакции хранится 20 тысяч фотографий.
![metall](/local/templates/um_new/img/case/metall/feature1.png)
![metall](/local/templates/um_new/img/case/metall/feature2.png)
![metall](/local/templates/um_new/img/case/metall/feature3.png)
![metall](/local/templates/um_new/img/case/metall/feature4.png)
Внутренние страницы
Адаптивный дизайн призван сделать веб-страницы и отображение их содержимого соответствующими тому устройству, с которого они просматриваются. Интерфейс одинаково удобен на десктопах и гаджетах.
![metall](/local/templates/um_new/img/case/metall/inner1-1.png)
![metall](/local/templates/um_new/img/case/metall/inner1-2.png)
![metall](/local/templates/um_new/img/case/metall/inner2-1.png)
![metall](/local/templates/um_new/img/case/metall/inner2-2.png)
![metall](/local/templates/um_new/img/case/metall/inner3-1.png?v=1.1.1)
![metall](/local/templates/um_new/img/case/metall/inner3-2.png)
![metall](/local/templates/um_new/img/case/metall/inner3-3.png)
![metall](/local/templates/um_new/img/case/metall/inner4-1.png)
![metall](/local/templates/um_new/img/case/metall/inner4-2.png)
![metall](/local/templates/um_new/img/case/metall/inner5-1.png)
Тёмная тема
Для портала Магнитогорский Металл нами было принято решение реализовать и внедрить функцию переключения на тёмное оформление веб-сайта.
![metall](/local/templates/um_new/img/case/metall/darktheme-left-1.png)
![metall](/local/templates/um_new/img/case/metall/darktheme-left-2.png)
![metall](/local/templates/um_new/img/case/metall/darktheme-right.png)
Наша команда зменила подход в работе с цветами, упростила выбор цветовой палитры и разработала удобную систему. Для пользователей появилась возможность выбирать оформление в настройках и с помощью всего одной кнопки изменить цвет интерфейса.
Переработка структуры
Перед началом работ над сайтом первым делом необходимо продумать для него чёткую и логичную
структуру. Грамотная структура сайта положительно влияет на ранжирование в поисковых системах,
а также на восприятие сайта пользователями.
После тщательного сбора информации
по разделам сайта, мы обновили структуру и сделали ее намного проще и понятнее.
![metall](/local/templates/um_new/img/case/metall/structureleft.png)
![metall](/local/templates/um_new/img/case/metall/structureright.png)
После тщательного сбора информации по разделам сайта, активного использования тех или иных функций и анализа отзывов пользователей, мы обновили структуру. Пересобрали ее, исходя из всех полученных данных, и перешли к этапу прототипирования.
Гарнитура
Minion Pro
Medium - 35px
Заголовки
![metall](/local/templates/um_new/img/case/metall/minion-mobile.png)
Open Sans
Regular - 16px
Основной текст
![metall](/local/templates/um_new/img/case/metall/opensans-mobile.png)
Заголовки
![metall](/local/templates/um_new/img/case/metall/A.minion.png)
Minion Pro
Medium - 35px
А Б В Г Д Е Ё Ж З И Й К Л М Н О П Р С Т У Ф Х Ц Ч Ш Щ Ъ Ы Ь Э Ю Я
а б в г д е ё ж з и й к л м н о п р с т у ф х ц ч ш щ ъ ы ь э ю я
Основной текст
![metall](/local/templates/um_new/img/case/metall/a-opensans.png)
Open Sans
Regular - 16px
А Б В Г Д Е Ё Ж З И Й К Л М Н О П Р С Т У Ф Х Ц Ч Ш Щ Ъ Ы Ь Э Ю Я
а б в г д е ё ж з и й к л м н о п р с т у ф х ц ч ш щ ъ ы ь э ю я
![metall](/local/templates/um_new/img/case/metall/gratefullbg.png)