mediaelementjs

Вы находитесь на устаревшей версии сайта romka.eu. Она оставлена здесь на случай если я захочу поностальгировать по тому как выглядел интернет в 2012 году :) Так этот сайт выглядел с июня 2012 по февраль 2023. Эта версия сайта не обновляется, комментирование материалов отключено. Обновленная версия сайта доступна по адресу http://romka.eu.

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

Submitted by Ромка on Чт, 23/01/2014 - 21:12

Ромка аватар
28572
Vote up!

MediaElement language learning plugins

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

За эталон, к которому я стремился при разработке, был взят проигрыватель http://www.yabla.com (не буду скрывать, изначально планировалось склонировать ресурс целиком, но проект не завёлся). Этот проигрыватель обладает следующими особенностями:

  1. навигация по таймлайну осуществляется не с точностью до секунды, а с точностью до предложения. Человеку, изучающему язык по видеороликам, часто приходится проматывать видео назад, чтобы несколько раз переслушать неразборчивую фразу и гораздо удобнее одним кликом переместиться к началу фразы, а не искать её начало несколькими кликами.
  2. Каждая фраза может быть зациклена, чтобы прослушать её многократно.
  3. Разбивка таймлайна на фразы не требует от редактора какой-то особой подготовки: данные о таймингах выбираются из стандартного srt-файла с титрами.
  4. Титры на всех доступных языках выводятся под видеороликом (при желании могут быть скрыты). Эта особенность позволяет, например, показывать пользователю титры на языке оригинала видео и на родном языке пользователя. Клик по слову в титрах ставит видео на паузу и показывает пользователю перевод слова, по которому сделан щелчок.
  5. Таймер показывает не только время от начала видеоролика, но также номер фразы и общее число фраз в ролике.
  6. Скорость проигрывания ролика может быть замедлена или ускорена.
  7. Переход между фразами возможен не только кликом по таймлайну, но и при помощи хоткеев Ctrl + стрелки влево/вправо. Другие горячие клавиши: пробел — зациклить фразу/снять зацикливание, Ctrl + стрелки вверх/вниз — изменение скорости ролика.

Для демонстрации работы проекта я сделал небольшой сайт: http://lang.kece.ru/ (все видеоролики на нем позаимствованы с других ресурсов), сам проигрыватель с установленными плагинами можно увидеть, например, тут: http://lang.kece.ru/ru/series/introducing-artifical-intelligence/video/c.... В принципе, при небольшой доработке, плагины могут быть использованы не только с целью просмотра обучающих роликов, но и с целью просмотра полноценных фильмов/сериалов. Доработка понадобится потому, что если в видео фраз больше чем 20-30, то таймлайн превращается в кашу из мелких блоков с фразами и навигация при помощи кликов мышью становится почти бесполезной, но в таком случае выручает использование горячих клавиш.

Подробности в продолжении

Subscribe to RSS - mediaelementjs