fbpx

“Черное зеркало: Брандашмыг”: как Netflix построил взаимодействие со зрителем

Будучи ребенком, выросшим в 90-х годах, я был большим поклонником книг серии Choose Your Own Adventure, где можно было выбирать действия и влиять на развитие событий. И как дизайнер пользовательских интерфейсов я с нетерпением ждал возможности пройти этот интерактивный фильм.

Поэтому я зашел на Netflix и взял пульт в руку. И вот, что я отметил в первую очередь:

Эффект погружения – в какой-то момент вы становитесь частью истории;

Продуманная интерактивность – даже если решение может показаться не важным, на самом деле оно дополняет и влияет на восприятие фильма;

Обратная связь – диалог с актерами, то как экран фокусируется на интерактивной части, как меняется музыка, все это создает отличную обратную связь;

Вы грациозно терпите неудачу – я ожидал увидеть тупик в виде текста, в котором предлагалось бы вернуться в начало в случае неверного решения. Но удивительно то, что последствия неправильного выбора были встроены в скрипт и показаны в фильме.

Давайте взглянем на подход, который Netflix использовал для создания первого интерактивного фильма.

Исследование пользовательской аудитории и открытия

Короткометражка о создании интерактивного фильма Брандашмыг:

Прежде чем приступить к созданию интерактивного фильма «Черное зеркало», Netflix разработали несколько интерактивных мультсериалов для детей. После чего компания начала набирать команду для создания Брандашмыг и проверки его функциональности.

Откиньтесь на спинку дивана и окунитесь в атмосферу

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

Читайте также:  15 веселых игр для дизайнеров, которые не дадут вам заскучать

Телевизор считается пассивным поведением досуга, поэтому трудно заставить пользователя «использовать» его, и Netflix нашел способ это изменить.

  • Использование цвета, звука и движения для привлечения и удержания внимания зрителей.
  • Убедитесь, что экран не перегружен. Зона фокусировки и/или четкая последовательность действий. Количество элементов на экране должно быть минимальным.
  • Большие шрифты и четкая графика.

Пользовательский интерфейс

Интерфейс для принятия решений

Принятие решения

Когда наступает момент принятия решения, окно фильма сужается, привлекая внимание к нижней части экрана. Сам фильм становится менее отвлекающим, и внимание фокусируется на персонаже, за которого нужно принять решение. Звук и музыка также помогают вам сосредоточиться на текущей ситуации и являются важным элементом в обратной связи.

Таймер прост и не отвлекает, но при этом он достаточно заметен.

Интерфейс для повтора/перемотки

Перемотка

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

Рекламный ход?

Является ли интерактивность просто уловкой? Я думаю, нет. На самом деле это позволило мне погрузиться в фильм еще больше. Это вовлекло меня и сделало частью этой истории.

Разные устройства, один опыт

Черное зеркало: Брандашмыг доступен в разных форматах и на разных устройствах, за исключением Apple TV, Chromecasts и старых смарт-телевизоров. Вне зависимости от устройства, на котором проигрывается фильм, опыт почти идентичен.

На устройстве с сенсорным экраном 

Читайте также:  Профессионалы работают в Adobe Photoshop 1.0

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

С внешним устройством ввода

Источник: Medium

Поделиться:

Про автора

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: