10 особенностей разработки электронных курсов для мобильных устройств

10 особенностей разработки электронных курсов для мобильных устройств

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

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

1⃣ Кнопки под большой палец

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

2⃣ Используем «свайп» и где нужно – условный

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

3⃣ Меньше текста на экране

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

4⃣ Вертикальные рисунки

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

5⃣ «Зум» картинок

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

6⃣ Крупнее объекты для нажатия

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

7⃣ Не заморачивайтесь на наведении

Верстая курсы для мобильных устройств, забудьте про состояние «hover», не тратьте время на подготовку отдельного оформления кнопок при наведении. Нет никакого наведения, когда палец жмет на сенсорный экран.

8⃣ Не делайте событий по клавишам

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

9⃣ Вместо уменьшения размера шрифта лучше скролл-панели

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

🔟 Во весь экран или в окно браузера

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

Андрей Матюков (lifel.ru) специально для сообщества Digital Learning