ss logo

ss logo

intro msg

A year and a half ago, the ShortStack team began discussing how we could improve our App Designer. Today we’re excited to release a revamped product that is the result of 18 months of meeting, planning, designing, user testing, and lots and lots of coffee.

crew pic

puter

v2 text

We're Calling it the Campaign Builder

The App Designer is now the Campaign Builder. It has new features, a new layout, a focus on lead generation, and, most important: it's platform agnostic. That means you can publish apps and social campaigns anywhere and they don't need to be installed to Facebook first (more on this concept later) – and a whole lot more.

what's changed

HERE'S A LOOK AT WHAT'S CHANGED:

intro msg

A year and a half ago, the ShortStack team began discussing how we could improve our App Designer. Today we’re excited to release a revamped product that is the result of 18 months of meeting, planning, designing, user testing, and lots and lots of coffee.

puter

v2 text

We're Calling it the Campaign Builder

The App Designer is now the Campaign Builder. It has new features, a new layout, a focus on lead generation, and, most important: it's platform agnostic. That means you can publish apps and social campaigns anywhere and they don't need to be installed to Facebook first (more on this concept later) – and a whole lot more.

what's changed

HERE'S A LOOK AT WHAT'S CHANGED:

sleek Text

Sleek, Updated Design

We wanted the Campaign Builder to appear more like the tools designers are used to, so the Live Preview now takes up the entire screen, instead of being pushed to the right. Add Widgets and Edit Widgets, which used to be displayed as fixed columns in the old Designer, are now “Panels.” There are five Panels in total: Widgets, Layers, Theme Selector, Visibility, and Publications, and each Panel can be opened and closed with a single click. Though not technically a Panel, the CSS Editor now displays in a pop-up window as well. You can click and drag open Panels to position them wherever you’d like in your workspace.

Cosmetic upgrades give the Campaign Builder a cleaner look. Much of the text has been “hidden” in favor of tooltips. Unsure of what a button does? Mouse over it, and a dialog will pop up to explain the details.

The Campaign Builder also has new dark and light themes so that you can customize how your workspace looks:

panels

light vs dark

sleek Text

Sleek, Updated Design

panels

sleek Text

We wanted the Campaign Builder to appear more like the tools designers are used to, so the Live Preview now takes up the entire screen, instead of being pushed to the right. Add Widgets and Edit Widgets, which used to be displayed as fixed columns in the old Designer, are now “Panels.” There are five Panels in total: Widgets, Layers, Theme Selector, Visibility, and Publications, and each Panel can be opened and closed with a single click. Though not technically a Panel, the CSS Editor now displays in a pop-up window as well. You can click and drag open Panels to position them wherever you’d like in your workspace.

Cosmetic upgrades give the Campaign Builder a cleaner look. Much of the text has been “hidden” in favor of tooltips. Unsure of what a button does? Mouse over it, and a dialog will pop up to explain the details.

The Campaign Builder also has new dark and light themes so that you can customize how your workspace looks:

light vs dark

laptop

apps now campaigns

Apps Are Now Campaigns

campaigns text

Perhaps the biggest change is a change in philosophy. Many of our conversations during the redesign process centered around becoming “platform-agnostic,” or independent of any one social network. Instead of creating Facebook apps with an option to later embed in a website, users now create “Campaigns.” Each Campaign has its own URL, which means that Campaigns can be used as standalone websites, which ShortStack will host. You can still embed them into your website or install them to your Facebook Page like always, but installing to Facebook is no longer necessary.

campaigns text

Three trends we’ve been following prompted the switch from Facebook-centric apps to web-friendly Campaigns:

  1. The continued success of Pinterest, Twitter, Google Plus, etc. Our users’ customers are increasingly using additional social media platforms.

  2. A Facebook “Like” isn't as valuable as it once was. A Cliff Notes version of the old strategy would go something like this: get more Fans because the more you have, the more exposure your brand gets. However, changes to Facebook’s algorithms mean this is no longer the case.

  3. The recognition that leads and user data are more valuable than Likes and other similar engagement. The inherent flaw in social media marketing and advertising is that these interactions are, for the most part, anonymous, and provide little to no opportunity for brands to follow up. Leads provide the opportunity to stay in touch with users.

social

Rich Text

Want to learn more about action-gating vs. Like-gating? Download this eBook!

ebook

campaigns text

Email addresses, names, phone numbers, physical addresses, etc, are concrete pieces of user data that give you demographic information to craft your marketing and advertising efforts, and personal contact information to close sales. ShortStack Campaigns with Promotion Forms and Custom Forms allow you to gather those leads from all over the web.

Going forward our focus is on gathering leads which means “Fan gating” and "Like gating" have been by replaced by “action gating.” Action gating works similarly except that valuable content is hidden behind a "submit" button on a form instead of behind the Like Button. For example, say your business just released a new eBook. Using an old Facebook strategy, you may be inclined to hide the download button, revealing it only once a user has Liked the Page. An action gate requires the visitor to fill out his or her data into the form fields you’ve set up. Once they’ve filled out all the fields and clicked submit, they’re able to download the eBook, and you’ve got another lead.

