Facebook Instant Games with 2DKit

September 11, 2020/0 Comments/in 2dkit, ads, awards, facebook instant game development, facebook instant games, html5 game engine, leaderboard, lightweight, tutorial /by 2DKIT

2DKit

Create Games Once. Play Anywhere.

A professional-grade game engine and tools for native-quality Messenger Games and Playable Ads that load instantly.

Start Now

Already a 2DKit user? Log In

Facebook Instant Games Tutorial Example

This 2 minute Facebook Instant Games video shows how to create and publish a Slingshot Birds game.

HTML5 Game Engine for Facebook Instant Games

Get your 2DKit games on Facebook Instant Games platform in minutes
Monetize and distribute your games to more than 1 billion users
Use 2DKit’s FBInstant SDK to easily add features like sharing, leaderboards, analytics, localization, in-app purchases and multiplayer to your games
Lightweight HTML5 game engine footprint (~50 KB!) enables games to load almost instantly

Learn More About Facebook Instant Games

Trusted by the World’s Leading Brands

2DKit powers hundreds of premium quality HTML5 games.

Award-winning HTML5 Games

Games created with 2DKit have won numerous awards.

HTML5 Game Engine Features

Blazing Fast Performance

Rich HTML5 games run at 60 FPS and load quickly even on low-end mobile devices.

Lightweight Runtime

Runtime engine file size of ~100 KB keeps initial load quick.

Premium Visual Fidelity

Advanced rendering and interactive features increase user engagement with native-like quality.

Streamlined Workflow

Customizable visual tools streamline team workflow shaving weeks off production process.

Proven and Stable

Mature mobile-first runtime has been delivering optimal performance in mobile browsers and WebViews for leading brands for several years.

Auto-Optimize Assets

Automatically shrink file sizes and load times 60-90%

Adobe Animate/Flash One-step Importing

Publish advanced Adobe Animate and Flash animations directly into your project.

Integrated Box2D Physics

High-performance Box2D physics perform well even on low-end devices.

Dynamic Lighting with Normal Maps

Easily add realistic lighting effects and a sense of depth with normal maps.

Masking

Alpha masks, vector shape masks, PNG masks, JPEG masks, Flash animation mask layers and more.

Visual Editor

Visually build scenes, levels, tilemaps, UI, and scripts.

Advanced Options for Text and Fonts

TTF, OTF, WOFF, System and Bitmap Fonts make text looks great while loading quickly whether text is static or dynamic.

Multi-Channel Audio

Dynamically load and play music and sounds via WebAudio with legacy Audio fallback.

Integrated Video

Interactive video is fully integrated into the application allowing complete control over visual effects like masking, tinting, and advanced bitmap data manipulation effects.

Advanced Particle Effects

High-performance particle systems perform well in both WebGL and Canvas.

Retina/HiDPI Graphics

Ensure that images look crisp on all devices. Optimized asset handling loads image’s optimal resolution for device.

Advanced GPU Image Filters

Built-in Photoshop-style filters dynamically apply effects like Blur, Displacement Map, and Emboss to images and animations.

Vector Graphics Drawing API

Draw your own shapes and lines to create all kinds of new applications from Pictionary-style games and drawing/coloring apps to programmatically creating your own user interface widgets.

Real-time Video Rendering Effects

Apply advanced effects during video playback like chroma key (green screen), masks, tinting, sepia, noise, and filters.

Camera System

Makes it easy to zoom, pan, and follow. You can also use the Camera to auto-follow a Sprite like the Hero or main character. The Camera has built-in support for easily setting up parallax layers and static layers (HUD).

Stunning Scene Transition Effects

Built-in effects enable easily add high-quality scene transition effects like iris, 3D cube, mosaic, wipe, swirl, fade, and ripple.

Parallax Scrolling

Easily setup parallax scrolling with 2DKit’s parallax layer properties to add a sense of depth to your game.

Meshes

Add polygons to your images to give your 2D animations a 3D feel.

Custom GLSL Shader Effects

Leverage built-in or custom shaders for powerful visual effects like realistic fire, water, clouds, 3D tunnels, voronai, metaballs, and voxels.

Spine Animation

Drag and drop to easily import Spine skeletal animations with features like IK,meshes, and paths.

UI Widgets

Easily create UI scenes and HUDs by dragging and dropping buttons, images, text, leaderboards, and custom objects.

Reusable Symbols

Prefab-like 2DKit Symbols allow individual objects or groups of objects to be reused in multiple Scenes, improving load times and maintainability.

Visual Studio Code

Automatically create 2DKit VS Code projects that leverage Visual Studio Code’s powerful code editing features like code completion, go to definition, project building, advanced debugging and more.

Responsive Fullscreen Layout

Automatically scales content to available screen dimensions in portrait or landscape while maintaining aspect ratio.

Easy to Learn

Streamlined onboarding process makes it easy to get setup and learn.

One-click installation and setup
Hundreds of pages of documentation and tutorials for programmers
Over fifty sample game projects and templates to learn from

Contact Us

Google Ads ( UAC ) Playable Ads Creation and Publishing with 2DKit

June 3, 2019/in 2dkit, google, google html5, html5 game engine, interactive ads, interactive video, playable ads, uac, video ads /by 2DKIT

Google Playable Ads Creation and
Publishing

Follow these ad creative steps for Google Ads ( UAC ) Interactive HTML5 / Playable Ad campaigns.

Overview

This guide will show you how to create and publish a playable ad for Google Ads (UAC) with 2DKit in just a couple minutes.

The total file size of this playable ad, a Shoot ‘Em Up game will be 239 KB (without gzip).

