How to Create Facebook Playable Ads Tutorial

Learn how to create and publish Facebook Playable Ad campaigns using 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.

Already have an account? Go here for the 2DKit Facebook Playable Ads Tutorial Guide

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).

Learn How to Create Facebook Playable Ads with the 2DKit Guide

Go here to learn in detail what you need to know to work with Facebook Playable Ads in 2DKit.

Facebook Playable Ads Guide

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 Any Platform. Any Device.

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

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

Playable Ad Premium Game Creation Features

2DKit’s rich feature set allows you to focus on making compelling creative rather than working around limitations.

Retina Hi-DPI graphics
Realistic physics
Complex character animation
Particle effects
Camera zoom in and out
Crisp text rendering
3D rendering
Dynamic lighting
Stunning transitions
Vector graphics

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 ~50 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