1 апреля 2020

Как создать электронный курс с помощью Articulate Storyline

Какие возможности редактора доступны для новичков и какой функционал будет полезен для опытных разработчиков

Анастасия Ульянова
Разработчик электронных курсов

Шесть лет создает электронные курсы: работает над методологией обучения и сценариями, внедряет и развивает СДО в компаниях
Олег Буйлов
Руководитель направления в отделе методологии обучения ПАО Сбербанк




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

Articulate Storyline: что это и сколько он стоит

Для создания электронного курса нужен подходящий инструмент. Понять через несколько часов или дней работы, что в выбранной среде идею реализовать не получится, — не самый приятный исход. Поэтому в LEVEL мы используем максимально функциональные инструменты, и самый популярный из них — Articulate Storyline. Для тех, кто только начинает изучать e-learning, справка:

Компания Articulate выпускает инструменты для разработки электронных курсов и считается одним из лидеров индустрии. Storyline 360 — это многофункциональный редактор, позволяющий создавать учебный и интерактивный контент: диалоговые тренажеры, тесты, симуляции и мини-игры.

Articulate объединила девять своих программ для разработки электронных курсов в один пакет и назвала его Articulate 360. Этот пакет распространяется по подписке за $ 999−1299/год и включает в себя Storyline 360, а также инструменты для создания адаптивных курсов, обратной связи и библиотеку контента Articulate Content Library с наборами картинок, иконок, шаблонов и прочих радостей.
Когда курсы создавались без специальных инструментов, внести правки и переверстать их было довольно непросто, по крайней мере, сложнее, чем сделать это сейчас в Storyline. Редактор от Articulate полюбился многим именно благодаря своей интуитивности и простоте использования и обучения: в сети много уроков по работе с программой, а встроенных шаблонов достаточно, чтобы без посторонней помощи создавать несложные электронные курсы.
Storyline во многом похож на Microsoft PowerPoint: работать тоже придется со слайдами, но возможностей значительно больше. Кстати, с помощью Storyline уже готовую презентацию из PowerPoint можно быстро превратить в электронный курс и разместить в СДО.
Пример отчета об обучении в сервисе аналитики дистанционного обучения​
Многие годы большинство учебных пособий создавалось в PowerPoint, и даже сейчас некоторые программы разработки дистанционных курсов остаются на него похожими. Вероятно, именно это «родство» и делает интерфейс Storyline интуитивно понятным, даже несмотря на отсутствие русификации

Четыре функции редактора, которые вы можете применить уже сейчас

1. Работа со слоями.

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

Например, при наведении курсора объект будет менять цвет, появляться или исчезать.
Пример отчета об обучении в сервисе аналитики дистанционного обучения​
В Articulate Storyline есть несколько стандартных видов анимации для объектов: они могут двигаться от точки к точке по прямой, по линии в форме фигуры или по заданной от руки траектории. Также можно настроить пользовательскую анимацию, когда объект, к примеру, изначально скрыт. Источник: YouTube-канал SRC Мультимедиа
3. Добавление видео и аудио.

Полезная функция с базовым набором инструментов.
4. Доступ к стандартной медиабиблиотеке.

Там хранятся иконки, иллюстрации, кнопки, маркеры, счетчики и многое другое.
Эффективнее всего начать разбираться с функционалом на практике, и перечисленных выше функций будет достаточно, чтобы уже приступить к работе. Например, интерактивный тест можно создать в несколько кликов из готовых шаблонов.
Новые знания прямо на почту
Подпишитесь на e-mail рассылку, чтобы одним из первых получать анонсы статей наших экспертов. Также в письмах рассказываем, как работают электронные курсы или бизнес-симуляции для конкретных задач. Присылаем письма 2 раза в месяц.
Ваш e-mail адрес — это персональные данные, которые мы обрабатываем. Когда вы подписываетесь на рассылку, то соглашаетесь с политикой конфиденциальности.
Пример отчета об обучении в сервисе аналитики дистанционного обучения​
Шаблоны из базы тестов в Storyline могут быть с одним или несколькими вариантами ответов, а также с возможностью вставить пропущенное слово, восстановить последовательность или сопоставить элементы

Продвинутый функционал Articulate Storyline

Если шаблонных решений недостаточно, будьте готовы собрать курс вручную. Ниже мы детально рассмотрим другие инструменты редактора.

1. Запись видео с экрана с возможностью выбора формата его вставки.

В Storyline есть инструмент, позволяющий за пару кликов сделать простой интерактивный тренажер по программному обеспечению. Этот же тренажер можно собрать и вручную, получив гибкий продукт, легко кастомизируемый под любой дизайн и дополнительный функционал.
Пример отчета об обучении в сервисе аналитики дистанционного обучения​
Для создания тренажера по программному обеспечению используется запись видео с экрана с возможностью выбора формата его вставки на слайд: просто как видео или step-by-step (шаг за шагом)
2. Скрипты на JavaScript.

Еще большей уникальности курса можно добиться, дополняя стандартные инструменты небольшими (или большими) скриптами на JavaScript. Они позволяют взаимодействовать с веб-сервисами или веб-объектами за пределами редактора. Например, в самом Storyline нельзя сделать виртуальный 3D-тур, но его можно разработать отдельно, затем встроить на слайд в Storyline, а результат прохождения передать в курс с помощью JS.

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

