шаблон электронного курса, кнопки навигации в слайдовых курсах, пользовательский интерфейс (ux/ui), courselab
На всякий случай уточню, что далее речь будет идти о слайдовых курсах, где для навигации по курсу используются кнопки перехода.
Поначалу тема может показаться банальной. Все размещают кнопки перехода в курсах. Это же естественно. Однако проблема в том, насколько не естественно все их размещают. Ведь большинство разрабов бездумно копипастят элементы интерфейса откуда ни попадя, тем самым, в ряде случае снижая качество курса, как минимум, за счёт меньшего удобства его использования.
Amedium
i-eLearning
Далее немного лирики. На слайдовых курсах должны быть кнопки перехода Далее и Назад. Они позволяют пользователю перейти с одного кадра/слайда на другой. Чаще всего пользователи щёлкают именно по кнопке Далее. Ведь большинство курсов нужно именно прощёлкать, чтобы не травмировать свою психику :) Поэтому в особо ядрёных курсах кнопки перехода размещают так, что щёлкать по ним становится не очень удобно: посерёдке, сбоку, вплотную к другим кнопкам (вот чуть указатель сдвинул - и щёлкнул по кнопке вызова менюшки). Иногда хитрый разработчик маскирует кнопки перехода под колечки, машинки и другие "весёленькие" изображения, чтобы с первого раза не было понятно, куда нужно щёлкнуть.
А теперь по делу.
1) Кнопки перехода должны быть доступными на каждом кадре, возможно, за исключением кадров с проверочными вопросами и заданиями. Они не должны блокироваться из-за того, что на каком-то кадре появилась дублирующая навигация, которую пользователь во что бы то ни стало должен прощёлкать.
unknown
2) Кнопки не должны появляться с задержкой. Это раздражает. По многим причинам. Во-первых, это топорное навязывание просмотра контента за счёт временного запрета перехода на следующий кадр (наиболее яркий признак примитивного курса). Во-вторых, кнопка через непонятно какой промежуток времени всё равно вынырнет, причем так, что это будет очень заметно ("а_вот_и_я").
3) При этом недоступная кнопка навигации, как и любая другая недоступная кнопка, должна выглядеть как "недоступная кнопка" (именно так). То есть, не исчезнуть ВДРУГ, и потом появиться, а просто поменять свой внешний вид (например, была чёрно-белой, стала цветной).
unknown
4) Кнопки перехода должны быть размещены всегда в одном и том же месте - в правом нижнем углу. Конечно же, если это курс для правшей, переученных левшей, а не для стив_джопсов.
unknown
5) Кнопки перехода должны быть размещены отдельно от других кнопок. Визуально это должен быть отдельно выделенный блок, охранное поле которого ничто не должно нарушать. И, конечно же, лишено всякого смысла размещение кнопок перехода между другими функциональными кнопками.
Amedium
6) Кнопки перехода должны быть легко распознаваемыми. Поэтому - либо стрелки, либо надписи ("Далее", "Вперед"). И еще они должны быть контрастными (впрочем, как и все нормальные кнопки).
7) Сомнительное решение - делать кнопки перехода разными по размеру, когда кнопка "Назад" значительно меньше кнопки "Далее". Возникает такое ощущение, что сам разработчик как бы против того, чтобы пользователь вернулся назад для повторения материала. Большая кнопка "Далее" почти что призывает пользователя: "Ну, давай же, нажми меня, чтобы пролистать этот курс поскорее". Но это не самый большой грех на Земле (я даже сам такие использовал).
8) При наведении указателя мышки на кнопку должен появляться тултип, содержащий сообщение о последствиях её нажатия (должна появится подсказки типа "Переход на следующий кадр", "Переход в следующий раздел").
9) В courslab имеет смысл вставлять таймер на 0,1-0,2 сек перед действием "Переход". Зачастую это позволяет избегать мигания экрана при переходе (часто при переходе курс ведет себя так, будто он на мгновение "подвис|).
10) Не совсем по теме. Следует добавлять индикатор, который показывал бы, на каком кадре находится пользователь в рамках того или иного раздела. Во-первых, пользователь поймет, как много времени может уйти на изучение раздела. Если он видит, что кадров порядка 30, то для изучения этого раздела нужно будет выделить соответствующее количество времени. Во-вторых, он поймет, что последний кадр - это именно последний кадр (чтобы не возникало чувство того, что тема как-то совсем внезапно завершилась).
11) Также не помешало бы вообще облегчить жизнь пользователям, сделав возможным переход по нажатию комбинации клавиш: Ctrl+→ и Ctrl+←.
