Мини-курс "Как собрать и оформить курс". Урок 1. Применяем принципы визуального дизайна для электронного учебного материала

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

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

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

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

Более детально рассмотрим эти рекомендации далее в теме про юзабилити.

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

290fad257fccb28ff120856991fb1ddc.jpg
Тепловые карты F-образного сканирования (из статьи Якоба Нильсена F-образный паттерн чтения веб-контента)

Есть некоторые технические моменты, которые необходимо предусмотреть на этапе сборки. Если целевая аудитория учебного материала будет использовать различное ПО и различные устройства для просмотра курса, то укажите технические характеристики: операционная система, браузер, разрешение экрана, пропускная способность интернет-канала. Если во время прохождения курса вы предлагаете ученику скачать какой-либо файл, то обязательно укажите его размер и дайте возможность принять решение о загрузке сразу или, например, только при нахождении в зоне wi-fi.

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

Популярные сообщения из этого блога

Как отработать на практике новые знания?

База знаний про онлайн-обучение и не только (лучшие статьи блога)

Профессиональные сообщества: зачем их создавать и как развивать?