Корпоративный сайт для «Нового Втормета»

Главное о кейсе

Разработали единую цифровую площадку, которая объединила 276 пунктов приема лома по всей России.

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

We developed a single digital platform that united 276 scrap collection points across Russia.

The new website became a single entry point for customers, where they can find prices for scrap metal, find the nearest collection point, learn about additional services, and about activities and capabilities.

Как проект изменил жизнь пользователей

Сайт запущен 1 сентября и работает в тестовом режиме. Часть заложенных функций пока недоступна пользователям. Но уже сейчас они могут ознакомиться с информацией, прочитать об услугах и оставить заявку на звонок, чтобы узнать интересующие подробности.
_______________________

The website was launched on September 1 and is currently working in test mode. Some of the functions laid down are not yet available to users. But they can already learn information, read about its services and leave a request for a call to find out details of interest.

Бизнес-задача и ее решение

Клиент

«Новый Втормет» — крупный участник в сфере переработки лома, имеет пункты приема черных и цветных металлов по всей России (276 пунктов). Входит в тройку лидеров в отрасли и занимает 1-е место по количеству площадок.

Задача

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

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

Основные цели клиента, которых он хотел достичь за счет сайта:
— показать масштаб и возможности;
— повысить уровень знания и доверия среди b2b-аудитории;
— добавить дополнительные возможности коммуникации с клиентом через интерактивные сервисы.

Процесс работы

Работа над проектом состояла из нескольких этапов:
— предпроектная аналитика: бизнес-интервью, МИО (модель информационных ожиданий), ИА (информационная архитектура), конкурентный анализ;
— разработка прототипов;
— разработка дизайн-концепции и дизайн внутренних страниц.
— фронтенд- и бэкенд-разработка.

Провели ряд бизнес-интервью с представителями клиента из разных отделов, узнали о процессах, об их видении бренда. Нам предоставили отчет по исследованию целевой аудитории, который подготовило стороннее агентство. Используя данные из исследования, построили модель информационных ожиданий (МИО) для разных сегментов целевой аудитории. Из МИО вынесли действия и распределили их по будущим страницам сайта в информационной архитектуре.

На этапе проектирования кроме основных страниц сайта (например, главная, о компании, контакты) разработали функционал и логику калькулятора, добавили прайс-лист и возможность выбора геолокации.

За основу дизайн-концепции взяли направление, близкое к айдентике, описанной в брендбуке. Это брутализм, контраст, технологичность, современность, использование брусковых геометричных шрифтов. После согласования дизайн-концепции подготовили макеты всех страниц сайта.
_______________________

Client

"Novy Vtormet" is a major participant in the scrap processing industry, it has scrap-yards for ferrous and non-ferrous metals throughout Russia (276 yards). It is among the top three leaders in the industry and ranks 1st in the number of scrap yards.

Task

In 2023, "Novy Vtormet" decided to undertake a global rebranding to create a leading sustainable brand that would serve as a benchmark for approach and customer focus among competitors.

This required a unified website, which they plan to develop as a franchise in the future.

The client's main objectives that they wanted to achieve through the website were:
— to show the scale and capabilities;
— to increase the level of knowledge and trust among the b2b audience;
— to add additional opportunities for communication with the client through interactive services.

Work process

Work on the project consisted of several stages:
— Pre-project analytics: business interviews, MIO (information expectations model), IA (information architecture), competitive analysis;
— prototype development;
— design concept development and design of internal pages.
— frontend and backend development.

We conducted a number of business interviews with representatives of the client from different departments, learned about the processes, about their vision of the brand. We were provided with a report on target audience research, which was prepared by a third-party agency. Using the data from the research, we built a model of information expectations (MIO) for different segments of the target audience. From the MIO we defined the actions and distributed them on the future pages of the site in the information architecture.

At the design stage, in addition to the main pages of the site (for example, the main page, about the company, contacts), we developed the functionality and logics of the calculator, added a price list and the ability to select geolocation.

For the basis of the design concept we took a direction close to the identity described in the brandbook. It was based on brutalism, contrast, technology, modernity, use of bar geometric fonts. After the design concept was agreed upon, we prepared layouts of all pages of the website.

Крафт (мастерство), реализация, технические детали

В работе над сайтом было несколько интересных моментов.

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

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

3. Выбор локации
Функционал разместили в шапке сайта. Можно выбрать отдельно город и пункт приема лома.
Возможны 3 сценария, когда какой пункт отображается:
— выбран пункт приема по умолчанию, если не включена геолокация (в этом случае показывается основной пункт приема);
— выбран ближайший пункт приема, если включена геолокация;
— выбран текущий пункт приема, который уже выбирали ранее (при повторных заходах пользователя).
Пункт приема можно изменить через ту же кнопку в шапке сайта. Есть возможность построить маршрут до этого пункта. Рядом расположили карту, на которой также можно выбрать подходящий пункт приема лома.

4. Дизайн-концепция
Основывались на айдентике, паттернах и формах, которые взяли из брендбука. Не использовали фотоконтент, чтобы уйти от стоковых решений в пользу узнаваемых форм на контрасте цветовых решений. Подобрали шрифт, который впишется в айдентику бренда и подчеркнет его брутальность. Он так же содержит круглые элементы, но они более приближены к идеальным пропорциям геометрических форм. Стилизовали иконки услуг и преимуществ, используя только фирменные паттерны.
_______________________

There were several interesting things about working on the website:

1. Calculator
The calculator was originally only supposed to have 3 fields, but it later evolved into a detailed calculator similar to a loan calculator. It helps one to roughly understand how much one can get for which materials. The company’s client can also use the option to order removal of scrap metal from their location. The final price depends on all the selected options.

2. Price list
On the price list page we provided sticky navigation. It helps to quickly move to the desired type of metal. The solution was used to give the user the opportunity to see prices for different types of scrap from different categories. In the table itself users can find types of metals, designations of scrap types and which items actually belong to these types of scrap.

3. Location selection
The functionality is placed in the website header. One can select separately a city and a scrap yard.
There are 3 possible scenarios for the location display:
— the default location is selected, if geolocation is not enabled (in this case the main location is shown);
— the nearest scrap yard is selected if geolocation is enabled;
— the current scrap yard is selected, which has already been selected before (for repeated visits to the site).
The scrap yard can be changed via the same button in the site header. It is possible to build a route to this point. There is also a map, on which one can select a suitable scrap point.

4. Design concept
The design concept was based on the identity, patterns and shapes that were taken from the brandbook. We did not use any photo content to get away from stock solutions in favor of recognizable shapes on contrasting color schemes. We chose a font that fits into the brand's identity and emphasizes its brutality. It contains some round elements, but they are closer to the ideal proportions of geometric shapes. We stylized icons of services and benefits, using only the patterns from the brand.

Инсайты, гипотезы, процесс создания и взаимодействия с заказчиком

В работе над проектом для нас как для партнера по цифровизации «Нового Втормета» было много положительных моментов. Клиент был подготовлен к работе, предоставил нам исследование целевой аудитории, что помогло на этапе аналитики, и брендбук компании, который ускорил процесс разработки дизайн-концепции.

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

As a partner of Novy Vtormet in digitalization, we came across many positive aspects. The client was prepared for the work, provided us with target audience research, which helped at the analytics stage, and with the company brandbook, which accelerated the design concept development process.

It was interesting to immerse ourselves in the client's sphere of activity, and they, in turn, were very involved in the project, promptly provided feedback and listened to our suggestions and arguments.

Скриншоты