Исследования и контекст
ПЛН на протяжении порядка 10 лет в 2‑2,5 раза опережает ближайших преследователей на региональном медиарынке по посещаемости. Ключевые метрики сайта pln-pskov.ru в 2022-2023 годах:
| В неделю | В месяц | |
|---|---|---|
| Уникальных посетителей | > 136 тысяч | > 490 тысяч |
| Просмотров страниц | > 620 тысяч | > 2 млн |
| Глубина просмотра | ≈ 2,5 | |
| Время на сайте | ≈ 2,85 минуты | |
* Цифры в таблице — по данным сервиса «Яндекс Метрика» за период с 1 марта 2022 года по 26 февраля 2023 года (среднее арифметическое) без учёта посещений роботов
При углубленном изучении пользовательского поведения были исследованы технические аспекты использования сайта (устройства, разрешения экрана, браузеры, наличие блокировкщиков рекламы etc.), уточнён портрет основных сегментов аудитории, в том числе ядра (группы пользователей, которые посещают сайт каждую неделю в течение месяца), проанализированы тепловые карты и карты скроллинга основных экранов, точки входа и данные по отказам.
Некоторые наблюдения по резуальтатам анализа метрик:
- тотальное доминирование пользователей, просматривающих сайт со смартфона (8 из 10), но при этом ядро аудитории — пользователи десктопов;
- женская аудитория вдвое превышает мужскую (частично это коррелируется с демографической картиной активного населения региона, а также со структурой занятости в сфере госслужбы, к которой относится значительная часть ядра аудитории), но уступает ей по глубине просмотра на 11 % (или на 0,2 процентных пункта), и на 33,7 % (порядка 25 секунд) — по времени на сайте;
- доминирующая возврастная группа — люди старше 35 лет, более половины всех пользователей — старше 55 лет;
- основная доля пользователей приходит на сайт через поисковый траффик и часто даже не видит главную страницу, однако на втором месте по источникам заходов — прямые переходы через закладки или набор url сайта;
- низкий показатель доскролла главной страницы и фактического нефункционирования отдельных элементов интерфейса.
Дизайн-система
Базовые токены: типографика
Для сайта медиа (особенно медиа текстоцентричного) типографика — ключевой элемент дизайна. Именно она задёт тон, характер визаульного языка медиабренда, определяет ритм и иерархичность распределения информации на страницах материалов, отвечает за удобство восприятия информации читателем.
На старом сайте использовалась одна гарнитура — Roboto, то есть стандартный шрифт для ОС Android. И в этом заключалось сразу две проблемы.
- Тексты на сайте не имели характера, выглядели слишком утилитарными (а кроме того, кириллица в Roboto всё-таки содержит слишком много не самых удачных решений).
- Сложно было разделять собственно контент и всевозможные многочисленные служебные надписи (названия рубрик, выводы даты и времени публикации, названия подразделов).
Эти проблемы были решены подборов пары гармоничных шрифтовых семейств — с засечками и без — из разряда гарнитур с открытой лицензией. Основными требованием к новым гарнитурам были их гармоничное сочетание, хорошая проработка кириллицы, большой набор начертаний (в том числе обязательно — курсивных начертаний)и дополнительных символов, которые могут понадобится медиа при оформлении специфичных материалов.
В качестве интерфейсного шрифтового семейства — без засечек — была выбрана гарнитура Inter авторства Расмуса Андрессона — пожалуй, лучший из доступных на момент старта работ по редизайну бесплатных неогротесков с прекрасной читабельностью текста в малых кеглях на экранах.
Отдельный плюс «Интера» — впечатляющие возможности стилизации и кастомизации текста за счет широкого спектра лигатур. Это позволило настроить нужный вариант отображения цифр, форму точек и запятых, соотносящихся с рубленым характером логотипа бренда.
А шрифтом с засечками — для основных массивов текста статей — стала специальная гарнитура Stix Two Text, созданная в рамках STIX Project для научных, технических и медицинских публикаций в цифровой среде — с упором на удобство восприятия текста в небольших кеглях и на экранах разного качества.
Для таблицы размеров текста был подобран набор базовых токенов на основе функции clamp(), гибко адаптирующей кегль шрифта в зависимости от размера экрана между двумя крайними значениями.
Базовые токены: палитра
У бренда была фирменная цветовая лакуна — оттенки бордо. Между тем, при каждом редизайне конкретный цвет бренда всякий раз слегка видоизменялся в заданных рамках, то есть жесткого канона не существовало. Поэтому, ввиду замечаний некоторых пользователей об ощущении слишком тёмного и даже «грязного» дизайна, было решено слегко освежить фирменный цвет, подняв и яркость, и насыщенность.
Также нужен был набор базовых цветовых токенов для оформления контента и интерфейса сразу в двух вариантах — для светлой и тёмной темы. Последнюю решено было внедрить для удобства предпочитающих именно тёмную тему пользователей. В результате получились наборы цветов для основного монотонного контента (текста, контуров иконок), для фона, для границ и разделителей. А уже затем с привязкой к базовым токенам были сформированы токены семантические — для конкретных элементов интерфейса.
Логотипы
Предыдущая версия логотипа, существовавшая с 2013 года, была слегка доработана не только по цвету, но и по форме. Во-первых, был заменён шрифт букв, во-вторых, была убрана расшифровывающая надпись, поскольку исследования показали, что большинство пользователей воспринимает бренд именно в виде аббревиатуры, а с расшифровкой даже иногда путается, смешивая названия бренда и его основного конкурента. И, наконец, были скорректированы отступы между квадратами, сделав логотип более плотным.
За счет увеличения эффекта плотностности и цельности логотипа впоследствии был использован приём использования эмблемы в шапке сайта и в промо-продукции как своего рода этикетки — без отступа от края слева.
Впоследствии на базе обновленного логотипа были разработаны или доработаны логотипы продуктов бренда, например, логотип радиостанции ПЛН-ФМ и логотип направления документальных фильмов и стримминговых передач ПЛН-ТВ.