Плагин VK Bridge C3 (подключение рекламы)

С помощью плагина VK Bridge C3 можно показывать игрокам различные виды рекламы от сервиса Вконтакте:

  • прелоадер (preloader) — баннер, который показывается при запуске игры;
  • реклама с вознаграждением (rewarded) — полноэкранное видео на 15-30 секунд, за которое игрок получает какую-либо награду в игре (переход на следующий уровень, немного валюты или ещё какую-нибудь плюшку);
  • межстраничный баннер (interstitial) — полноэкранный баннер, который можно закрыть через 0-5 секунд. Он включается при переходе игрока между разными экранами игры, например, между уровнями..

В данной статье мы рассмотрим только два последних варианта.

1. Подготовка переменных

Начальная настройка плагина описана в статье Плагин VK Bridge C3 (настройка).

Теперь предполагается, что у Вас уже есть более-менее готовая игра, которую Вы планируете выложить Вконтакте и получать с неё доход от рекламы.

Создадим в проекте игры 3 глобальных переменных. Как их назвать — на Ваш выбор. В моём случае они называются так:

  • client — хранит обозначение клиента, в котором запущена игра. Это может быть браузер на компьютере, браузер на смартфоне или приложение на смартфоне.
  • loadVKBridge — триггер, показывающий, подключалась ли игра к самому плагину.
  • vKBridgeConnected — триггер, для хранения события подключения к аккаунту игрока. То есть, чтобы не подключаться при каждом переходе между экранами мы будем заглядывать узнавать из этого триггера — было ли уже подключение.
  • vKBridgeCurrentAdsType — хранит тип последней запущенной рекламы. Он нужен, чтобы определить, что должно происходить после просмотра текущий рекламы. Например, переход на следующий уровень или получение монет или ещё что-то.

2. Подключение к сервису Вконтакте

Один раз запускаем подключение к Вконтакте.

Чтобы определить, что подключение будет только один раз — используем условие с триггером loadVKBridge.

Здесь же сразу указываем, какие права будет запрашивать плагин у игрока. Полный список вариантов можно найти по этой ссылке: https://vk.com/dev/vkbridge/vkwebappgetauthtoken

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

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

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

При удачном подключении — выставляем наш триггер загрузки плагина в положение «включен», чтобы он больше не срабатывал.

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

После того, как мы получим данные о клиенте, сохраняем их в заготовленную переменную client и на всякий случай указываем в консоли браузера.

Устанавливаем триггер подключения, чтобы игра больше не тыркала сервер.

3. Запуск межстраничной рекламы

Теперь у нас есть всё, чтобы запустить рекламный блок. Для начала сделаем функцию для межстраничной рекламы. Её можно будет запускать в нужный момент простым запуском функции. К сожалению, она работает только для мобильного приложения Вконтакте и не работает в браузерах.

Здесь мы использовали переменную-триггер ads, которая показывает, не отключил ли пользователь рекламу, заплатив небольшую денюшку. Если в Вашей игре такой возможности нет — можно обойтись без этой переменной.

Следующими условиями мы проверили, запущена ли игра в приложении на Android или iOS, Если да — то включаем межстраничную рекламу. В противном случае она всё равно не запустилась бы.

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

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

  • Если это была межстраничная реклама — то делаем что должны — переходим к следующему экрану.
  • В противном случае, если это была награждаемая реклама за пропуск уровня — соответственно, пропускаем уровень.

4. Запуск награждаемой рекламы

Теперь создадим функцию запуска этой самой награждаемой рекламы.

Здесь у нас также есть условие с переменной ads для определения, не отключал ли пользователь рекламу.

Затем, аналогично межстраничной рекламе проверяем, запущена ли игра в приложении или в браузере.

  • Если игра запущена в приложении — запускаем мобильную награждаемую рекламу.
  • В противном случае запускаем награждаемую рекламу для браузеров.

Обработка успешного просмотра мобильной награждаемой рекламы у нас уже была выше. Нам осталось только добавить события для веб-рекламы.

Здесь у нас также происходит пропуск уровня, если реклама просмотрена до конца.

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

Здесь можно вставить какое-то сообщение о том, что реклама недоступна. Или же пожалеть игрока и всё равно дать ему то, что он хочет 🙂

Что дальше?

Если Вы планируете добавить в игру покупки игровой валюты, отключение рекламы и прочих плюшек, то посмотрите статью о настройке покупок.

В противном случае, если монетизации рекламой достаточно, можно провести ряд завершающих мероприятий.

5. Подготовка игры к публикации

Подготовка к публикации состоит из двух моментов:

1. Финальный экспорт игры в HTML5

Открываем проект игры в Construct 3 и в настройках плагина VK Bridge убираем галочку Development.

Это позволит защитить секретный ключ приложения (App Secret Key) от попадания в консоль, где игрок мог бы им воспользоваться не по назначению.

Далее, как обычно, экспортируем игру в формат HTML5 и заливаем обновлённую версию на свой сайт или туда, куда Вы обычно закачиваете свои HTML5-игры.

Я c 2006 года пользуюсь хостингом hts.ru. Он не самый дешёвый или самый популярный, но вполне доступный, с компетентной и вежливой техподдержкой и предлагает все необходимые технологии, включая бесплатные SSL-сертификаты (чтобы Ваш сайт отображался в браузере как безопасный — https).

2. Настройка параметров игры в аккаунте Вконтакте.

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

На вкладке Информация:

  • Название — возможно, по ходу работы Вы решили уточнить название игры. Это ещё можно сделать сейчас.
  • Описание — подробное описание игры.
  • Краткое описание — для баннера в «Выборе редакции».
  • Слоган — для каталога приложений.
  • Категория — жанр игры.
  • Тип турнирной таблицы — если таковая имеется в игре.
  • Сообщество — здесь можно выбрать из списка сообществ, в которых Вы в списке руководителей.
  • Иконка 32х32 — картинка игры.
  • Страница помощи — если планируете такую завести.
  • Пользовательское соглашение — ссылка на соответствующую страницу.
  • Политика конфеденциальности — ссылка на другую соответствующую страницу.

В принципе, этого должно быть достаточно.

Переходим на вкладку Модерация и отправляем игру на модерацию, нажав на ссылку Отправить заявку на размещение в каталоге vk.com.

Когда модератор проверит игру на соответствие всем правилам, он в этой же вкладке Модерация напишет свои пожелания к ней. А Вам в личном сообщение придёт резюме его пожеланий.

После этого можно будет исправить все обнаруженные ошибки и послать игру на повторную модерацию.

Если модерация прошла успешно, можно попытаться отправить игру и в каталог Direct Games — на той же вкладке Модерация. Но перед этим имеет смысл вникнуть в требования этого каталога.