apps now campaigns

Apps Are Now Campaigns

laptop

campaigns text

Perhaps the biggest change is a change in philosophy. Many of our conversations during the redesign process centered around becoming “platform-agnostic,” or independent of any one social network. Instead of creating Facebook apps with an option to later embed in a website, users now create “Campaigns.” Each Campaign has its own URL, which means that Campaigns can be used as standalone websites, which ShortStack will host. You can still embed them into your website or install them to your Facebook Page like always, but installing to Facebook is no longer necessary.

Image

campaigns text

Three trends we’ve been following prompted the switch from Facebook-centric apps to web-friendly Campaigns:

1. The continued success of Pinterest, Twitter, Google Plus, etc. Our users’ customers are increasingly using additional social media platforms.

2. A Facebook “Like” isn't as valuable as it once was. A Cliff Notes version of the old strategy would go something like this: get more Fans because the more you have, the more exposure your brand gets. However, changes to Facebook’s algorithms mean this is no longer the case.

3. The recognition that leads and user data are more valuable than Likes and other similar engagement. The inherent flaw in social media marketing and advertising is that these interactions are, for the most part, anonymous, and provide little to no opportunity for brands to follow up. Leads provide the opportunity to stay in touch with users.

Image

campaigns text

Email addresses, names, phone numbers, physical addresses, etc, are concrete pieces of user data that give you demographic information to craft your marketing and advertising efforts, and personal contact information to close sales. ShortStack Campaigns with Promotion Forms and Custom Forms allow you to gather those leads from all over the web.

Going forward our focus is on gathering leads which means “Fan gating” and "Like gating" have been by replaced by “action gating.” Action gating works similarly except that valuable content is hidden behind a "submit" button on a form instead of behind the Like Button. For example, say your business just released a new eBook. Using an old Facebook strategy, you may be inclined to hide the download button, revealing it only once a user has Liked the Page. An action gate requires the visitor to fill out his or her data into the form fields you’ve set up. Once they’ve filled out all the fields and clicked submit, they’re able to download the eBook, and you’ve got another lead.

Containers text 1

Containers Make for a Better Design Experience


In addition to becoming platform-agnostic, the other big goal was to have users to spend less time worrying about CSS and more time focused on design.

To accomplish this, we created the “Containers” series of widgets that includes the Container Widget, Two-Column Layout Widget, and Three-Column Layout Widget. Even though you’ll find these features in the Widgets Panel, they don’t add content to your Campaign like most widgets do; instead, these widgets provide quick ways to adjust settings and customize the layout.

The Container Widget lets you perform batch actions on every widget that’s inside the container. Say, for example, that your usership is divided between France and Italy, and you need to create content to serve both. Add two Containers to your Campaign, one for each group of users. Then place all the widgets intended for France in one Container, and all the widgets intended for Italy in the other. Adjust the country visibility settings for each Container accordingly, and every widget inside will have the same visibility settings.

container img

Containers text 1

Containers Make for a Better Design Experience

Image

Containers text 1

In addition to becoming platform-agnostic, the other big goal was to have users to spend less time worrying about CSS and more time focused on design.

To accomplish this, we created the “Containers” series of widgets that includes the Container Widget, Two-Column Layout Widget, and Three-Column Layout Widget. Even though you’ll find these features in the Widgets Panel, they don’t add content to your Campaign like most widgets do; instead, these widgets provide quick ways to adjust settings and customize the layout.

The Container Widget lets you perform batch actions on every widget that’s inside the container. Say, for example, that your usership is divided between France and Italy, and you need to create content to serve both. Add two Containers to your Campaign, one for each group of users. Then place all the widgets intended for France in one Container, and all the widgets intended for Italy in the other. Adjust the country visibility settings for each Container accordingly, and every widget inside will have the same visibility settings.

container img

columns widget

columns text

Creating Columns No Longer Requires CSS

columns text

Prior to the redesign, you could use the “left” and “right” CSS classes in individual widgets to create a two-column look if you had a Theme applied. Creating more than two columns required a template or your own custom CSS. That’s not the case anymore. Add a Two- or Three-Column Layout Widget to a blank Campaign, and then place widgets in the columns as desired. There’s no CSS required.

columns text

Creating Columns No Longer Requires CSS

columns widget

columns text

Prior to the redesign, you could use the “left” and “right” CSS classes in individual widgets to create a two-column look if you had a Theme applied. Creating more than two columns required a template or your own custom CSS. That’s not the case anymore. Add a Two- or Three-Column Layout Widget to a blank Campaign, and then place widgets in the columns as desired. There’s no CSS required.

drag Text

Drag and Drop Makes it Easy to Position Widgets in Columns


One of the ways to add widgets to a Container or Column Widget is the new Drag and Drop feature. Simply click and drag a widget’s icon from the Widgets Panel and place it into the Container or Column you’d like in the Live Preview.