Правда, тут не обойтись без знания языка программирования или помощи разработчика. Еще помощь специалиста потребуется, если в электронном курсе нужно использовать фирменный стиль компании: единообразные картинки, иллюстрации, иконки. Так, для каждого клиентского проекта в LEVEL выделяется один или несколько дизайнеров.
Пример отчета об обучении в сервисе аналитики дистанционного обучения​
Код прописывается в триггере и может понадобиться, если, например, нужно принудительно передать в СДО несколько различных баллов (не путать с финальным баллом, который передается автоматически). Изображение: скрин из видеоурока от SRC Мультимедиа

Три лайфхака для опытных разработчиков

1. Как добавить в курс автоматический счетчик слайдов.

Многие разработчики делают нумерацию слайдов одним из двух способов:

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

В версии Storyline 360 появились системные переменные, позволяющие автоматически отобразить номер текущего слайда или сцены, общее количество слайдов и т. п. Используйте для этого переменную Project.SlideNumber. Но с ее использованием есть две хитрости:
2. Как опубликовать курс в виде мобильного приложения.

Иногда необходима возможность изучения курса без СДО и в офлайн-режиме, например, если это инструкции для курьеров или водителей. Один из вариантов — упаковать курс как мобильное приложение для Android или iOS (но с iOS сложнее, потому что размещать приложения можно только через App Store, а там довольно жесткие правила публикации). Для этого существует сервис Adobe PhoneGap. Он позволяет бесплатно конвертировать папку с курсом в файл мобильного приложения.

Для этого нужно:

  • Опубликовать курс в формате Web, переименовать story. html в index.html.

  • Добавить в корень папки иконку приложения. Иконку нужно сделать квадратной, размер — 64х64 px, формат — png с поддержкой прозрачности. Назвать icon.png. Можно сгенерировать наборы иконок для разных разрешений экрана, например, с помощью сервиса Abiro PhoneGap Image Generator, а также добавить заставку.

  • Добавить в корень папки файл конфигурации config.xml. В нем изменить название курса, автора и пр.
<?xml version="1.0" encoding="UTF-8" ?> 

<widget xmlns = "http://www.w3.org/ns/widgets" 

xmlns:gap = "http://phonegap.com/ns/1.0" 

id = "com.phonegap.example" 

versionCode = "10" 

version = "1.0.0" > 


<!-- versionCode is optional and Android only --> 


<name>Название приложения</name> 


<description> 

Описание приложения 

</description> 


<author href="[<https://mysite.ru>](<https://mysite.ru/>)" [email="author@mysite.ru](mailto:email=%22author@mysite.ru)"> 

Автор приложения 

</author> 

<icon src="icon.png" /> 

</widget> 
  • Упаковать содержимое в ZIP-архив.
  • Зарегистрироваться на сайте Adobe PhoneGap, опубликовать там zip-архив как мобильное приложение.
  • Скачать APK-файл (для Android), после чего можно пользоваться им на мобильных устройствах.
3. Как закрепить цветовую схему в палитре.

Как правило, при разработке курса есть определенная цветовая схема, например красный цвет у заголовков в тексте. В Storyline есть способ закрепить это в цветовой палитре, чтобы не уточнять каждый раз нужные коды цветов. Это можно сделать на вкладке Design > раздел Colors > Create New Theme Colors.

Советы по созданию идеального электронного курса

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

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

2. Верстайте курс в одной цветовой гамме, а еще лучше — в фирменных цветах компании: так он лучше воспринимается.

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

4. Используйте индикатор прохождения и интерактивную карту курса. Это поможет пользователю лучше ориентироваться и планировать время на обучение.

5. Диалоговые тренажеры — отличный способ закрепить большой объем теории по коммуникации. Они наглядно показывают, как ее можно применить на практике, и формируют желаемую модель поведения. Но тут нужно быть внимательным: для тренировки не коммуникативных навыков такой инструмент мало подходит.

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

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

8. Используйте фото реальных сотрудников и реальных локаций компании, а в качестве сюжета — реальный рабочий опыт. Это нужно для повышения интереса и вовлеченности в курс.

Другие инструменты для создания курса

Разумеется, Storyline не единственная среда для создания электронных курсов. Из наиболее популярных есть еще Adobe Captivate, WebSoft CourseLab и iSpring Suite. У каждой из них есть свои преимущества. Например, iSpring Suite позволяет быстро сделать простой курс благодаря легкому интерфейсу, в Captivate есть замечательная функция Fluid boxes, которая делает курсы полностью адаптивными под любые устройства и экраны, а CourseLab при широком функционале стоит дешевле многих своих аналогов.
Но Storyline полюбилась очень многим разработчикам именно благодаря своей универсальности. Она объединила в себе большинство самых востребованных инструментов и понятный интерфейс, давая широкие возможности при минимальных усилиях.

Почему стоит выбирать Storyline

Несмотря на то что минусы есть и у Storyline (например довольно высокая по сравнению с конкурентами цена и отсутствие русификации интерфейса), программа по праву считается одним из самых универсальных инструментов для создания электронных курсов, потому что:

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

2. Основные функции можно освоить благодаря туториалам в сети (в том числе и на русском языке), которых уже очень много, или с помощью активного англоязычного комьюнити E-learning Heroes.

3. Для ознакомления даже не придется покупать лицензию: есть бесплатная 60-дневная триал-версия.

Если вы создаете курс впервые, то воспользуйтесь базовым функционалом и шаблонами Storyline, которых будет достаточно, чтобы сделать обучающие презентации, тесты или диалоговые тренажеры.

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