Номинируйте кейсы на Workspace Digital Awards 2026. Прием заявок до 15 декабря по льготной цене, успейте принять участие!
ДАЛЕЕ
Дизайн и разработка портала «БАМ-50», созданного к 50-летию Байкало-Амурской магистрали
ДАЛЕЕ
WDA
2025
#Разработка сайтов под ключ

Дизайн и разработка портала «БАМ-50», созданного к 50-летию Байкало-Амурской магистрали

4359 
ДАЛЕЕ Россия, Москва
Поделиться: 0 0 0
Дизайн и разработка портала «БАМ-50», созданного к 50-летию Байкало-Амурской магистрали
Клиент

Да-ТИМ

Сфера

Государство и общество

Регион

Россия, Москва

Тип сайта

Порталы и сервисы

Сдано

Июль 2023

Задача

Агентство «Далее» реализовало дизайн и разработало портал БАМ-50, создание креативной идеи и ведение проекта происходило на стороне диджитал-агентства Da-team, и историческим рисерчем и копирайтингом занимались журналисты и историки Центра семейного и корпоративного наследия «Проект Жизнь».

БАМ — грандиозный строительный проект, в котором приняло участие около 130 000 человек. В 2024 году БАМу исполнилось 50 лет. В связи с этим РЖД решила создать масштабный цифровой проект, который соберет полную информацию о БАМе, чтобы сохранить память для будущих поколений.

Авторами идеи проекта выступили специалисты диджитал-агентства da-team, а контентное наполнение создавалось при участии команды историков и журналистов из Центра семейного и корпоративного наследия «Проект Жизнь». Коллеги изучили литературу и архивные источники о БАМе, провели фактчекинг, пообщались с ветеранами стройки, Содружеством БАМа и людьми, живущими около магистрали сейчас. Эта масштабная работа помогла нам составить креативную концепцию проекта.

Также одной из задач сайта было побудить пользователей делиться биографиями их родственников и близких людей — строителей БАМа. Для этого нужно было придумать механику, которая помогла бы пользователям справиться с этой задачей.

Предстояла полная работа над порталом с нуля:

● Разработка дизайн-концепции;

● Создание UX;

● Оформление и анимация;

● Тестирование.

Решение

Проект был масштабным, поэтому мы разбили его на несколько частей:

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

2. Добавление сторилендингов. Важно было запустить контекстную рекламу для привлечения пользователей и побудить их делиться историями. Поэтому мы разработали интерактивные сторилендинги и разместили их в разделе «Дневник БАМа».

3. Интеграция с VK Mini Apps. Чтобы собрать еще больше историй, мы интегрировали сайт с VK.

4. Создание фотоархива и интеграция с VK Cloud Vision. Когда визуального контента накопилось довольно много, мы внедрили поиск людей по фото, чтобы можно было искать старых знакомых или загружать групповые фотографии.

5. Дальнейшее наполнение контентом портала и групп в социальных сетях. Этим занялись наши коллеги из da-team и Центра семейного и корпоративного наследия «Проект Жизнь». Для наполнения разделов портала и сообщество было отснято несколько видеоподкастов и собрано огромное количество материала. Обновления выгружаются ежедневно.

1Дизайн-концепция

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

Выбрав авангардный шрифт Pilotka, мы показали, что проект выделялся из других подобных строек СССР и был по-настоящему уникальным.

Сложностью стала нехватка качественного контента — фотографий и видеохроники. Фотографии приходилось оцифровывать вручную и собирать у ветеранов и респондентов, которые принимали участие в интервью для проекта. Большой объем контента был выкуплен у крупных архивов — например, ТАСС и Нет.Фильм.

2UX/UI

Основной задачей было привлечь к проекту внимание самых разных представителей аудитории. Поэтому мы использовали на сайте различные механики. Так, для аудитории 45+ был создан раздел «Архив», где можно было поделиться своими фотографиями, воспоминаниями и историями. А для молодежи мы создали соцсети и мини-приложение в VK, где можно участвовать в викторинах и получать за это баллы. А для всех посетителей портала будут интересны статьи об истории БАМа.

Чтобы побудить пользователей делиться своими историями, мы разработали 10 интерактивных сторилендингов с мемуарами строителей БАМа — каждый имеет уникальную стилистику, анимации, видеоролики и архивные фотографии. Для удобства мы сделали так, что поделиться историей можно и на портале, и через ВК.

3Технологии

Чтобы пользователям было удобно делиться личными историями, мы предусмотрели такую возможность через соцсети — с помощью VK Mini Apps. Был разработан единый API, с которым могли обмениваться данными и сайт, и приложения. Это удобно для модерации историй — они приходят в общую панель администратора, где редакторы просматривают их, правят и публикуют.

Чтобы автоматически распознавать людей на фото, мы подключили технологию VK Cloud Vision, которая обладает точностью 99,8%. Для интеграции с VK Cloud Vision мы написали API, которое объединяет снимки из разделов «Фотоальбом» и «Архив». Если Vision не распознал человека с первого раза, редакторы могут вручную выделить портрет на фото и отправить его в программу.

В будущем мы планируем развивать проект — создать раздел «БАМ сегодня» с интерактивной картой городов и новостями.

Результат

● Мы создали первый в своем роде цифровой архив об одном из самых масштабных проектов в нашей стране. Мы разработали уникальную дизайн-концепцию в ретро-стилистике, при этом наполнив портал современными механиками взаимодействия с пользователями.

● На портале внедрены современные технологии, которые позволяют быстро делиться контентом и искать людей на архивных фото.

● С момента запуска на сайте было зафиксировано более 305 000 уникальных пользователей, а также посетители добавили более 2 700 биографий «БАМовцев».

● На данный момент это наиболее популярный проект об одном из самых крупных инфраструктурных проектов нашей страны. Он объединяет более 105 тыс. пользователей на площадках VK и OK. Сообщения с просьбой опубликовать истории и фото, воспоминания, впечатления о БАМе приходят ежедневно.

https://bam50.ru/

Стек технологий

  • CSS CSS Язык программирования
  • JavaScript JavaScript Язык программирования
  • PHP PHP Язык программирования
  • Symfony Symfony Фреймворк/библиотека
  • Vue.js Vue.js Фреймворк/библиотека
  • PostgreSQL PostgreSQL База данных
  • PhpStorm PhpStorm Среда разработки

Выскажите мнение
Авторизуйтесь, чтобы добавить свой комментарий.
оставить заявку

Хотите заказать похожий проект?

ДАЛЕЕ с удовольствием обсудит вашу задачу

Оставить заявку