Skip To Content

Создание Story Map Journal

На этом уроке вы построите это приложение Story Map Journal с основными районами и достопримечательностями города Сан-Диего (шт. Калифорния, США). Приложения Story Map Journals очень полезны, если надо построить длинное повествование, которое было бы легко разделить по отдельным секциям. Каждая секция такого журнала представляет карту, изображение, видео или веб-ресурс, дополненный соответствующим текстом на боковой панели. Вы также можете задать интерактивные действия для текста на боковой панели. Эти действия будут изменять веб-карты когда пользователи щёлкают на определённых словах или предложениях. Ваше приложение Story Map Journal продемонстрирует некоторые наиболее известные места города Сан-Диего. Для построения Story Map Journal вы будете использовать готовую веб-карту города и предоставленные фотографии.

Запустите конструктор Map Journal

Сначала надо найти соответствующий шаблон на сайте Esri Story Maps и начать строить новый Story Map Journal. Затем вы выберете компоновку и заголовок.

  1. Go to the Esri Story Maps website.
  2. At the top of the page, click Apps.
  3. Прокрутите до раздела Подробное и яркое мультимедийное повествование и найдите опции шаблона Story Map Journal.

    Шаблон Story Map Journal

  4. Щелкните Построить.
  5. Если будет предложено, войдите из-под учетной записи ArcGIS и щёлкните Перейти в Конструктор Journal.
    Примечание:

    If you don't have an ArcGIS account, you can sign up for a free public account.

    Откроется окно Добро пожаловать в Конструктор Map Journal. В этом окне можно выбрать формат компоновки для Story Map Journal. Поддерживаются два варианта компоновки: Боковая панель и Откреплённая панель. Откреплённые панели предназначены для коротких описаний, когда основное внимание сосредоточено на карте. На создаваемой карте-истории вы будете комбинировать фотографии, карты и более подробный описательный текст для каждого местоположения, поэтому для целей данного упражнения лучше подойдёт Боковая панель.

  6. В окне Добро пожаловать в Конструктор Map Journal подтвердите выбор Боковой панели. Затем щёлкните Начало.

    Опции компоновки Конструктора Map Journal

    Теперь Конструктор Map Journal предлагает ввести название.

  7. В окне Введите ваш заголовок напечатайте Добро пожаловать в Сан-Диего.
    Примечание:

    Если появляется сообщение, что элемент с таким именем уже существует, добавьте к названию свои инициалы .

  8. Щёлкните кнопку Далее.

    Откроется окно Добавить домашний раздел.

Добавить домашний раздел

Map Journals состоит из разделов или секций. Начальный раздел – это первый раздел, который видят пользователи, открыв журнал. Он служит в качестве введения.

Сначала вы добавите изображение для Главного раздела своей Начальной секции. Панель Главного раздела – это большая область отображения справа от боковой панели. На ней могут отображаться карты, фотографии, видео и веб-ресурсы. На этой карте-истории надо сделать так, чтобы Главный раздел привлекал читателей карты и им бы хотелось продолжить читать вашу историю.