When dragging a widget to a Container, you can position it vertically in the stack of widgets already in the Container. When dragging a widget to a Column, you can position it horizontally by placing it in any of the Columns, and vertically in the stack of widgets already in that Column.

drag drop img

drag Text

Drag and Drop Makes it Easy to Position Widgets in Columns

drag drop img

drag Text

One of the ways to add widgets to a Container or Column Widget is the new Drag and Drop feature. Simply click and drag a widget’s icon from the Widgets Panel and place it into the Container or Column you’d like in the Live Preview.

When dragging a widget to a Container, you can position it vertically in the stack of widgets already in the Container. When dragging a widget to a Column, you can position it horizontally by placing it in any of the Columns, and vertically in the stack of widgets already in that Column.

mobile Text

Mobile-First Design

The numbers show that more people access social networks from mobile devices than they do from desktops or laptops, and our analytics here at ShortStack confirm that trend. Because the majority of hits come from mobile devices, we went to great lengths to prepare both the Campaign Builder and the Campaigns themselves.

ruler

There is a new ruler across the top of the Live Preview in the Campaign Builder that, when clicked, automatically snaps to widths of common mobile devices. Its preset preview widths for iPhone, iPhone landscape, iPad, and others show you exactly how your Campaign will look when accessed on specific mobile devices, as you design it.

ShortStack has long featured built-in, mobile-specific CSS to optimize apps so that they’re easier to read and interact with on smaller mobile screens, and we’ve enhanced that capability. For example, if a Campaign’s design incorporates either of the Column Widgets, ShortStack will automatically serve the Campaign in a single-column layout to optimize the mobile visitor’s experience.

However, in order to optimize the experience for mobile visitors, we first have to identify them. Campaign URLs detect whether the visitor is on a mobile device or a desktop computer, and serve them their content accordingly. This means that it’s as important as ever to link users to your Campaign with its Campaign URL, even if your Campaign is installed to your website or Facebook Page.

iphone

mobile Text

Mobile-First Design

iphone

mobile Text

The numbers show that more people access social networks from mobile devices than they do from desktops or laptops, and our analytics here at ShortStack confirm that trend. Because the majority of hits come from mobile devices, we went to great lengths to prepare both the Campaign Builder and the Campaigns themselves.

ruler

There is a new ruler across the top of the Live Preview in the Campaign Builder that, when clicked, automatically snaps to widths of common mobile devices. Its preset preview widths for iPhone, iPhone landscape, iPad, and others show you exactly how your Campaign will look when accessed on specific mobile devices, as you design it.

ShortStack has long featured built-in, mobile-specific CSS to optimize apps so that they’re easier to read and interact with on smaller mobile screens, and we’ve enhanced that capability. For example, if a Campaign’s design incorporates either of the Column Widgets, ShortStack will automatically serve the Campaign in a single-column layout to optimize the mobile visitor’s experience.

However, in order to optimize the experience for mobile visitors, we first have to identify them. Campaign URLs detect whether the visitor is on a mobile device or a desktop computer, and serve them their content accordingly. This means that it’s as important as ever to link users to your Campaign with its Campaign URL, even if your Campaign is installed to your website or Facebook Page.

Image

Rich Text

Speedier than Ever!

A big part of making ShortStack faster was switching servers, which we did last year, so you’ve actually been enjoying some of the benefits of the redesign already. The new servers made the platform more reliable, redundant, and responsive.

At the time of the switch, we were handling many more users than when we launched ShortStack, so much so that we had outgrown our architecture. But now ShortStack is faster than it’s ever been – even when serving millions of calls per day.

Rich Text

If you’re a long-time ShortStack user, you may be worried that you won’t be able to make heads or tails of the platform you’ve become familiar with. However, while some features have been moved around and some names have changed, you’ll find that most of your normal workflow is the same. Once you become acclimated to the new platform, at worst, the Campaign Builder will save you time. At best, you’ll keep using the features you’re used to, run with the new ones, and create Campaigns that generate leads.

Rich Text

Speedier than Ever!

Image

Rich Text

A big part of making ShortStack faster was switching servers, which we did last year, so you’ve actually been enjoying some of the benefits of the redesign already. The new servers made the platform more reliable, redundant, and responsive.

At the time of the switch, we were handling many more users than when we launched ShortStack, so much so that we had outgrown our architecture. But now ShortStack is faster than it’s ever been – even when serving millions of calls per day.

If you’re a long-time ShortStack user, you may be worried that you won’t be able to make heads or tails of the platform you’ve become familiar with. However, while some features have been moved around and some names have changed, you’ll find that most of your normal workflow is the same. Once you become acclimated to the new platform, at worst, the Campaign Builder will save you time. At best, you’ll keep using the features you’re used to, run with the new ones, and create Campaigns that generate leads.

Rich Text

Ready to start getting real ROI?

Rich Text

Like what you see? We built this landing page using the new Campaign Builder!