Skip to content

Instantly share code, notes, and snippets.

@velsa
Last active August 29, 2015 14:07
Show Gist options
  • Save velsa/84dc1f103378b5e8200f to your computer and use it in GitHub Desktop.
Save velsa/84dc1f103378b5e8200f to your computer and use it in GitHub Desktop.
ТЗ логики страницы "КАНАЛЫ"

Сайт для просмотра ТВ каналов в разных временных зонах

Прототипы:

Страница КАНАЛЫ содержит следующие элементы:

  • Главное меню, в котором есть 4 пункта.
  • Второстепенное меню, которое меняется, в зависимости от выбранного пункта в Главном меню.
  • Список каналов и передач, которые на них сейчас идут

В Главном меню также отображается:

  • Текущее время у пользователя.
  • Иконка лупы, которая раскрывается в строку поиска при наведении мышки и позволяет искать по текущему экрану (функционал самого поиска пока не делаем)
  • Иконка настроек (функционал настроек пока не делаем)
  • Иконка Свернуть/Развернуть второстепенное меню

Второстепенное меню содержит:

  • Выпадающее меню с Типами каналов. Согласно выбранному типу, будет отображаться список каналов/передач ниже
  • Переключатель часового пояса. В зависимости от выбранного пояса, показываются каналы и передачи, которые идут на каналах, с учетом сдвига по времени выбранного пояса
  • Иконка сердечко. Показывает только избранное. Функционал пока не делаем, т.к. нужно его еще продумать
  • Иконки выбора режима просмотра: плиткой или сеткой.

Режим плитки:

Отображаем плитки с:

  • логотипом канала
  • картинкой передачи, которая идет сейчас
  • время начала и конца передачи и progress bar, показывающий сколько прошло от начала
  • в нижней полоске плитки: название канала и иконка Сердечко, которая добавляет этот канал в Избранное

Плитку можно перетащить в другое место экрана. Это расположение плитки запоминается для каждого пользователя.

При нажатии на плитку (на катринку передачи), открывается popup - плеер и начинает проигрывать видео канала. Полный функционал и дизайн плеера будут позже. Сейчас - это просто JW Player, который играет заданную ссылку.

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

Режим сетки:

Показываем список каналов в таблице (сетке), справа показываем передачи для каждого канала по временной сетке.

Сетку можно скроллировать влево и вправо, чтобы посмотреть передачи, которые будут дальше. При нажатии на название передачи, открываем popup с детальной информацией об этой передачей (такой же как в режиме плитки)

При нажатии на сам канал (иконка или название), открываем popup с плеером, в котором показываем сам канал в режиме live или в выбранной часовой зоне.

Также, нужно заложить в логику:

  • Пользовательскую сессию, которую он получает после логина
  • Настройки интерфейса, которые сохраняются для каждого пользователя
  • Настройки Избранного и расположения плиток на экране (если пользователь перетащил их как ему удобно)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment