Через единый
сервис регистраций на IT-мероприятия
Подробнее о сервисе
РегистрацияДля регистрации заполните все поля

Сайт СМИ Сеть региональных СМИ. Холдинг 1MI

Сеть региональных СМИ. Холдинг 1MI

Ссылка на работу





Обновленный движок сайтов СМИ. На нем реализовано более 25 региональных, федеральных и отраслевых сайтов холдинга 1MI.

Создана уникальная CMS-система и новый оригинальный интерфейс для сети онлайн-СМИ 1MI. На движке работают 25 региональных СМИ, федеральное издание “Новые Известия” а также отраслевое издание “Нефть и Капитал”.
https://inkazan.ru/ - лишь один из примеров

Оригинальность подхода:
Перед разработкой было проведено исследования медиарынка с выявлением общемировых трендов и закономерностей развития сайтов СМИ и других медиа, а также социальных сетей и мобильных приложений в России, СНГ, Европе, Азии и США. Выявлены тренды. Вот лишь некоторые из них:
Меню с иерархическими разделами и категориями уходит в прошлое. Посетителям в первую очередь предлагается ознакомиться с главными новостями.
Вместо рубрик актуальны сюжеты и тренды. Сюжет - короткая история из нескольких материалов, раскрывающих тему. Тренд - длинная история (ковид, спецоперация, мобилизация).
Не просто акцент на главную новость дня, а заполнение видимого пространства настроением дня. Главная страница - это то, как редакция СМИ видит картину дня.
Каждая новость - это главная страница. 90% пользователей заходят на сайт по ссылкам на конкретные новости. Они не видят главную и не планируют на нее переходить. Каждая новость должна быть главной страницей. Выглядеть соответствующе и иметь навигацию и доступ к картине дня.
Не используются элементы оформления, рамки, заливки и прочее. Структуру страницы и технический дизайн формируют сами материалы на сайте. Фото, заголовки, лиды, даты и другое используются для формирования ритма и структуры, подачи акцентов и мотивации к действию (скролл вниз, переход по ссылке и проч).
Ленты новостей перестали быть линейными. Они по-прежнему отсортированы по дате, но значимость материалов не равна, поэтому одни статьи выводятся с существенным акцентом, другие - выступают “фоновым шумом”. При этом ленты новостей все больше становятся похожими на ленты социальных сетей.

Инфраструктура:
Выделенный сервер с гипервизором KVM, собственный внутренний VPS хостинг, мы создаём себе виртуальные машины.
Стек работает в Docker-контейнерах. Всего 17 видов контейнеров, образуют законченную систему и не требуют настройки сервера.
Оркестратор Docker Swarm позволяет масштабировать приложение и запускать сразу несколько копий приложения, это на порядок повышает отказоустойчивость и позволяет использовать все ресурсы сервера.
Конфигурации для Docker Swarm и контейнеров генерируются из шаблонов через систему управления Ansible. Благодаря этому мы можем воспроизводить абсолютно одинаковые копии серверов, это уменьшает количество ошибок и упрощает миграцию к другому хостинг-провайдеру.
Автоматический деплой и оркестратор позволяют обновлять приложение несколько раз в день незаметно для пользователей.

Стек:
База данных: PostgreSQL
Вспомогательные хранилища для кеширования и хранения очереди: Redis, Memcached
В основе 3 приложения: API и 2 его клиента: сайт и админка.
API построено на базе фреймворка Ruby on Rails.
Админка написана на фреймворке Vue, по историческим причинам.
Сайт написан на фреймворке Next, на основе React. От Vue для сайта отказались, т.к. при сравнении React работал быстрее в нескольких ключевых местах.

