Лучший друг киномана: переделываем приложение CBS под Android

в 10:11, , рубрики: android, redmadrobot, usability, ux/ui дизайн, Блог компании REDMADROBOT, дизайн мобильных приложений, интерфейсы, мобильные приложения, редизайн

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

Так как весь самый «вкусный» киноконтент производят за океаном, я отправилась на поиски приложения в американский Google Play. Но оказалось, что все не так просто. После многочасовых розысков пришлось признать, что дизайн и удобство многих приложений оставляет желать лучшего. Значит надо сделать его самой, подумала я. Почему бы не взять за основу апп CBS, американской сети телерадиовещания, которая производит много известных сериалов? Сказано — сделано.

Решаем задачи


Итак, цель — создать идеального помощника для поиска интересного TV-контента на примере приложения CBS для Android. Чтобы не превратить работу в перерисовывание красивых картинок, «на берегу» зафиксируем задачи, которые супер-приложение должно уметь решать.

Задача №1. Персонализация. Приложение должно знать вкус зрителя и учитывать его. Я, например, обожаю острые и стильные детективные истории и не перевариваю милые комедии. Еще хотелось бы создавать несколько аккаунтов, чтобы собирать интересненькое для любимой младшей сестры. В детской учетной записи она не увидит контент, до которого еще не доросла. Количество категорий канала уменьшится, и из списка пропадут, например «Ужасы» и «Боевики».

Задача №2. Помощь. Приложение должно запоминать номер серии и подсказывать время выхода в эфир любимой программы. Учитывать вкусы подписчиков и отслеживать самые популярные передачи, предлагая посмотреть их первыми.

Задача №3. Простота и красота. Само собой, приложение должно удобно и быстро находить нужное. И при этом — быть стильным, чтобы на моем Nexus все выглядело свежо и в лучших традициях Material Design.

Итак, к делу


Что не так с приложением в его нынешней версии? Визуально оно чересчур скупо и сухо представляет все многообразие передач CBS. С точки зрения соответствия гайдлайнам Google все совсем печально. Не используются ни основные паттерны платформы, ни важные принципы.
С точки зрения удобства на главном экране пользователю важно найти шоу по своему вкусу, без подсказок. В существующем приложении персонализация не предусмотрена. Более того, если вы счастливый обладатель старенького гаджета с маленькой диагональю, приготовьтесь долго скроллить в поисках понравившейся передачи.

Лучший друг киномана: переделываем приложение CBS под Android - 2
Скрин из Google Play

Start


Задача главного экрана — привлечь внимание и показать самое интересное. Для этого вынесем всю навигацию в Sidebar menu, разбив его на главные разделы и каталог передач. Все строго по делу, не отвлекаем пользователя мишурой. В соответствии с принципами Material освежаем дизайн при помощи ярких и притягательных изображений, насыщенных цветов и контраста элементов. Предлагаю выводить передачи исходя из предпочтений пользователя, основанных на сохраненных им в разделе My CBS шоу.

Лучший друг киномана: переделываем приложение CBS под Android - 3
Редизайн главного экрана и навигации

The Series of my dreams


На экране сериала приложение предложит запомнить его, расскажет про актеров, я легко найду кадры из фильма и трейлер, все награды и фото со съемок. А также — время эфира на Live TV, чтобы поскорее узнать, какой диагноз у Уилла Грема в новой серии 2-го сезона. При помощи Floating Action Button пользователь сохранит понравившийся сериал в раздел My CBS. По умолчанию выводим на экран все новые серии с возможностью выбрать любой сезон.

Лучший друг киномана: переделываем приложение CBS под Android - 4
Экран сериала

My CBS


Идеальное приложение должно давать возможность не только смотреть любимые фильмы и шоу, но и составлять собственные плейлисты. Так что этот раздел — самый интересный для зрителя. Все избранные и просмотренные фильмы и передачи будут жить здесь, их разделим на Мои шоу и Просмотренные. Логичное с точки зрения удобства решение — выводить последние вышедшие и еще не просмотренные эпизоды для каждой передачи.

Лучший друг киномана: переделываем приложение CBS под Android - 5
My CBS

Live TV


Посмотреть новую серию любимого сериала не выходя из машины — что может быть лучше, если стоишь в пробке? У многих из нас установлены приложения, помогающие скоротать время в дороге, для большого города они просто незаменимы. Поэтому раздел так важен, он должен показывать телепрограмму, напоминать об интересных шоу и давать возможность смотреть прямой эфир. Согласно принципам Material Design, я использую стандартный компонент Floating Action Button, давая возможность смотреть прямой эфир. Приложение напомнит о времени начала шоу при помощи Push-уведомлений. Для удобства программу передач покажем именно на тот час, когда пользователь войдет в приложение, с возможностью просмотра прошлого и будущего расписания.

Лучший друг киномана: переделываем приложение CBS под Android - 6
Live TV

В итоге


В Google Play приложение CBS имеет оценку 3,8. Что же не учли разработчики? Идеальное приложение экономит время и подстраивается под вкусы и желания пользователя, а для этого оно должно быть:

  • Умным. Предугадывать желания пользователя без подсказок.
  • Простым. Показывать только нужный контент, помогая удобно перемещаться по разделам.
  • Современным. Использовать все возможности и стандартные паттерны платформы. Push-уведомления для напоминания о времени выхода в эфир избранных шоу, Sidebar menu для навигации и Floating Action Button в качестве побуждения к действию на экране.

Все это я постаралась учесть в своей концепции: приложение получило усовершенствованную логику и свежий дизайн. Навигация стала проще, раздел My CBS запоминает самое интересное, поиск контента стал интуитивным. Есть вопросы или идеи? Давайте это обсудим :)

Автор: REDMADROBOT

Источник

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js