Размещение рекламы
Рейтинги и обзоры
digital-рынка

Карта-сайт для Ильи Варламова

Заказчик: Илья Варламов
Исполнитель: Атвинта
Карта-сайт для Ильи Варламова

Описание

Промо-сайт с интерактивной картой, на которой отображаются посты Ильи Варламова из LiveJournal с привязкой по геотегам в публикациях.

Текущая доступность работы

https://vmap.atwinta.ru/ login: atwinta; password: 123qwe

Поставленная задача и ее решение

Задача - создать промо-сайт с интерактивной картой, на которой выводятся посты из блога. Цель разработки - представить посты в удобном для читателей виде с геопривязкой, повысить вовлеченность и глубину просмотра постов из блога.
На первом этапе изучили, как люди читают блог, продумали навигацию и разработали дизайн-концепцию сайта.
Читатель может попасть на сайт напрямую из поиска или из блога Ильи Варламова на LiveJournal. Для этого на портале с блогом реализовали виджет, который отображает запись из блога на карте. При клике на виджет пользователя редиректит на промо-сайт, тем самым повышая глубину просмотра записей блога и продолжительность визита пользователя.
В дизайне интерфейса придерживались принципа минимализма, удобства навигации и акцент на главное - публикации блога.
Экран состоит из карты с геометками, к которым привязаны посты по тегам, и информационной панели с постами из блога в левой части экрана. В информационной панели дополнительно реализованы фильтры по тематикам и выбор города из списка, а не на карте.
По умолчанию посты расположены в хронологическом порядке: сначала новые, ниже - более поздние. Материалы, которые пользователь еще не читал, отмечены статусом “Новые”.
В дизайне реализовали два режима просмотра: дневной и ночной. Цветовая схема карты меняется на ночную с помощью переключателя в верхнем правом углу или автоматически, если пользователь зашел на сайт, когда в его часовом поясе ночь.
Сайт разработан на основе Google Maps. Для привязки публикаций к карте мы разработали парсер, который собирает посты из LiveJournal по тегам городов и стран и размещает их пинами на карте.

К некоторым городам привязано много постов. Чтобы пины не загораживали всю область на карте, они собираются в кластеры. При клике на кластер в левой части экрана появляется список постов, привязанных к этой локации.
Кроме этого было обнаружено много небольших населенных пунктов в различных странах, названия которых соответствуют названиям крупных мировых столиц или неодушевленным предметам и явлениям природы. Чтобы посты не привязывались к ним, мы создали дополнительные фильтры, которые исключают подобные города из привязки. Один из фильтров отсеивает города с малой численностью: например, город Зима в Иркутской области или город Чай в Турции. Другой - привязывает посты только к конкретным городам: например, Москва, Санкт-Петербург, Париж.
Пользователю доступны только посты, привязанные к карте в видимой части экрана. Если приблизить Московскую область, то слева отобразятся только посты, привязанные к городам в этой области. Пользователь выбирает интересующий его пост и читает на сайте, без перехода в LiveJournal.

Скриншоты

Видео

Достигнутые цели и KPI по итогам запуска

Читателям блога удобнее ориентироваться в материалах благодаря интерактивной карте. Вовлеченность в чтение и глубина просмотра повышаются, ведь все статьи по одной стране сгруппированы на карте.
Бронза
• Лучший сайт медиа / СМИ
Tagline Awards 2018

Дата запуска

30 октября 2018 года

Ориентировочный бюджет

850 000 ₽

Авторы

Проджект-менеджер: Александр Сарапулов
Дизайн: Анна Карнаухова
Программисты: Александр Попов, Антон Калугин, Владислав Невзоров, Юрий Кабанов

Номинации

Сайты → Медиа и СМИ