воскресенье, 31 марта 2019 г.

Мастерим ленту времени вместе с Time.Graphics

Наверное, самый удобный способ рассказать о хронологии событий или представить биографию известного человека - это создать ленту времени, которую ещё красиво называют таймлайном. Всё просто: на временную шкалу наносим "события", добавляем к ним тексты, ссылки, изображения и фотографии - и интересная цифровая история готова! Можно и с читателями поделиться, и в блог или на сайт пристроить.

Какой сервис для создания ленты времени выбрать? Я уже рассказывала о двух интересных инструментах: Timeline JS и H5P. Всем они хороши: и красочные, и несложные, и бесплатные. Одно "но" - англоязычные. Потому предлагаю протестировать русскоязычный инструмент под названием Time.Graphics.

Вот такая лента времени получилась у меня. Посвящена она освобождению Заполярья от немецко-фашистских захватчиков в ходе Петсамо-Киркенесской операции. Кстати, ленту можно развернуть на весь экран.





Регистрация 


Итак, материал (тексты, картинки, ссылки, видео) для будущей ленты времени собран, начинаем визуализацию! Заходим на сайт и нажимаем "Создать". Кстати, на стартовой странице сервиса вверху есть переключатель языка. Кроме русского, доступны английский, итальянский, португальский, французский и испанский языки.


Открывается окошко для регистрации. Регистрация быстрая и, как утверждают создатели сервиса, занимает всего 30 секунд. Для создания аккаунта достаточно указать имя, адрес электронной почты и пароль. Хотите еще быстрее? Тогда можно авторизироваться через профили Facebook, Google, Twitter, ВКонтакте.


Не теряем времени даром - и сразу переходим к созданию ленты времени.


Возможности сервиса



По умолчанию перед нами рабочее поле серого цвета со шкалой времени посередине. Сюда мы будем добавлять события будущей цифровой истории.

Справа вверху - ссылка на профиль и личный кабинет, где будут храниться все ленты времени. Вверху три значка для настроек таймлайна. Значок рупора отключает / включает звук, значок "лампочка" меняет фон ленты времени на светлый и наоборот, а значок "фотоаппарат" позволяет загрузить в качестве фона любое изображение с ПК. Кнопка "Save" сохраняет готовую работу. А кнопки справа с "+" и "-" и переключатель-ползунок помогают менять масштаб ленты, приближать и отдалять события на ней.


Теперь щёлкаем по ленте времени левой клавишей "мышки", чтобы добавить первое событие. На ленте времени появляется вот такой список возможностей. Другой способ - нажать вверху на зеленую кнопку "Новое событие".


Событие - это основной эпизод на ленте времени. У события можно установить дату и время, добавить к нему текст, изображение, карту и видео.

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


Доля - это процент выполнения какой-либо задачи. Используется при создании плана работы на "деловых" лентах времени.


Кнопки "Статистика" и "Данные статистики по странам" позволяют добавлять разную статистическую информацию в проект. В первом случае можно добавить свои данные (в таблицу) и отобразить их в виде графика.


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


Интеграция с Google помогает импортировать на ленту времени данные из Google-таблицы и  Google-календаря. В случае с таблицей сервис предложит шаблон, который нужно заполнить и сохранить. Ссылку на шаблон нужно вставить в специальное окошко и сохранить. В результате данные из таблицы автоматически перенесутся на ленту времени. Шаблон на английском языке.


Среди возможностей сервиса ещё много чего, например, добавление статистики из Google Analitics и Яндекс-Метрики и другие опции, нужные при создании бизнес-отчетов. А нам больше интересно создание событий.


Редактируем событие



Создаём событие на ленте времени и приступаем к его редактированию. Щелкаем по нему левой клавишей мыши и открываем карточку события справа. Во-первых, указываем дату: год, месяц, число - вплоть до часа и минуты. Можно и до нашей эры.


Во-вторых, добавляем описание. Затем идут дополнительные настройки: положение на ленте времени (вверху, внизу), дизайн (облачко, рамочка, точка на шкале), цвета (общий и текста). Чтобы удалить событие со шкалы, нажимаем на значок "корзинка", он расположен в самом низу панели редактирования.

К каждому событию можно прикрепить  изображение (значок фотоаппарата), загрузив его с ПК или из Интернета по ссылке, видео (по ссылке с YouTube или Vimeo) или карту, указав в открывшемся окошке место действия. Как только весь контент добавлен, просто закрываем карточку. Сервис сам поставит событие в нужное место на ленте времени.


У сервиса есть интересная опция - можно группировать несколько событий. Для этого щёлкаем по ленте времени левой клавишей "мышки", нажимаем кнопку "Группировка", выбираем несколько событий, которые необходимо сгруппировать - редактируем описание и оформление получившейся группы.


В проектах у создателей сервиса возможность соединять события между собой линиями.


Сохраняем, распространяем



Ну вот все события размещены на ленте, отредактированы и красиво оформлены. Сохраняем получившуюся красоту кнопочкой  "Save". После этого в открывшееся окно вносим название ленты времени, её описание и устанавливаем дополнительные настройки. Самое главное - делаем доступ к ленте времени публичным (Public). Остальные опции платные: возможность совместного редактирования (Anyone can edit), доступ по ссылке (Link), приватность (Private).


Нажимаем "Сохранить" - и тут же получаем ссылку на готовую работу и код, чтобы встроить её на страницу сайта или блога.


Среди дополнительных возможностей - экспорт ленты времени в виде рисунка или презентации. Для этого нажимаем под лентой времени кнопку "Export" и выбираем нужный формат. Правда, сохраняется работа с огромным водяным знаком на заднем плане.


Осталось добавить, что в бесплатном аккаунте можно создать пять лент времени из 50 событий с использованием 20 медиа (изображения, карты, видео).

2 комментария:

Этот пост ждёт ваших комментариев.
Не знаете, как оставить комментарий?
Тогда эта инструкция для вас!

- Нажмите на стрелку рядом с окошком "Подпись комментария".
- Выберите "Имя/URL".
- Напишите своё имя, строчку URL можно оставить пустой.
- Нажмите "Продолжить" и комментируйте.

Заранее спасибо!