Уникальные логические решения:
Разработана плоская структура базы данных материалов. Больше нет типов материалов: новость, статья, интервью, фоторепортаж. Все публикации имеют тип “материал”, что развязывает руки программистам в применении фич, ускоряет сайт и дает возможности для недоступных ранее разработок.
При этом в каждый материал можно добавить любые типы блоков: от цитат до фотогалерей или опросов.
Мы полностью избавились от всех видов иерархии. Вместо разделов и рубрик, авторов и персон, городов и прочих дополнительных атрибутов у нас только тэги. Снаружи сайт выглядит, будто у него есть выраженные рубрики, сюжеты и форматы материалов. На самом деле, структура больше напоминает нейронную сеть. Что также позволяет внедрять то, что считалось невозможным, ускоряет работу сайта и его отказоустойчивость.
Теги могут превращаться в сюжеты или страницы, посвященные персонам. Материалы подбираются в ленту автоматически, при этом каждую ленту можно уникально оформить, добавив широкоформатное изображение и любые другие блоки (как в статьях), таким образом настраивая группы материалов под поисковые запросы.
Умная лента позволяет установить материалам уровни значимости и не ломая сортировку по времени акцентировать внимание на главных материалах в ленте, мягко позволяя скроллить второстепенные. При этом самые важные публикации, не имеющие временной значимости (спецпроекты, расследования) разбавляют ленту и сбивают ритм прокрутки, выводясь вне очереди даты и времени.
Сохранено и усовершенствовано удачное решение из предыдущей версии движка: 2 режима отображения (главное и все новости), где главное - это картина дня по мнению редакции, а все новости - это максимально простая лента материалов, упорядоченных только по дате и времени.

Уникальные технические решения:
Trello-подобный процесс публикации материалов в админке
Редактор может адаптировать материал сразу под несколько каналов дистрибуции, например, определить разные заголовоки для Новостей и Дзена
Возможность собрать отдельный материал в стороннем конструкторе сайтов и встроить его в сайт
Автоматическое определение некоторых тегов по заголовку

Оригинальные решения в области юзабилити:
Как ни банально это звучит, но принципом mobile-first по-прежнему пренебрегает подавляющее большинство дизайнеров и разработчиков. Мы не прикасались к макетам полноэкранной версии, пока не закончили с мобильной. Именно это решение позволило сделать сайт легким и не загромождать его лишними элементами.
Уход от “плиточной” структуры в духе 2014-го позволил свободно использовать широкие форматы, комбинируя ленту тизеров и полные форматы в привычном для пользователя виде.
Использование элементов из мобильных приложений в мобильной версии сайта. Часть типичных функций (например, нижнее меню с иконками или заливка шапки браузера изображением) позаимствована из популярных мобильных приложений. Интересно, что это никто не заметил (не было ни одного комментария среди многочисленных отзывов). Потому что это настолько органично, как будто так и должно быть.
Конверсия в подписку в зависимости от пользовательского поведения. Убраны всплывающие окна, карнавалом всплывающие отовсюду. Мы знаем, откуда человек пришел и какой источник ему привычен. Туда и предлагаем подписаться. Например, 6сли он пришел из Дзена - после прочтения новости ему будет предложено подписаться на канал издания в Дзене.

Результаты:
Кратный рост отказоустойчивости. На новом движке мы противостоим атакам 2022-года, не применяя практически никаких внешних сервисов. Отдельно стоит отметить “неубиваемую главную страницу”, которая делает вид, что работает даже когда из-за атак не работает уже ничего.
Рост глубины просмотра на 21%
Рост ядра лояльной аудитории и сокращение времени между повторными визитами на 15%

Выставлено в номинациях:
   — Развлекательный ресурс, медиапортал
   — Лучший usability / UX
   — Сайт СМИ

Проголосуй за проект:
Народное голосование через Runet-id

Голосование завершено, итог по народному голосованию: 10

Средний балл оценок жюри — 6
Меркулов Владислав 6
Павлов Максим 5
Щербина Константин 7
Заславский Никита 4
Афанов Иван 8
Астафьев Михаил 4
Бородин Дмитрий 6
Голованов Максим 8
*Средний балл вычисляется с отбрасыванием одной максимальной и одной минимальной оценки