beta

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

Промо-сайт с интерактивной картой
Категория
Промо-сайты
Концепция
Отрасль
СМИ, Масс-медиа

Описание

Задача - создать промо-сайт с интерактивной картой, на которой выводятся посты из блога. Цель разработки - представить посты в удобном для читателей виде с геопривязкой, повысить вовлеченность и глубину просмотра постов из блога. 

На первом этапе изучили, как люди читают блог, продумали навигацию и разработали дизайн-концепцию сайта. Читатель может попасть на сайт напрямую из поиска или из блога Ильи Варламова на LiveJournal. Для этого на портале с блогом реализовали виджет, который отображает запись из блога на карте. При клике на виджет пользователя редиректит на промо-сайт, тем самым повышая глубину просмотра записей блога и продолжительность визита пользователя.

В дизайне интерфейса придерживались принципа минимализма, удобства навигации и акцент на главное - публикации блога.

Экран состоит из карты с геометками, к которым привязаны посты по тегам, и информационной панели с постами из блога в левой части экрана. В информационной панели дополнительно реализованы фильтры по тематикам и выбор города из списка, а не на карте. 

По умолчанию посты расположены в хронологическом порядке: сначала новые, ниже - более поздние. Материалы, которые пользователь еще не читал, отмечены статусом “Новые”.

В дизайне реализовали два режима просмотра: дневной и ночной. Цветовая схема карты меняется на ночную с помощью переключателя в верхнем правом углу или автоматически, если пользователь зашел на сайт, когда в его часовом поясе ночь.

Сайт разработан на основе OpenStreetMap. Для привязки публикаций к карте мы разработали парсер, который собирает посты из LiveJournal по тегам городов и стран и размещает их пинами на карте. 

К некоторым городам привязано много постов. Чтобы пины не загораживали всю область на карте, они собираются в кластеры. При клике на кластер в левой части экрана появляется список постов, привязанных к этой локации. 

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

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

Пользователю доступны только посты, привязанные к карте в видимой части экрана. Если приблизить Московскую область, то слева отобразятся только посты, привязанные к городам в этой области. Пользователь выбирает интересующий его пост и читает на сайте, без перехода в LiveJournal.