Конкурс инструкций
Промо

Создание нового интерфейса для приложения на Smart TV

Арт-директор онлайн-кинотеатра Okko Сергей Мекрюков — о редизайне приложения, наследственности и A/B-тестах.

Материал подготовлен при поддержке Okko

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

Первые шаги

Мы запустили приложение в 2011 году, тогда оно называлось Yota Play. Первое приложение для Smart TV под руководством директора по продукту Игоря Соколова помогало разрабатывать британское агенство AllofUs: циановые кнопки, SD-формат и все фильмы по 99 рублей. Основные ценности для пользователя: никакой рекламы, звёздочек (всё должно считываться с пяти метров) и контент на первом месте. Ведь красивые постеры лучше скучного текста.

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

Новая плоскость

В 2014 году мы перестали быть частью Yota, убрали приставку и стали называться Play. Интерфейс обзавелся различными функциями: HD, Full HD, предзаказы, оригинальный звук с субтитрами, Dolby 5.1, один вариант подписки — PlayFamily.

Пользователи любили наше приложение, а мы не хотели делать что-то другое. Мы просто очистили интерфейс от мусора: убрали лишние иконки, градиенты и объёмы. Приложение стало выглядеть легче.

В этот момент мы начали думать о смене названия, и один из инженеров предложил новое — Okko.

Новые возможности

В 2016 году мы начали экспериментировать с новыми продуктами и попробовали по-другому представить подписки. Создали несколько вариантов и дали пользователю возможность купить их пакетом по выгодной цене. Фактически это отдельный продукт внутри продукта, для которого мы использовали новый «скелет» вёрстки: вертикальные постеры с одним персонажем, темные цвета и круглые кнопки.

Новый раздел гармонично вписался в интерфейс продукта на Smart TV и положительно повлиял на бизнес, но появилась проблема. Мы не были готовы полгода писать клиент с новым интерфейсом. Так мы начали постепенно обновлять все разделы приложения, параллельно занимаясь UX и новыми задачами.

Новый путь

Каждый месяц мы выпускаем новый релиз приложения на Smart TV. Регулярно улучшаем юзабилити платформы и «причесываем» текущий UI. Благодаря этому растут бизнес-метрики, но любое, даже самое мелкое изменение мы тестируем с помощью сплитов. Это позволяет оперировать числами в момент принятия решений. Так мы увидели, например, что не все нововведения прижились, UI хуже масштабируется, а платформы сильно отличаются друг от друга.

Smart TV оставался последней платформой, где мы всё ещё использовали циан и элементы старого брендинга. Но быстро и качественно поменять основную для бизнеса платформу невозможно. В декабре 2017 года мы начали разрабатывать принципиально новый цифровой язык, чтобы связать все платформы и маркетинговые коммуникации.

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

Черника

Над модернизацией мы работали с британским агентством W12, в копилке которых есть кейсы с крупнейшими мировыми диджитал-компаниями: Deutsche Welle, CNN, Vevo, Shazam. Со стороны Okko в работе участвовали директор по продукту Игорь Соколов, бренд-менеджер Регина Гололобова и отдел дизайна. Спустя 4-5 недель итераций W12 предложили около десяти экранов в новом брендинге, после чего мы начали адаптацию под сервис и создание из них новых компонентов.

Дополнительно мы дорисовали ещё более 100 экранов для обновлённого UI, руководствуясь такой логикой: по максимуму используем существующие компоненты, но при необходимости добавляем новые или меняем старые. Для нас важно было оставить ощущение наследственности, так как многие люди годами приходят к нам смотреть фильмы, и было бы грустно получить от них негативную обратную связь или — ещё хуже — оказаться неузнанными в новом брендинге.

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

Новое начало

Сейчас в Okko работает A/B-тестирование нового визуального языка в приложении для замера основных бизнес-метрик. Если с ними будут проблемы, мы сможем оперативно выпустить апдейт и провести ещё один сплит. Но уже сейчас очевидно, что динамика положительная. За счет редизайна мы сможем реализовать десятки идей, улучшающих пользовательский опыт, потратив на это меньше внутренних ресурсов.

