Я с детства люблю карты, атласы: политические, исторические, экономические. Мог часами их рассматривать, запоминая каждый изгиб границы, каждый значок, каждую стрелку.
Когда появился сайт pobediteli.ru, мультимедийная карта Великой Отечественной войны, я был очень впечатлён. Вот как надо знакомить с историей! Где же подобные карты других событий?
Восхитили меня и видео с анимированной картой военных действий:
Здесь передвижения войск показаны подробнее, но без документальных вставок, которые есть на pobediteli.ru.
Чего не хватает мне во всех этих картах? Возможностей переходить на другие уровни детализации, связей с описаниями тех же событий в других масштабах. Чтобы перейти от армии к дивизии, от дивизии к полку, от полка к батальону, от батальона к роте, от роты к взводу – вплоть до отдельных солдат, офицеров, танков и самолётов, если о них есть информация в тех или иных источниках.
Этого же не хватает моему девятилетнему сыну Тимофею. Он несколько раз прочитал «Повесть о настоящем человеке» (издание 1952 года). Заинтересовался книгой «Вторая мировая война. Краткая история» (издание 1984 года). Открыл раздел о Курской битве. Увидел знакомую фамилию: «О, Алексей Маресьев! Я помню, он участвовал в воздушных боях Курской битвы!» Чтобы сопоставить события, Тимофею нужно открывать то одну книгу, то другую:
Википедия облегчает задачу обобщения имён, дат, мест и фактов в целостную картину, но ненамного. Открываем страницу об Алексее Маресьеве, страницу о Курской битве, ищем других людей, с которыми он пересекался (лётчик Андрей Дехтяренко, хирург Николай Теребинский, командир эскадрильи Александр Числов, военкор и писатель Борис Полевой), смотрим другое сражение, в котором Алексей Маресьев участвовал (Демянская операция), заглядываем на яндекс-карту, чтобы понять расположение тех мест, в которых он бывал, – и блуждаем среди кучи открытых вкладок…
Одно окно
«Одно окно» – хороший принцип, внедряемый государственными цифровизаторами. Удобно, когда любой вопрос решается через одно обращение, без хождения по разным ведомствам – ведь ведомства должны сами наладить друг с другом необходимый документооборот, не перекладывая это на граждан.
Такой же принцип потребен для поиска, изучения информации – чтобы всё, что нас интересует, и всё, что с этим связано, было доступно сразу в одном окне, на одном экране.
Если говорить о людях, коллективах, событиях и местах, то для показа их истории и взаимосвязей будет наиболее удобен единый пространственно-временной интерфейс, дополняющий географическим отображением Карту Событий:
В правой части рисунка мы видим блок таймлайна – отображение неких данных, упорядоченных по времени. Таймлайн событий включает в себя:
- временную ось,
- линии жизни интересующих нас субъектов: людей, коллективов, организаций,
- на этих линиях – события, в которых участвовали отображаемые субъекты,
- а в точках пересечения линий – события, в которых они участвовали вместе.
Разные типы событий можно обозначать разной инфографикой (в контексте войны можно выделить, например, танковый бой, воздушный бой, морской бой, партизанскую вылазку, смерть военного, смерть гражданского, смерть от бомбы, смерть от снайпера, подрыв на мине, смерть от голода, и т.д.).
Через таймлайн проходит вертикальная маркер-линия, соответствующая некоторому моменту времени внутри заданного временного диапазона.
Увеличенной толщиной выделяется событийная линия (на рисунке красная), для которой внизу, под таймлайном, показываются подробности, иллюстративные материалы – например, фото и видео, соответствующие моменту, отмеченному маркер-линией.
Таким способом мы можем погрузиться в события с точки зрения красного субъекта. Переключившись на синюю линию (тогда она выделится толщиной), мы сможем погрузиться в события с точки зрения синего субъекта.
В левой части рисунка мы видим географическую карту, на которой показаны траектории передвижений (треки) субъектов, отображённых на таймлайне. Треки соответствуют заданному временному диапазону: начало трека соответствует левой границе таймлайна, конец трека – правой границе таймлайна.
Салатный квадратик обозначает событие – на карте он показывает место события, а на таймлайне время события.
Зелёный треугольник на треке отмечает точку пространства, соответствующую моменту, указанному маркер-линией (видим, где в это время был субъект). Сплошной линией обозначена часть трека, пройденная от начального момента до указанного момента, а курсивом – оставшаяся часть трека от указанного момента до конечного момента.
Маркер-линия – это аналог ползунка перемотки в видеоплеере. Географическая карта – аналог экрана воспроизведения, на котором разворачивается сюжет. Событийные линии – наглядная схема сюжета (можно сравнить их с дорожками видео и звука в редакторе монтажа).
Было бы удобнее смотреть фильмы и сериалы, видя событийные линии их сюжетов – не надо перематывать наугад, отыскивая кадр, где Вася поцелует Машу, а можно сразу тыкнуть в пересечение линий Васи и Маши, обозначенное пиктограммой в виде романтического сердечка или чего-то подобного, интуитивно понятного.
Помимо событийных линий, интересно вывести графики других величин, характеризующих окружающую обстановку, чтобы проследить динамику процессов и лучше понять, на каком фоне происходили события.
Все таймлайны – и с графиками, и с событийными линиями – должны отображаться в одинаковом временном диапазоне, один под другим, с одинаковой экранной шириной. Маркер-линия – сквозная, проходит через все таймлайны. Чтобы точно сравнивать значения параметров на графиках и видеть их соответствие тем или иным событиям на событийных линиях:
Можно посмотреть, например, как во время Великой Отечественной войны коррелировали погодные условия (скажем, средняя по европейской части страны температура воздуха), и число потерь, наших и вражеских. Или как зависели рождаемость и смертность от среднего дохода на душу населения (с учётом инфляции) с 1950 по 2023 годы.
Ныне актуально такое сопоставление:
Слева – скриншот карты специальной военной операции. Справа – скриншот статистики заявок беженцев на помощь с нашего волонтёрского сайта. Сопоставляя эти данные в разные моменты времени, можно судить о том, как ситуация на фронте влияет на число беженцев.
Сёрфинг непрерывный плавный
«Сёрфинг» в контексте Интернета – это переходы от одной информации к другой, от одного отображения к другому: с помощью кликов по гиперссылкам, кнопкам, чекбоксам и другим элементам графического интерфейса, либо путём прокручивания, пролистывания, перетаскивания курсором или пальцем.
Непрерывный – то есть обеспечивающий переход от одного отображения к другому без перезагрузки веб-страницы. Как на яндекс-карте при переключении между слоями «схема», «спутник», «гибрид».
Плавный – значит не резкий. При переходе от информации А к информации Б отображение не просто перерисовывается, а показывает промежуточную информацию между А и Б, с сохранением целостности зрительного восприятия. Как на яндекс-карте при изменении масштаба от улицы до планеты мы видим и промежуточные масштабы, а при перетаскивании карты от Ростова до Москвы мы как бы проносимся над промежуточными и близлежащими городами: Воронежем, Липецком, Тамбовом, Тулой, Рязанью…
Плавность обеспечивается движением мышки, прокруткой её колёсика или движением пальцев по экрану (о дополненной реальности пока не говорю, всему своё время).
Изменение временного масштаба, нахождение конкретных точек на таймлайнах, переходы между событиями в заданном временном диапазоне – тоже должны происходить непрерывно и плавно. Интерфейсы, в которых дату нужно указывать вручную или искать в календаре, неудобны. А если какие-то данные приходят прямо сейчас, то и обновлять их надо в реальном времени – как перемещение общественного транспорта на яндекс-карте или как стоимость ценных бумаг на фондовой бирже.
По умолчанию правые границы таймлайнов и позиция маркер-линии соответствуют текущему моменту – как на яндекс-карте удобно ориентироваться по собственному местоположению в пространстве, так и на временной оси удобно брать за отправную точку собственное положение во времени.
Передвигать маркер-линию будем мышкой или пальцем, при приближении к ней курсора покажем возможность её «ухватить». При нахождении курсора над любым таймлайном и при прокрутке колёсиком мышки (или сдвигании-раздвигании пальцами) должен меняться временной диапазон отображения данных, синхронно во всех таймлайнах. При этом маркер-линия будет оставаться неподвижной – расширение-сужение таймлайнов по оси времени должно происходить относительно маркер-линии.
В едином пространственно-временном интерфейсе мы сможем легко и быстро сёрфить между разными уровнями отображения. Как сказано в описании концепции Карты Событий:
Иерархия субъектов и иерархия событий взаимосвязаны.
Например, мы смотрим событие «Курская битва». Её субъекты – это армии и их командующие.
Подсобытия «Курской битвы» – это отдельные манёвры и боестолкновения, субъекты которых – отдельные подразделения и конкретные люди. Эти субъекты являются подсубъектами соответствующих армий – участников события «Курская битва».
Надсобытие «Курской битвы» – это «Великая отечественная война». Её субъекты-участники – это государства и их руководители. При этом армии и их командующие являются подсубъектами соответствующих государств.
То есть «Великая отечественная война», «Курская битва», отдельные манёвры и бои – это события разного уровня и их субъекты-участники разного уровня. Между иерархиями событий и субъектов можно построить взаимно-однозначное соответствие.
* * *
Кто хочет вместе с нами развивать технологии, кто готов чем-либо помочь в реализации проекта – пишите!