Лендинг онлайн-кинотеатра с каталогом сериалов, поиском, списком «Смотреть позже» и собственным видеоплеером: с субтитрами, скоростью, перемоткой и продолжением просмотра.
Показать, что я могу сделать не просто красивую страницу-визитку, а работающий стриминговый сервис: зритель заходит, выбирает сезон, нажимает «Смотреть» и видит полноценный плеер, как в настоящем онлайн-кинотеатре. Тёплая розово-коралловая палитра и тёмный фон задают киношное настроение.
Чистые HTML, CSS и JavaScript без фреймворков. Плеер написан с нуля и работает через два движка:
обычный <video> для настоящих файлов и демо-движок на canvas.
В демо ролики рисуются кодом, а подключение реального видео занимает одну строку.
На телефоне кнопки становятся во всю ширину, каталог складывается в одну колонку, а вкладки сезонов растягиваются по ширине экрана.
Плеер открывается на весь экран и подстраивается под нижнюю панель браузера, а горизонтального скролла нет.
зависимостей: чистые HTML, CSS и JavaScript
сериала и 34 выпуска в каталоге
движка плеера: свой на canvas и обычный video
горячих клавиш и жестов в плеере