Дома, после работы, мы сами используем собственный продукт. И мы рады, что спустя столько лет видим в новой оболочке любимый сервис и ценности, которые закладывали в него. Это большая работа, за которую хочется сказать спасибо всей команде Okko.

{ "author_name": "Fedor Karnakov", "author_type": "self", "tags": ["\u043f\u0430\u0440\u0442\u043d\u0435\u0440\u0441\u043a\u0438\u0439","advertising"], "comments": 10, "likes": 12, "favorites": 4, "is_advertisement": true, "subsite_label": "promo", "id": 46663, "is_wide": true, "is_ugc": true, "date": "Fri, 28 Sep 2018 13:51:46 +0300", "is_special": false }
Конкурс технических инструкций
0
10 комментариев
Популярные
По порядку
Написать комментарий...
0

А 4k по подпискам у вас планируется?

Ответить
0

Есть отдельная подписка с 4K контентом.

Ответить
0

Всё нравится, но пока через браузерную версию нельзя смотреть фильмы и сериалы в оригинале (дома нет тв, а знаю что на нём функция реализована) то выбор падает всё-таки на нетфликс.

Ответить
0

Окко продолжает попытки списать абонентку с удалённой из профиля карты.

Ответить
0

Зачем сейчас нужен смарт ТВ? Кто им пользуется?

Ответить
0

А что уже изобрели что-то удобнее и я пользуюсь устаревшей технологией?

Ответить
0

Дак а чё там делать то в этом смарт ТВ?

Ответить
0

Ну, запустить приложение ОККО, например, и смотреть кино.

Ответить
0

37% населения России на 2018 год.

Ответить
0

А как вы проводите A/B тесты? Какие инструменты используете? Какие основные метрики оцениваете и улучшаете?

Ответить

Комментарий удален

Читать все 10 комментариев
Первые фото с Марса
Что такое пассивное инвестирование. Рассказывает персональный брокер

Как правильно вкладывать деньги на годы или даже десятилетия, и как Уоррен Баффет выиграл пари

Как быстро интегрировать CloudPayments в сервис на PHP

Привет! На связи Иван Могилат, Backend-разработчик Flowwow. Делюсь библиотекой для работы с CloudPayments и рассказываю, кому она пригодится.

 
«Авито» заблокировал мой профиль и я не могу теперь отправить оплаченный товар покупателю
Лето с HONOR: скидки до 60 000 рублей на ноутбуки и не только

HONOR объявляет о специальных летних скидках на ноутбуки и другую продукцию бренда. С 18 июня пользователи смогут приобрести устройства HONOR с выгодой до 60 000 рублей. Подробнее об условиях акции вы можете узнать на официальном сайте интернет-магазина HONOR и в официальных монобрендовых магазинах HONOR в Москве и других городах России.

Недосып разрушает мозг: как отсутствие сна увеличивает риск развития Альцгеймера и что с этим делать Статьи редакции

Материал издания «Кинжал».

Пацаны, у меня насущный вопрос: вы читаете или нет?

Короче, где-то увидела инфу, что из всего взрослого населения читает книжки более-менее регулярно только 10-15 процентов.

О русском HR

Кто эти люди? Как они туда попали? Какое у них "образование"? Зачем они вообще нужны?
Уже достаточно долгое время приходится сталкиваться с русскими ИТ-рекрутерами/HR и вот какие впечатления о них набрались:

Облачные игры стали доступны клиентам Yota
«В кармане у меня было $2, я надеялся заработать $1 млн»: история одержимого финансовыми схемами мошенника Чарльза Понци Статьи редакции

Предприимчивый итальянец, который прибыл в США в надежде разбогатеть, стал миллионером, а потом оказался в тюрьме и умер в нищете на другом конце мира.

Чарльз Понци на пике своей славы
Продолбать миллионы и не расстроиться: почему я решил писать про АНТИ-кейсы своего маркетингового агентства АМР

Если вам поднадоели истории успешного успеха – устраивайтесь поудобнее: моя статья снова посвящена продолбу денег, неудачным рекламным кампаниям АМР и пояснениям, почему я сделал неудачи обязательной частью программы своего развития.

Комментарии
null