Premium Scroller Ollin Demo
Реклама в статье часто либо мелькает мимо внимания, либо резко перехватывает экран и мешает чтению. Premium Scroller-Banner от Genius Group устроен иначе: формат живёт внутри материала, но в нужный момент становится полноэкранным опытом, которым управляет сам скролл.
Пока пользователь читает текст, страница ведёт себя обычно. Когда баннер входит в зону просмотра, прокрутка «захватывается»: быстрый свайп или инерция тачпада больше не проскакивают креатив. Каждый следующий жест вниз открывает один слайд. Каждый жест вверх возвращает предыдущий. После последнего слайда следующий жест отпускает страницу дальше по контенту.
Формат рассчитан на мобильный вертикальный кадр 1080×1920 (9:16). HTML-креатив изолирован в iframe и получает только команды прогресса — поэтому механика хоста остаётся стабильной на телефонах и ноутбуках с тачпадом, а визуальная часть может быть любой.
Как устроена механика залипания
Ключевая идея Premium Scroller-Banner — один жест равен одному шагу. Хост на странице отслеживает wheel, touch и клавиатуру, группирует инерционные события тачпада в один жест и не даёт случайно перелистнуть сразу два-три слайда.
Когда центр баннера пересекает середину экрана, страница выравнивает креатив и фиксирует body. Дальше пользователь «листает» внутри формата. Это ощущается как контролируемый fullscreen без отдельного клика «открыть» и без ощущения, что сайт сломался.
Порядок слайдов в демо-креативах часто задаётся как 2 → 1 → 3: сначала базовый кадр, затем оверлей слева, затем оверлей справа. Хост при этом оперирует только индексом прогресса 0…N−1; раскладку кадров решает сам HTML.
Почему формат не проскакивает
На мобильных устройствах главная угроза — инерционный свайп. Пользователь разгоняет ленту пальцем, отпускает, и страница продолжает двигаться уже без касания. Premium Scroller перехватывает пересечение якоря ещё на стадии touchmove и удерживает захват, пока инерция не погаснет внутри зоны формата.
На ноутбуках с тачпадом другая проблема: одно физическое движение генерирует длинную серию мелких wheel-событий. Хост накапливает дельту до порога, делает ровно один шаг слайда и затем «съедает» хвост инерции, не меняя прогресс повторно. Поэтому баннер не дёргается и не вылетает из зоны раньше времени.
Выход из формата симметричен входу. Когда прогресс на крайнем слайде, следующий жест в ту же сторону снимает lock и возвращает обычный скролл статьи. Жест в обратную сторону снова включает пошаговое листание.
Что чувствует читатель
Сначала это обычная статья. Затем появляется вертикальный премиальный модуль. Страница мягко останавливается, и внимание переключается на смену кадров. Нет ощущения «меня заперли в попапе»: пользователь сам управляет ритмом жестами вниз и вверх.
После финального кадра материал продолжается. Формат не требует отдельного dismiss, чтобы идти дальше — достаточно ещё одного естественного скролла. Если нужно убрать блок раньше, крестик Premium Ads закрывает зону и сразу отпускает страницу.
Такой контакт длиннее обычного баннера и спокойнее классического interstitial. Бренд получает несколько полноценных кадров внимания внутри чтения, а площадка сохраняет ощущение редакционной среды.
Для каких задач подходит Premium Scroller-Banner
- премиальные имиджевые кампании с серией ключевых визуалов;
- запуски продукта, где важно показать 2–3 смысловых кадра подряд;
- мобильные спецпроекты 9:16 с HTML5-анимацией и эффектами;
- демо для клиентов, где нужно доказать «залипание без проскока» на телефоне и тачпаде;
- кейсы, в которых статичный баннер слишком короток, а video-scroller ещё в разработке.
Во всех этих сценариях ценность формата — не только в картинке, а в ритме. Скролл становится пультом управления креативом: предсказуемо, по одному шагу, с понятным выходом обратно в статью.
Как готовить креатив
Креатив — это ZIP с HTML (обычно index.html + assets). Размер макета 1080×1920. Внутри баннер слушает postMessage типа PREMIUM_SCROLLER_PROGRESS и переключает состояние по progress. Хост страницы не знает про конкретные картинки — он только сообщает индекс шага.
По умолчанию длина залипания равна трём экранам: два промежуточных жеста меняют слайды, третий жест отпускает страницу. Лимит можно задать в форме загрузки. Логотип и крестик Premium Ads добавляются хостом вокруг iframe по умолчанию.
Прокрутите страницу ещё раз и проверьте сами: быстрый свайп не должен проскакивать баннер, каждый жест должен открывать ровно один кадр, а после последнего — снова отдавать управление статье. Именно так Premium Scroller-Banner от Genius Group превращает мобильный скролл в управляемую премиальную историю.