Sample Project

http://developer.2dkit.com/samples/playable-ad-shmup.zip

Google Playable Ads Video Tutorial

https://youtu.be/cZXL22EOPVg

Handling the Call to Action

Handling the call to action with an Action in 2DKit Creator.

Drag the NotifyAdClicked action from the ez package folder.

This will call ExitApi.exit()

A good place to put this call to action is in an end card game over screen.

Handling the call to action with code.

Add the following code to your game to handle the call to action.

System.notifyAdClicked();

This will call ExitApi.exit()

Publishing the Ad

To publish select the following menu option in 2DKit Creator:

Build->Playable Ads->Publish Google Playable Ad

2DKit will handle building the output in a way that is consistent with Google’s requirements.

In addition 2DKit will also automatically optimize all files in a way that typically results in a 70-90% reduction in file size.

You will receive a zip containing google-ad.zip.

Testing

To test go here and check “Select for App Campaigns”:

https://h5validator.appspot.com/adwords/asset

Upload the google-ad.zip

Click the eye icon to show the ad preview.

Play through and click the CTA to verify it shows a confirmation about exit api.

Troubleshooting

How can I prevent Google h5validator page warnings (e.g. “Missing click tag check” , external ExitAPI) after uploading my 2DKit playable ad zip file?

This means the incorrect Google h5validator page is being used for testing. There are multiple Google h5validator pages that look similar, so it is important to use the correct one.

Google’s documentation links to the correct h5validator page that should be used for app ads testing.

https://support.google.com/google-ads/answer/7584219?hl=en

Use the Adwords h5validator page here (as described in Google’s documentation) with the app install campaign option checked–

https://h5validator.appspot.com/adwords/asset

For app install ads and playable ads do not test with any other h5validator pages. For example this page should NOT be used. ~~https://h5validator.appspot.com/dcm/asset~~

Is it possible to verify that a CTA click goes to the app store (rather than a test page) before the ad campaign is live?

For many platforms it is expected that you will see a test page after clicking the CTA if the campaign is not live. If you want to verify that clicking the CTA will properly go to the app store before the campaign is live, you can do the following. Configure the App Store and Google Play links in 2DKit Creator ->Project->Project Settings->Playable Ads Tab and then publish as MRAID as described here–http://2dkit.com/info/playable-ad-setup-mraid/

How can I prevent Google from displaying an error (e.g. mime type error, etc.) when trying to upload a 2DKit zip file ?

Make sure that you are uploading the file called google-ad.zip (found after unzipping the build_xxxxxxxxxx.zip file you receive from 2DKit). If you try to upload build_xxxxxxxxxx.zip to Google instead of google-ad.zip then you will get an error.

More info

https://support.google.com/google-ads/answer/7584219?hl=en

Relevant Classes

http://developer.2dkit.com/api/ez/NotifyAdClicked.html

http://developer.2dkit.com/api/kit/System.html#notifyAdClicked

Facebook Playable Ads Creation with 2DKit Engine

October 30, 2018/0 Comments/in 2dkit, ads, awards, facebook playable ads, html5 game engine, lightweight, tutorial /by 2DKIT

2DKit

2DKit Facebook Playable Ads load instantly without sacrificing premium features or quality.

They can be created in minutes using our professional-grade HTML5 game engine and visual tools.

Free Download

Already a 2DKit user? Log In

Facebook Playable Ads Creation Video

This 2 minute Facebook Playable Ads video shows how to create and publish a premium quality Slingshot Birds playable ad (~300 KB).

Rapidly Create Facebook Playable Ads with Visual Tools

Faster initial creative development allows more time to be spent focused on creative optimization.

Create your playables in minutes with intuitive visual editor
Drag and drop interface for media professionals
Simplified wizards for designers

Customizable game templates
Visual scripting features drag and drop logical building blocks and UI widgets
Coding not required but power users and engineers have access to complete game engine SDK

Instant Loading

Proven industry leader when it comes to smallest file sizes for playable ads and instant games without sacrificing quality.

Don’t lose users while the playable is loading.

2DKit-Playables-Optimizer-Savings-Slingshot

50 KB minimal JS runtime
100 KB complete JS runtime with physics engine, animation, particle effects, audio, text rendering, and more
Optimizer tool reduces file sizes 70-90% in one click
Proprietary data URI compression into single HTML file

Auto-Publishing Speeds Iteration

Automatically building, optimizing, and deploying in one step saves valuable iteration time.

Automatically pack all files in single HTML file
Automatically compress and optimize all code and assets
Proprietary data URI compression
Upload and publish directly from authoring tool
Easily create and test variants

All Casual Gaming Genres Supported

2DKit Playable Ads allow you to go beyond simple games and support the complete spectrum of casual game types.

3D Runner (Over Shoulder)
3D Racing (Over Shoulder)
3D Flick Sports
3D Shooting
3D Hypercasual
Isometric 3D Puzzles
3D Voxels

Match 3
Simulation
Slots
Cards
Word/Trivia
Shoot ‘Em Up
Dress Up Avatar Customization

Physics Puzzler
Physics Platformer
Physics Bike Racing
Physics Sports (Pool, Basketball)
Endless Runner / Jumper
Tower Defense
Art/Creativity

Reach All Playable Ad Networks. Any Device.

Reach your audience wherever they are with 2DKit Playable Ads.

View full list of Playable Ad Networks supported by 2DKit.

Facebook, Google UAC, SnapChat, MoPub, and more
Publish as portable single HTML file
MRAID support
WebGL rendering with Canvas fallback
Portrait or Landscape orientation
Desktop and Mobile
Responsive fullscreen layout