Burn In Web

Современные WEB-технологии позволяют создавать не только сайты визитки и магазины. В Web разрабатываются 3D-шутеры (например, RushTeam) и RPG (например, Сross Сode), не говоря уже о многообразии игр и приложений в социальных сетях. Все это создается с использованием HTML5, языка структурирования и представления содержимого, который формирует поведение современных веб-страниц.

Возможности HTML 5

Кроме очевидных элементов управления и оформления, на HTML 5 можно реализовывать полноценные браузерные игры и Playable Ads (интерактивная или игровая реклама, приходящая на смену надоевшим рекламным баннерам). HTML 5, и в частности WebGL,

позволяет создавать решения с полноценной физикой и 3D графикой, доступные посредством любого браузера последних лет (т.е., если у вас не какое-то уникальное/древнее оборудование, то просто любого).

Игры в социальных сетях

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

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

Playable Ads

Описание Playable Ads

Название можно перевести как “играбельная реклама”, но, как правило, это понятие не переводят, а так и произносят Playable Ads. Это небольшие по объему игровые приложения, целью которых является продвижение товаров (игр) или услуг. По сути, Playable Ads является следующим шагом развития интернет рекламы и подходит как для ПК, так и для мобильных устройств. Реализованная игра должна быть достаточно интересной, чтобы оставить позитивное впечатление, и достаточно релевантной тому, что рекламируется, чтобы не разочаровать пользователя после.

Требования рекламных площадок

Требования к Playable Ads особенно сильно ограничивают размер приложения, так как они завязаны на объем рекламного трафика, оплачиваемый рекламными платформами. Причина в том, что чем меньше будет объем конкретного рекламного приложения, тем дешевле обойдутся миллионы его показов на различных рекламных площадках. А в случае с мобильными сетями, где скорость загрузки ограничена, малый размер будет важен и для пользователя. Данный формат продвигается всеми основными рекламными платформами такими как AppsFlyer, IronSource, Unity Ads, Facebook Ads и т.д. Общим для всех требований является формат HTML5. При этом часто запрещено обращение к внешним ресурсам, все скрипты должны быть внедрены в код одной страницы index.html, а размер index.html ограничен (как правило 2 мегабайтами, но чем меньше, тем лучше). Например, для Facebook проходит 2 мегабайта (https://www.facebook.com/business/help/412951382532338), а для Universal App Campaigns (UAC) в Google Ads только 1 мегабайт (https://support.google.com/google-ads/answer/9302396?hl=en-GB).

Структура

Playable Ad состоит трех частей:

Обучение (в виде отдельного ролика или прямо в интерфейсе игры).
Сама игра (секунд на 20 упрощенного геймплея).
End Card (рекламная карточка, содержащая поощрение успеха и призыв к переходу к товару-услуге-игре).

Подробнее см. руководство по Playable Ads для брендов.

Преимущества

Playable Ads обладает рядом преимуществ:

предоставляет итоговое предложение только тем пользователям, которые прошли игровое превью, следовательно они с большей вероятностью его примут;
в равной степени подходит для мобильных сетей и устройств, встроенной рекламы в различных приложениях (например, в ТВ приставках), социальных сетей и т.п.
интерактивность позволяет маркетологам анализировать действия пользователей и модифицировать рекламный креатив и/или итоговое предложение;
та же интерактивность позволяет поощрять пользователя за успешное прохождение Playable Ad, тем самым усиливая его заинтересованность;
формат выгоден рекламным платформам, они его активно продвигают и готовы платить за удачные решения.

Применение

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

Для чего еще может использоваться интерактивный подход Playable Ads:

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

Перспективы

Насколько это актуально сейчас и в будущем? Аудитория социальных сетей, существующих не один десяток лет продолжает расширяться, а TikTok уже набирает популярность за пределами Китая. Для любой из этих сетей были и будут востребованы рекламные и развлекательные приложения, ведь аудитория подтверждена и изучена, а вложение денег дает оперативную обратную связь в быстро меняющемся мире (если не пошел один креатив, можно переключиться на другой). Кроме того, веб приложения и, в частности, Playable Ads могут и будут использоваться не только для рекламы игр, но и в других областях жизни - от сферы услуг, до торговли недвижимостью. Для всего этого будут нужны решения, соответствующие требованиям рекламных сетей (тогда как, например, Unity позволяет создавать игры, но размер этих игр далеко за пределами ограничений).

На чем делать Web-игры? (WIP)

Специфика Web-разработки в том, что создаваемое приложение должно выполняться в разных браузерах. Единого стандарта для API браузера не было и нет, но язык JavaScript, поддерживаемый всеми современными браузерами, предоставляет API для доступа к файловой системе, памяти и т.п. Поэтому если сейчас поискать в Google "игровой движок для Web", можно найти такие решения как threejs, babylonjs и подобные. Общее в них то, что они сильно завязаны на JavaScript. Сам язык JavaScript, при всей свой популярности, обладает рядом недостатков, как присущих всем динамическим языкам, так и специфичных для самого JavaScript (пруфы?проблемы с браузером, с динамическим языком, с сообществом). Тем не менее это единственный способ выполнить код в браузере.

Одним из интерфейсов, к которым можно получить доступ через JavaScript, является WebGL. Он позволяет работать с OpenGL из браузера. А OpenGL уже поддерживается всеми производителями железа (драйвера его могут). Это уже стандарт. Это обертка над OpenGL 2.0. Интерфейс доступа к видеокарте из JavaScript. Разумеется такое многоуровневое обращение приводит к потерям производительности, но на хорошем оборудовании это дает хороший результат.

Также стоит отметить Unity, популярный игровой движок, где есть опция собрать web-версию созданной игры путем компиляции C# в WebAssembly. Но это именно опция универсального движка, ни о какой специализации для достижения минимального размера и максимального быстродействия речь не идет.

Если нужно сделать игру без ограничений, то любого из этих решений будет достаточно, но не для Playable Ads. Именно поэтому мы создаем движок, минимально использующий JavaScript, а максимально C++ и WebAssembly.

Наше решение

Что такое WebAssembly

File:WebAssembly.png

HTML 5 и JavaScript позволяют делать очень многое, но для того чтобы обеспечить скорость, безопасность и кросс-платформенность в небольшом объеме данных, была создана технология WebAssembly, которую поддерживают практически все современные браузеры. И не просто поддерживают - WebAssembly разрабатывается как веб-стандарт W3C WebAssembly Working Group и Community Group при активном участии основных производителей браузеров (см. https://en.wikipedia.org/wiki/WebAssembly).

Ценность этого решения в том, что байт код WebAssembly компилируется из C/C++ (а так же некоторых других языков). Грубо говоря, если для исполнения кода нужна какая-то C++ библиотека, которой нет в браузере, WebAssembly сам ее скомпилирует так, что все будет работать. И как следствие полученный результат позволяет производить сложные вычисления значительно быстрее, чем это делает JavsScript. При этом для доступа к ресурсам, таким как файловая система, память, видеокарта и т.п., все равно нужен JavaScript. Поэтому обойтись только WebAssembly нельзя, но можно извлечь из него максимум пользы.

Почему WebAssembly

WebAssembly не язык программирования, а скорее инструмент для языка. Это бинарный формат, получаемый как результат компиляции языка высокого уровня. И то, что формат WebAssembly компилируется из C++, дает большие преимущества нашей команде C++ разработчиков, реализующей действительно сложные, нестандартные решения с минимальным использованием JavaScript, чтобы создать движок, превосходящий по сочетанию размера и функциональности любые известные альтернативы.