Вы можете перетаскивать фотографии непосредственно в Конструктор Map Journal со своего компьютера, или получать доступ к изображениям, размещённым на фотохостингах в интернете. Загружаемые с компьютера фотографии сохраняются непосредственно в вашей истории Map Journal. Загрузка изображений – рекомендуемый способ добавления фотографий и прочей графики в историю. В данном случае, фотографии уже выгружены на Flickr в общий доступ, и вы можете ими пользоваться.

  1. В окне Добавить домашний раздел в опциях Ресурсы выберите Изображение.
  2. Щёлкните Flickr.

    Добавить изображение из Flickr

  3. В качестве Имени пользователя Flickr введите Esri Story Maps Demo и щёлкните Загрузить альбомы.

    Появится единственный альбом этого пользователя.

  4. Щёлкните альбом Welcome to San Diego.

    Вы увидите все 33 изображения, загруженные в этот альбом. Тот, который вы выберете, станет заглавным изображением вашего приложения Map Journal.

  5. Щёлкните фотографию под названием View over San Diego Bay (Вид на бухту Сан-Диего), или любую другую на своё усмотрение.

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

  6. Убедитесь, что в опции Положение установлено Заполнение и щёлкните Далее.

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

  7. В текстовое окно введите или скопируйте и вставьте этот текст введения:

    В городе Сан-Диего почти идеальный климат с бесконечным летом, великолепные пляжи, оживлённый исторический центр, спокойный жилые кварталы и непринуждённая атмосфера.

    Кроме того, есть многокилометровый берег океана, горы и пустыни.

    Мы хотим рассказать вам о городе и заодно показать интересные места, которые, мы надеемся, вам понравятся.

    Боковая панель ресурсов

    Подсказка:

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

  8. Если введённый текст вас устраивает, щёлкните Добавить.

    Фотография и текст добавятся в Конструктор Map Journal.

    Домашний раздел

  9. В верхней части конструктора Map Journal щёлкните Сохранить.

    Сохранить

    Ваш Домашний раздел готов.

