A couple weeks ago, we published The Five W’s of Responsive Web Design—a crash course on what you need to know about this key trend—and also promised an update on what Flite is doing in this space.

Well, I’m pleased to inform you that the day has come. We’ve focused a lot of time and energy into building responsive functionality for the Flite Design Studio, as part of our larger native advertising strategy—and now we’re excited to reveal what we’ve put together.

This post is the first of a three-part series on native advertising, in which we’ll cover the new native features soon to be available in Design Studio HTML5: Responsive, Style Inheritance, and Datastream. These features can be used together or separately to suit any publication or brand’s advertising preferences, either to support fully native ad developments or just more integrated rich media.

Flite’s new responsive functionality will enable you to build cross-screen ads for mobile, tablet, and display. This ensures optimal viewing across different environments, and is great because you won’t need to build a separate ad for each device.

Best of all, it’s easy to create a responsive ad in Design Studio. Responsive ads, like all Flite ads, start with a default stage. When you add an additional stage, you’ll be given a checkbox option to build the ad responsively—it’s that easy. Here’s what it looks like:

You then set maximum width settings, or breakpoints, to establish the size of the area that the ad is being served into. We offer four presets: X-Large (for a desktop screen), Large (laptop), Medium (tablet), and Small (mobile), as well as a Custom setting. For example, if you choose X-Large for a stage, that specific stage will show up when a user encounters your ad on a desktop-sized screen.

You can build as many responsive stages as you would like, and you can duplicate stages so that you don’t have to manually recreate every stage. The end result: a multi-screen ad that is optimal for a range of environments—mobile, tablet, display, you name it.

Clichéd it may be, but we like to think of this as truly a win-win solution: the user experience is enhanced through viewing your ad optimally across different screens, and the designer experience is enhanced through a streamlined building process. Responsive is also a single tag solution, so in addition to building only one ad, you’ll also traffic only one ad.

Simple, right? We think so, and look forward to hearing your thoughts too. Stay tuned for next week’s post on Style Inheritance, where we’ll explain how we’ve made it easy for an ad to take on the style and font of its surrounding environment.

Want to see a step-by-step video tutorial on building a responsive ad? Watch here on YouTube.

To learn more about Flite Responsive Ads and get up and running, contact our Product Manager Alex Kim.


Update: We've officially rolled out responsive functionality! You're now able to create responsive, cross-screen ads for mobile, tablet, and display in Flite Design Studio HTML5.