Симулятор ПО от создателей Courseditor

Разработчики таких сервисов, как конструктор обучающих лонгридов Courseditor и транскрибатор Any2text, порадовали новым удобным и полезным инструментом — Simulator.

Это облачное решение позволяет создавать симуляции в двух режимах:

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

Если вы впервые слышите про такой инструмент безопасного обучения работе в программном обеспечении, то для начала можете прочитать статью В чем сила симуляторов ПО?

А теперь подробнее к обзору.

Для создания нового проекта нужно загрузить заранее заготовленные однообразные скриншоты, которые покадрово фиксируют выполнение какого-нибудь процесса в ПО.

Каждый проект — как отработка определённой операции. Для примера допустим, что нужно научить пользователя искать определённого исполнителя в Яндекс Музыке и включать нужную песню.

После загрузки изображений новый проект откроется в режиме «Редактор» и будет выглядеть, как презентация:

• слева — список кадров,
• по центру — выбранный кадр,
• справа — панель добавленных на кадр элементов с их настройками.

Значок с восклицательным знаком на миниатюре кадра говорит о том, что на этом кадре ещё не настроена навигация. Это значит, что пока с него никуда невозможно перейти.

Переход можно организовать двумя способами — кликабельными элементами на слайде или включением опции «Навигация» у подсказки.

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

Кадры можно перетаскивать вверх-вниз.

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

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

В окне настройки затемнения предлагается выбрать цвет и прозрачность — зависит от основного фона скриншотов.

В нашем примере при тёмных скринах «затемнение» лучше выбрать светлым.

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

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

К примеру, для приветствия и советов по ходу демонстрации поможет «Подсказка».

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

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

Чтобы поменять цвета подсказки, нужно перейти в настройки проекта.

Чтобы подсказку визуально «направить» к определённому месту на скриншоте, можно использовать стрелку. Расположение стрелки выставляется через настройку «Выравнивание».

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

Так это выглядит в режиме «Предпросмотр». Под кадрами представлена активная шкала прогресса, по которой можно быстро перейти на любой из пройденных кадров, кликнув по закрашенному отрезку.

Подсказке можно добавить указатель — это место нажатия. В таком случае нужно отключить штатную навигацию.

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

Элемент «Область» можно использовать в разных случаях:

1. Просто как рамку-обводку для привлечения внимания к чему-нибудь на кадре
2. В качестве активной зоны, по нажатию на которую можно перейти на следующий кадр
3. Без обводки в качестве активной зоны при проверке знаний в режиме «Тренажёр»

Оформление области меняется в окне настроек проекта.

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

Элемент «Поле ввода» используется в двух режимах по-разному:

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

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

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

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

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

Проекту можно поменять фон и шкалу прогресса.

По умолчанию проект создаётся как демонстрация – пользователь нажимает туда, куда ему показывают.

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

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

В списке проектов демонстрации и тренажёры отличаются по значкам.

Готовые проекты можно публиковать в формате SCORM для загрузки в LMS или в Web для использования на любых сайтах.

И это только первая версия, ожидаем год обновлений! Но уже сейчас можно пробовать самостоятельно и создавать реальные проекты в simulator.