Wink CMS: контент и договоры с правообладателями
Wink — онлайн-кинотеатр и ТВ-сервис. Здесь — внутренняя CMS сервиса: в ней заводят контент и оформляют договоры с правообладателями. Вторая часть системы — админка витрины, услуг и устройств — вынесена в отдельный кейс.
Контекст
Чтобы сервис работал, за кулисами решаются три разные задачи: вести каталог (фильмы, сериалы, каналы — с персонами, жанрами, изображениями и тегами), вести юридическую часть (кто правообладатель, на каких условиях и с какой минимальной гарантией выдан контент) и управлять витриной (баннеры, коллекции, услуги, A/B-тесты, приставки).
Системы под всё это не было — её строили с нуля. Здесь — первые две задачи, третья описана в кейсе про админку.
Роль и период
UX/UI-дизайнер, РТК ИТ, 2021–2023. Проектировал интерфейсы системы с нуля: от структуры разделов до плотных форм, таблиц и правил поведения фильтров.
Задача
Сделать рабочий инструмент для людей, которые целый день сидят в данных. Карточка одного фильма — 13 групп полей, список договоров — тысячи записей, а ошибка в ставке или сроке прав стоит денег. Интерфейс должен помогать быстро найти нужное, не терять контекст в длинной карточке и не давать промахнуться в юридически значимых полях.
Решения
Каждое решение — по одной схеме: проблема, которая мешала работе редактора → что сделано в макетах → почему.
Карточка контента: 13 разделов вместо бесконечной страницы
Карточка одного фильма — 13 групп полей. В длинной странице редактор теряет контекст: непонятно, с чем он работает и где остановился.
Разделы с навигацией слева: основная информация, персоны, жанры и коллекции, изображения, ассеты, признаки, теги, лицензии и правообладатели, контент-договоры, ценовые категории, регионы, доступность на устройствах, служебная информация. Название, ID и статус остаются в шапке.
Карточка контента
Договоры с правообладателями
Договор — самая ответственная часть системы: ошибка в ставке или сроке прав стоит денег, а полей десятки.
Поля дополнительного соглашения сгруппированы по смыслу: стороны и статус; срок действия прав; финансовые условия (НДС, валюта, правило курса, способ оплаты); тип лицензии с тарифами по качеству (SD, HD, 4K); ставка роялти и минимальная гарантия; служебные данные. Состав договора — единицы контента — вынесен на отдельную вкладку «Контент».
Ключевые условия — минимальная гарантия, ставка роялти, WSP — вынесены в цветные метки в шапке, чтобы тип договора считывался раньше, чем читаются поля.
Дополнительное соглашение
Списки и сохранённые фильтры
В списке договоров тысячи записей, и один и тот же отбор приходилось бы собирать каждое утро. Правка единицы контента не должна сбрасывать выбранные строки.
Отбор на чипсах над таблицей — тип, правообладатель, тип лицензии, статус. Набор условий можно сохранить, обновить или удалить. Создание и правка единицы контента открываются в боковой панели поверх списка: редактор не уходит с экрана.
Список договоров
Редактирование единицы контента
Спецификация поведения фильтров
Пограничные состояния фильтров обычно всплывают уже на тестировании, когда исправлять дороже.
Описал их отдельной спецификацией для разработки: при первом заходе показывается дефолтный фильтр, в чипсах стоит «Все»; клик по чипсу открывает боковую панель со всеми фильтрами, а если значений больше трёх — лишние сворачиваются в чипс «Ещё»; пока нет сохранённых фильтров, об этом написано, а не оставлен пустой селект; если в сохранённом фильтре сломалось условие (например, атрибут удалили на бэке), фильтр подсвечивается красным, и выбрать его нельзя; при повторном заходе возвращаются последние применённые фильтры, а если применялся сломанный — дефолтный; удаление сохранённого фильтра подтверждается модальным окном.
Спецификация поведения фильтров
Результат
Система управления сервисом Wink спроектирована и запущена с нуля: контент и договоры с правообладателями ведутся в одном инструменте, а витрина и устройства — в связанной с ним админке.
Плотные данные — 13 разделов карточки контента и десятки полей договора — разложены так, что работа идёт по смыслу разделов, а не по бесконечной странице.
Единый набор паттернов на всю систему: шапка со статусом и действиями, навигация по разделам, боковая панель для редактирования, сохранённые фильтры, закреплённая панель действий.
Поведение фильтров и их пограничные состояния описаны спецификацией, поэтому разработке не пришлось угадывать их на ходу.
По оценке команды, за первые полгода после запуска:
- заведение карточки фильма занимает около 15 минут вместо 25 (≈ −40%);
- договоры возвращаются юристам на исправление ставки или срока прав вдвое реже;
- сохранёнными фильтрами пользуются около 70% редакторов каждый рабочий день.