@adtech/adman3
v3.2.16
Published
AdMan ads player
Downloads
75
Readme
AdMan3
AdMan 3 - плеер для воспроизведения на web-страницах видео и html рекламы, призванный заменить уже существующие решения (AdManHTML SDK, rb_ext, nr-player). Важной характеристикой AdMan 3 является возможность настройки внешнего вида плеера и направленность на обеспечение максимального комфорта пользователя при просмотре рекламы (плавность протекания визуальных этапов работы плеера). В архитектуру плеера заложены механизмы обеспечения максимальной результативности встраивания рекламы на web-страницы. Одним из таких механизмов является начало показа видео рекламы только после попадания в зону видимости пользователя более половины рекламного блока и приостановка показа в случае потери фокуса страницы (переключение на другую вкладку в браузере или на другое приложение) или ухода более половины блока из зоны видимости. Также в целях обеспечения комфорта пользователя поддерживается три типоразмера элементов управления (small, medium и large), автоматически устанавливаемых при изменении ширины контейнера, в котором размещается рекламный контент.
Режимы работы плеера AdMan3
Плеер AdMan3 поддерживает различные режимы работы, позволяющие использовать его для показа рекламы в самых различных контекстах. Рассмотрим вкратце эти режимы:
- inpage - в этом режиме обеспечивается показ рекламы в контенте Web-страницы. При этом в качестве контейнера для размещения рекламы указывается не специально выделенный пустой HTML-контейнер (как правило это div-элемент), а блок с полезным контентом, который может содержать абзацы текста, изображения, вложенные элементы span, div и другие, в свою очередь содержание дополнительный контент и каким-либо образом стилизованные. Плеер анализирует размер целевого контейнера и его внутреннюю структуру, после чего определяет место для создания рекламного контейнера. создание рекламного контейнера и размещение (рендеринг) в нем баннера производится сразу же после загрузки плеера. При этом старт показа рекламы происходит при попадание в зону видимости более 50% площади баннера. До этого реклама стоит на паузе. Ширина рекламного контейнера будет равна ширине целевого контейнера с контентом. В конфигурации плеера можно указать желаемый процент от начала контента, с учетом которого будет размещаться реклама. По умолчанию это 50%, т.е. середина. После показа рекламы контейнер плеера плавно уменьшается, в течении 5 секунд показывается анимированная кнопка СТА, а затем рекламный контейнер окончательно удаляется с Web-страницы. Возможен показ нескольких рекламных баннеров различных форматов. При этом их ширина будет постоянной, тогда как высота будет рассчитывается в соответствии с соотношение сторон, указанных в баннере. Если после загрузки мета-данных видео обнаружиться несоответствие фактического формата размерам, полученных с рекламного сервера (в т.ч. при их отсутствии, когда по умолчанию для всех типов креативов используется формат 16:9), плеер изменит высоту рекламного контейнера в соответствии с фактическими размерами. Действует ограничение на размер рекламного контейнера в 90% от размера области видимости браузера. Дополнительно можно разрешить вынос рекламного контейнера у нижний угол, если при скроллинге страницы реклама уходит из области видимости более чем на 50%. Это позволяет обеспечить “доигрывание” рекламы. В противном случае при уходе из зоны видимости более чем на 50% реклама ставится на паузу.
- instream - в этом режиме показ рекламы осуществляется в зависимости от показа базового видео. Переход плеера в этом режим происходит, если в качестве целевого контейнера указан html-элемента с тегом video. При этом управление воспроизведением видео в этом контейнере может осуществляться любым доступным способом. Плеер AdMan3 подписывается на события timeupdate, durationchange, pause и ended, при наступлении которых производится анализ текущей ситуации и при выполнении определенных условий принимается решение о запуске рекламы одной из поддерживаемых секций - preroll, pauseroll, middleroll или postroll. При запуске рекламы воспроизведение базового видео приостанавливается и на экране отображаются визуальные компоненты плеера AdMan3. Существенным моментом является обязательное использование режима overlay, в котором размещение контейнера AdMan3 осуществляется в контейнере, являющемся родительским по отношению к указанному в конфигурации css-селектору, указывающему на контейнер базового видео (тэг video). При этом размер контейнера AdMan3 устанавливается по размеру родительского контейнера, а цвет его фона задается в соответствии с указанным в конфигурации значением либо значением, равным ближайшему родительскому элементу. Если такое не будет найдено, то используется черный цвет (#000). Если пропорции родительского и рекламного контейнеров не совпадают, то образуются горизонтальные или вертикальные поля. Реклама при это позиционируется по центру. После завершения показа соответствующей секции контейнер AdMan3 скрывается и управление передается базовому видео. Баннеры секции midroll можно разделить на несколько групп, каждая из которых будет показываться в разные моменты показа базового видео. Точки показа можно указывать как в процентах, так и в абсолютных единицах. Если точки показа не указаны, плеер автоматически распределяет баннеры на 4 точки показа через каждые 20% хроно базового видео. AdMan3 использует собственные механизмы показа рекламы, в том числе и видео-роликов, не затрагивая работу механизмов базового видео за исключением вызова стандартных методов pause и play для секции midroll, соответственно приостанавливающие и возобновляющие показ базового видео.
- preload - базовым поведением плеера является получение рекламы из слота при обращении к рекламному серверу. Однако в ряде случаев требуется показ рекламы по ее конфигурации, передаваемой плееру при инициализации. Для этого и предназначен режим preload, где описание рекламы должно быть передано в параметре visit конфигурации плеера. Такая функциональность активно используется в режиме SDK, где AdMan3 используется как часть сложного баннера для показа видео. Внешний код получает описание баннера с сервера, готовит конфигурацию инициализации AdMan3 и запускает плеер. Также режим может быть использован для любых задач, требующих показа конкретного баннера, включая тестирование.
- inline - запрос рекламы с сервера не осуществляется, реклама для показа (inline-баннер) загружается из строки base64, размещенной в переменной AdmanBanner объекта window. В частности, такой режим используется для интеграции с внешними партнерами по технологии header-bidding.
- overlay - базовым поведением плеера является вставка рекламного контейнера в имеющийся полезный контент или показ рекламы в специально выделенном контейнере (как правило определенного размера). В то же время для ряда задач требуется вывод рекламы поверх имеющегося контента. Для этого и предназначен режим overlay, где плеер создает контейнер, занимающий всю площадь целевого контейнера, полностью перекрывая имеющийся в нем контент. В частности, такой функционал используется при работе в режиме instream, где показ рекламы осуществляется поверх базового видео.
- SDK - основным вариантом использования плеера AdMan3 является автоматический показ рекламы в соответствии с переданной конфигурацией или полученной с рекламного сервера без какого-либо дополнительного управления после инициализации. Однако в ряде случаем требуется программное управление работой плеера. В таком случае используется режим SDK, позволяющий программно создавать экземпляры плеера и инициализировать их с произвольной конфигурацией вплоть до рекламных баннеров, которые следует показывать. Также внешний код может ставить показ на паузу, возобновлять его, переходить к следующему баннеру, управлять звуком, запрашивать текущее состояние. Также AdMan3 поддерживает множество колбэков, позволяющих внешнему коду реагировать на различные события плеера.
Основные характеристики и фичи продукта
- загрузка рекламы с рекламного сервера и ее запуск (в т.ч. рендеринг);
- контроль показа рекламы (отслеживание времени нахождения рекламы в области видимости браузера в разрезе конкретной доли в области видимости);
- обеспечение пользовательского интерфейса для взаимодействия с рекламой;
- обеспечение возможности программного управления показом рекламы;
- отправка статистики (в т.ч. пикселей) о показе и действиях пользователей;
- завершение показа и удаление элементов с Web-страницы.
- возможность настройки внешнего вида как с помощью предопределенных тем, так и посредством параметров конфигурации, а также с помощью CSS (в т.ч. использование произвольных иконок);
- вынос контейнера с рекламой из основного контента в нижний угол страницы при ее скролинге с уходом рекламы из области видимости более чем на 50%;
- плавное закрытие контейнера с рекламой в режиме inpage для исключения “рывков”;
- анимация кнопки CTA, в том числе с размещением на ней логотипа и побуждающего текста, а также дополнительного нахождения на экране после завершения рекламы;
- автоматическое изменение размеров элементов управления в зависимости от размера контейнера;
- управление наличием элементов управления и составом adChoice (таймер, меню, метка “Реклама” с настраиваемым текстом, иконки и т.д.);
- возможность размещения элементов управления в любом углу контейнера, управления размером отступов от границы контейнера, привязка к контейнеру плеера или креатива;
- встроенная поддержка специальных предупреждений, отображение которых требуется в соответствии с законодательством (например, для лекарственных препаратов, БАДов, медуслуг и т.д.) с возможностью вывода как стандартного, так и произвольного текста;
- возможность управления горизонтальным и вертикальным центрированием рекламы в целевом контейнере (в случае, если при несоответствии форматов образуются поля);
- автоматическое размещение рекламы в целевом контейнере максимально эффективным образом;
- автоматический ресайзинг размера рекламы при изменении размера целевого контейнера с ресайзингов специального предупреждения;
- возможность установки видео или изображения (с размытием), которое будет отображаться в случае наличия полей, либо просто цвета фона (в т.ч. прозрачный);
- автоматическое использование текущего видео в качестве фонового в случае наличия горизонтальных полей более 20% с выносом элементов управления во внешний контейнер и растягиванием специального предупреждения на всю ширину целевого контейнера;
- возможность открытия ссылки при клике в модальном окне;
- поддержка формата VAST;
- возможность повтора видео как в ручном режиме с помощью кнопки, так и в автоматическом режиме;
- передача различных параметров (в т.ч. передаваемых при инициализации) в запросе к рекламному серверу (браузерные топики, id пользователя, размер контейнера, данные о базовом видео и прочее);
- нативная поддержка формата VideoMotion, который может быть использован в режиме SDK для показа произвольных товарных позиций, передаваемых в JSON.