Добавление секции для Сан Диего

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

  1. Внизу боковой панели щелкните Добавить раздел.

    Добавить раздел

    Появится окно Добавить раздел.

  2. В качестве заголовка введите Сан Диего: второй по величине город в Калифорнии.
  3. Убедитесь, что в качестве опции Ресурсы отмечена Карта.
  4. Щёлкните меню Выберите или создайте карту и выберите Выберите карту.

    Выберите карту

    Откроется окно Выберите карту. По умолчанию открывается местоположение для выбора карт – Мои ресурсы – в которых находятся ресурсы вашей учётной записи. Но можно искать и в других источниках, например в вашей организации или общедоступных ресурсах на ArcGIS Online. Вы будете использовать веб-карту, которая опубликована на ArcGIS Online.

  5. Щёлкните стрелку рядом с Моими ресурсами и выберите ArcGIS Online.

    Выбор ArcGIS Online

  6. В поле поиска введите CreateMJSanDiego owner: StoryMaps и нажмите Enter.

    Поиск карт

    Подсказка:

    Если у вас уже есть готовая ссылка на URL для определённой веб-карты ArcGIS (https://www.arcgis.com/home/item.html?id=346b76ac939f474b80795b7a3427831c), можете получить доступ к ней непосредственно. Вы будете искать часть ID из её URL, в данном случае, 346b76ac939f474b80795b7a3427831c.

  7. Щёлкните карту Welcome to San Diego, принадлежащую StoryMaps.

    Эта веб-карта создана на ArcGIS Online. Она содержит некоторые районы и достопримечательности Сан Диего, а также маршруты паромов и троллейбусов. Но вам надо не просто отобразить эту карту, а её определённое местоположение.

  8. В опции Местоположение щёлкните Пользовательская конфигурация.

    Местоположение Пользовательская конфигурация

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

  9. Увеличьте карту, чтобы показать окрестности города Сан Диего, мексиканскую границу и окружающие горы.

    Карта окрестностей Сан Диего

  10. В окне Местоположение карты щёлкните Сохранить место на карте.

    Теперь текущий экстент карты будет по умолчанию отображаться в вашем приложении Story Map Journal. Вы также можете изменить ресурсы и всплывающие окна на карте, но для наших целей подходят установки по умолчанию.

  11. В окне Добавить раздел щелкните Далее.

    Далее надо добавить текст и фотографию на боковую панель.

  12. В текстовом окне введите следующую информацию о Сан Диего:

    Сан Диего расположен на берегу Тихого океана, 120 миль к югу от Лос-Анджелеса и 20 миль на север от Тихуаны.

  13. Дважды нажмите Enter, чтобы добавить две пустые строчки ниже текста.
  14. На панели инструментов текстового редактора щёлкните кнопку Вставить изображение, видео или веб-страницу.

    Вставить изображение, видео или веб-страницу

    Откроется окно. Оно похоже на то окно, в котором вы выбирали фотографию для Домашнего раздела.

  15. Щёлкните Flickr. Убедитесь, что в текстовом окне Esri Story Maps Demo, щёлкните Загрузить альбомы и выберите альбом Welcome to San Diego из Flickr.
  16. Щёлкните фотографию под названием Sunset Cliffs (скалы на закате).

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

  17. Щелкните Применить.

    Изображение и его подпись добавятся в окно.

  18. Прокрутите текстовое окно вниз и щёлкните ниже нового изображения и его подписи. Введите (или скопируйте и вставьте) следующий текст:

    Из Лос-Анджелеса до Сан-Диего можно добраться за два часа, либо на машине, либо по железной дороге Amtrak Pacific Surfliner.

    Хотя наибольшую известность округ Сан-Диего получил благодаря береговой линии, здесь есть ещё и горы. Лагуна-маунтинс в 80 км к востоку от города известны восхитительными видами государственного парка Анза-Боррего – огромной пустынной особо охраняемой природной территории, самого большого государственного парка в Калифорнии.

  19. Нажмите Добавить.

    Раздел добавится в Конструктор Map Journal. Он знакомит читателей с городом Сан-Диего и его окрестностями.

    Вводный раздел

    Подсказка:

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

Добавление секции об историческом центре города Сан-Диего

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

  1. Внизу боковой панели щелкните Добавить раздел.
  2. В качестве названия нового раздела введите Исторический центр города Сан-Диего.

    По умолчанию карта всё та же, Welcome to San Diego. В опции Местоположение всё ещё выбрана Пользовательская конфигурация с тем же местоположением, которое вы уже использовали чуть ранее. Вы используете ту же веб-карту, но измените местоположение.

  3. В опции Местоположение щёлкните Пользовательская конфигурация.
  4. Увеличьте карту так, чтобы надпись San Diego осталась посередине, аэропорт оказался в левом верхнем, а парк Balboa Park в правом верхнем углу.

    Центр города Сан-Диего

  5. В окне Местоположение карты щёлкните Сохранить место на карте.

    Помимо зелёных точек интереса, на карте также есть слой, показывающий маршруты паромов, и определённые районы. Можно также включить насколько дополнительных слоёв.

  6. В опции Содержание щёлкните Пользовательская конфигурация.
  7. В окне Содержание карты поставьте отметки возле тех слоёв, которые хотите показать, например Food (еда) или Trolley Lines (троллейбусные маршруты).
  8. Щёлкните Сохранить содержание карты.
    Примечание:

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

  9. Нажмите Далее.

    Далее надо добавить текст и ещё несколько фотографий на боковую панель.

  10. В текстовом окне введите какой-нибудь текст о центре города Сан-Диего. Можете сочинить его сами, или использовать следующий текст:

    Начните свой визит в Сан-Диего с его оживлённого центра. Здесь, возле бухты Сан-Диего, находятся Конференц-центр, Гавань, бейсбольный стадион и ещё много всего интересного.

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

    Маленькая Италия – другой популярный район, в котором итальянские истоки сочетаются с модным современным дизайном.

    Щёлкая на зелёных точках, вы получите информацию о местах для развлечений, а на синих – о некоторых хороших местах, где можно поесть.

  11. Добавьте фотографию из уже знакомой вам учётной записи Flickr, чтобы представить центр города. Или можете взять по отдельной фотографии для Квартала Газовых фонарей и Маленькой Италии.
  12. Когда фотографии будут вставлены, щёлкните Добавить, чтобы завершить этот раздел.
    Подсказка:

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

  13. Сохраните Story Map Journal.
    Примечание:

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

    Вы добавили новый раздел об историческом центре города Сан-Диего.

Добавление действий

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

  1. В своём разделе Исторический центр города Сан-Диего щёлкните кнопка Редактировать, чтобы редактировать раздел.

    Кнопка Редактировать

  2. В окне Редактировать раздел выделите слова «Квартал Газовых фонарей».

    Когда текст подсвечен, становятся доступными опции Действия в истории.

    Опции Действия в истории

  3. Щёлкните кнопку Изменить ресурсы основной площадки.

    Изменить ресурсы основной площадки

  4. Если необходимо, в опции Медиа выберите Карта и выделите карту Welcome to San Diego.
  5. В опции Местоположение щёлкните Пользовательская конфигурация. Приблизьтесь к району Квартала Газовых фонарей и щёлкните Сохранить место на карте.
  6. Щёлкните Применить и затем Сохранить.

    Теперь текст, к которому вы применили действие, подчеркнут на боковой панели. Вам надо проверить как работает действие.

  7. На боковой панели щёлкните подчёркнутый текст Квартал Газовых фонарей.

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

    Примечание:

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

  8. Щелкните кнопку Редактировать.
  9. Если надо, вернитесь к тексту Квартал Газовых фонарей. Щёлкните кнопку Изменить ресурсы основной площадки.
  10. В опции Всплывающая информация щёлкните Пользовательская конфигурация.

    Карта активизируется и появится окно Всплывающее окно карты.

  11. На карте щёлкните зелёную точку в окрестностях Gaslamp Quarter.

    Всплывающая подсказка Квартала Газовых фонарей

  12. В окне Всплывающее окно карты щёлкните Сохранить конфигурацию.

    Теперь при запуске пользователем действия появится всплывающая подсказка для Квартала Газовых фонарей.

  13. Щёлкните Применить и затем Сохранить.

    Вы добавили действие к истории. При желании вы можете повторить эти шаги, чтобы добавить дополнительные действия для квартала Маленькая Италия.

  14. Сохраните Story Map Journal.

Предварительный просмотр Map Journal и публикация карты-истории

Вы создали несколько разделов и действий, теперь можно просмотреть как читатели будут видеть эту карту-историю Map Journal. Затем вы опубликуете её, чтобы другие смогли её прочитать.

  1. В верхней части конструктора Map Journal щёлкните Просмотр истории.

    Просмотр истории

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

    Предварительный просмотр Map Journal

    В вашем приложении Map Journal всего три раздела. Дополнительно вы можете добавить ещё секции, показывая на этой же веб-карте другие районы, например парк Бальбоа, Ла-Холья и пляжи (Mission Beach и Pacific Beach). Также можно добавить заключительный раздел, используя фотографию из основной панели.

    Можете также изменить оформление своего приложения, используя кнопку с настройками в верхней части Конструктора. Если вы собираетесь публиковать и продвигать своё приложение, на вкладке Заголовок в окне Настройки можно загрузить логотип своей фирмы. Для целей данного урока можно считать, что приложение готово. Теперь его надо опубликовать.

  2. Закройте предварительный просмотр и вернитесь в Конструктор Map Journal.
  3. В верхней части конструктора щёлкните кнопку Общий доступ.
  4. В окне Откройте доступ к истории измените настройку с частной на Общедоступный.
  5. Закройте окно Откройте доступ к истории.

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

Ваше приложение Story Map Journal готово и опубликовано. В нём читатели могут познакомиться с городом Сан-Диего при помощи фотографий, карт и интерактивного текста. В качестве источника для вдохновения ознакомьтесь с рядом примеров из Галереи Story Map Journal . В этой галерее находятся примеры, показывающие как можно использовать приложение Story Map Journal, шаблоны дизайна которых можно использовать в качестве передового опыта. Вы можете фильтровать галерею по теме или сфере деятельности, либо выполнять поиск по ключевым словам. Посмотрите – возможно вы найдёте какие-нибудь примеры и из своей сферы интересов. Получите представление о том, как при помощи Map Journal можно передать информацию и какие подходы наиболее эффективны при сочинении подобных историй.