FORGOT YOUR DETAILS?

Сервис по созданию карт iMapBuilder

by / Thursday, 29 November 2012 / Published in Web-решения

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций

В этом обзоре мы покажем, как можно создавать интерактивные карты в режиме онлайн при помощи сервиса iMapBuilder. Данный сервис позволяет составить полноценную интерактивную карту с подсвечиваемыми областями, переходами по ссылкам и иконками. О том, как создавать карты в iMapBuilder, рассказывает корреспондент портала Как сделать презентацию Ольга Тернова.

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

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Входим в личный кабинет.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Можно приступать к работе над картой. Для начала необходимо определить, какой шаблон будет взят за основу. iMapBuilder позволяет работать с готовыми макетами flash карт или загружать собственные изображения.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Последний вариант позволяет создавать необычные интерактивные карты по индивидуальному замыслу. Выбираем Import an Image Map (третий пункт).

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Загружаем файл с изображением. Мы подготовили рисунок карты выдуманного острова.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Теперь перед нами появилась рабочая область с окнами. В основном окне – наше изображение с фантастическим островом. Слева – меню с кнопками для добавления элементов на карту. Дополнительные диалоговые окна позволяют настраивать отображение и поведение объектов.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

В диалоговом окне Map Properties можно поменять основные свойства карты: размер, название, фон и пр. Мы изменили название нашего острова на «Лукоморье».

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Теперь наша задача – сделать карту интерактивной, то есть добавить на нее объекты, которые будут меняться определенным образом в зависимости от действий пользователей. При помощи кнопок на левой панели управления можно добавлять объекты на карту, а затем настраивать их поведение в специальных диалоговых окнах.

Сначала создадим несколько выделенных областей, при наведении курсора на которые пользователи будут видеть текстовые сообщения, а по щелчку мыши переходить на страницы веб-сайтов. Для того, чтобы сделать выделение сложной формы, пригодится инструмент «полигон».

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Щелкните по тому месту, откуда хотите начинать рисовать область.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Аккуратно выводим контур выделения. Поскольку остров называется Лукоморье, то на нем должно по легенде стоять Мировое дерево, так что выделим маленькую часть карты, которая будет обозначать местоположение мифического растения.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

После того, как область выделения будет замкнута, появится диалоговое окно, в котором можно сделать настройки поведения объекта.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

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

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Теперь к интерактивной части. iMapBuilder позволяет настраивать поведение объекта при наведении на него курсора и при клике мышью. Выбираем, что произойдет при действии Mouse Over (мышь сверху). Пусть это будет появление облака с надписью.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

В большом поле внизу вводим текст сообщения, которое будет появляться.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Осталось задать действие, которое будет происходить по щелчку мыши. В разделе Mouse Click устанавливаем тип события (мы выбрали переход по Интернет-ссылке) и вводим адрес веб-страницы. Это может быть что угодно. У нас, например, раздел сайта greenpeace, посвященный охране лесов. Пользователи могут попадать на страницу с вашей инфографикой или виртуальной презентацией.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Вот как будет выглядеть выбранная область при наведении на нее курсора.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

По аналогии мы выделили синюю часть на карте и подписали как «озеро с Русалкой». По щелчку мыши пользователи будут переходить на страницу greenpeace, посвященную охране водных ресурсов.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

На картах можно создавать любые объекты. Мы покажем еще, как добавлять иконки. Для этого потребуется инструмент Add a point.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Установите значок в том месте карты, в котором требуется. В диалоговом окне Points, Lines… выберите Edit рядом с нужным элементом в списке.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Если хотите изменить внешний вид значка, кликните Change рядом с его миниатюрой.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Настройте действия для пользователей, как делали с областью выделения.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

По мере работы с картой ее лучше периодически сохранять. Имейте в виду, что бесплатная пробная версия позволяет сохранить только два проекта.

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

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

Как сделать презентацию, обучение презентациям, тренинги по презентациям, создание презентаций, разработка презентаций

Ресурс iMapBuilder позволяет работать с Google картами, а также с базами данных, которые могут быть в наглядной форме перенесены на карту (Live Data Map).

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

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

Тест-драйв сервиса провела Ольга Тернова, корреспондент портала Как сделать презентацию


TOP