AB Test Fomo with Optimizely

are you using Optimizely to run marketing experiments?

now you can test the impact Fomo has on your website, using your favorite A/B testing tool.

below is an example configuration for showing Fomo to just 50% of your visitors, and then measuring their conversion rate to sign up.

each detail, from your audience size % to the goal or metric you prefer, can easily be customized. we'll make a couple additional notes along the way for doing just that.

step 1 - set up an optimizely project

for our sample app, we created a Web Project.

optimizely web project setup

as long as you're using the optimizely Javascript snippet to manipulate your pages, it shouldn't matter which Project type you chose during initial website setup.

step 2 - create an experiment

optimizely experiment tab

in the optimizely dashboard, choose the Experiments tab from the navigation, and then click Create New.

create an optimizely experiment

add some notes, if you want.

optimizely experiment hypothesis

pending the volume of traffic your site receives, you may be able to test fomo on just a single page. if you get < 20,000 views /month, however, you'll probably want to test fomo on multiple pages.

in this example, we're going to test fomo on our home page only.

optimizely experiment home page only

finally, choose a metric or event you want to track, when Fomo is turned on.

optimizely metric setup

in our example, we defined a 'Clicks on Signup' metric, which is set up separately from this experiment.

if you've been using Optimizely awhile, you'll likely have several metrics here to choose from.

the most important aspect of this is to choose a metric that could realistically happen within a few screens, or clicks, of the visitor on your fomo-enabled page.

in other words, don't choose "joins newsletter" if the only available behavior on your fomo variant page is to sign up or request a demo.

optional: select an audience.

if you only want to test fomo on paid traffic, for example, you would define that audience in this step.

specifying audiences is especially helpful if you're driving custom audience traffic to a landing page, and want to know if fomo improves your PPC conversion rates vs organic traffic.

optimizely audience selection

step 3 - create a fomo variant

fomo optimizely variant setup

with your experiment selected, click Add Variation and create a "No Fomo" and a "Fomo" variant.

You can also split the traffic however you want; in the example above, we're using the default 50/50 split.

next, click 'edit' beside the variant where you want to enable Fomo.

this will redirect to your variant editor. Click Variant Code Editor at the top and select the Javascript tab.

step 4 - add fomo to optimizely

while logged into Fomo, visit your App page from the top-left dropdown by selecting your website.

next, click Embed at the bottom and then Do it Yourself.

fomo app snippet

since fomo is externally hosted from your website, we'll need to do something a little custom to make it work.

in the Variation Code Editor on your optimizely dashboard, paste the following:

 var loadScript = function(location, callback){
   var fileRef = document.createElement('script');
   fileRef.setAttribute('type','text/javascript');

   if (callback) {
     if (fileRef.readyState) {  // IE
       fileRef.onreadystatechange = function() {
         if (fileRef.readyState == 'loaded' || fileRef.readyState == 'complete') {
           fileRef.onreadystatechange = null;
           callback();
         }
       };
     } else {  // Non-IE
       fileRef.onload = function(){
         callback();
       };
     }
   }

   fileRef.setAttribute('src', location);
   document.head.appendChild(fileRef);
 };

hover over the above and click 'copy' in the top-right to make it easier). to understand what this code does, go here.

now, paste the "https://www.usefomo.com/api/v1/..." section of your Fomo snippet, in between the () of 'loadScript,' like this:

loadScript("https://www.usefomo.com/api/v1/EFKOQerKscYAcM__fLzskA/load.js");  

make sure to include the double quotes, and use YOUR fomo snippet, not the one above.

now, just select Synchronous dropdown, choose Asynchronous timing, and hit Save.

your final implementation should look like this:

fomo optimizely snippet implementation

note: if you already planted fomo on this web page, ie during your initial fomo signup, you'll need to remove it. otherwise, you will have 2 instances of fomo running, 50% of the time.

step 5 - going live

return to your Experiment page on Optimizely, and click Start Experiment.

results will begin collecting immediately after enabling the Experiment, however it may take several hours for data to appear in your Optimizely dashboard.

pending site traffic, check back in a few hours (or days) to determine how Fomo is performing.

step 6 - measuring results

below is an actual screenshot from a Fomo customer who ran an A/B test on their ecommerce site.

fomo vwo a-b test results

as you can see, they enjoyed a 31.7% conversion boost from the fomo variation, increasing purchases from 1.67% to 2.20%.

we look forward to hearing how Fomo performs on your site. please email us if you need help setting up, or want your test results featured on our blog.