Tag Archives: sticky

5 Legitimately Cool Use Cases for Website Popups You’ve Never Considered (Includes Augmented Reality)

Okay, so perhaps only one of these use cases will blow your mind, but it’s worth risking being labeled as click-bait to get this in your hands. Read on for the coolest things you can do with website popups. Ever. Including augmented reality. Yup.

Example #1: The Augmented Reality Customer Postcard

Alright, people. Prepare to have your minds blown. This example comes from one of our designers, and chief hackers, at Unbounce, Luis Francisco.

Imagine the image below is a postcard you sent to your customers.

They visit the URL printed on it, and then this happens!

Watch me blow my own mind

Try it yourself

Note: This demo uses your laptop’s camera (it won’t work without one). Follow these instructions to see how it works!

  1. Print out the postcard image (opens in new tab)
  2. Open this landing page (opens in new tab)
  3. Grant access to your camera when asked by the browser.
  4. Hold the postcard in front of your camera to see the magic! (Stand a few feet back).

Example #2: The Website Login Hijack

35% of all visitors to Unbounce.com are only there to log in to the app. You read that correctly. Thirty-five percent. You can see the details in this GA screenshot from the month of January 2018.

This is an incredibly common thing for SaaS businesses, where customers will visit the homepage to click the login link. You’ll want to create a segment in Google Analytics for this, so you can remove it from your non-customer website behavior analysis.

It’s a huge opportunity for product marketing.

If you drop a cookie on your login screen that identifies the visitor as someone trying to log in, you can then use the cookie targeting built into Unbounce to target returning account holders with a website popup containing new product release info, along with a large login link that makes their experience even easier.

Click here or the image below to see an example popup.

Example #3: Social Referral Welcome

Are you doing as much as you can to convert your visitors from social? Probably not, but that’s okay. For this idea you can add an extra level of personalization by detecting the referring site (an Unbounce popup feature) and present a welcome experience relevant to that source.

You can take it a step further and have custom URL parameters on the social link that populate the popup with relevant content.

This is made possible by the Dynamic Text Replacement feature in Unbounce.

Check out the Tweet below. When I shared the blog post on Twitter, I added a URL parameter to the end of the URL so it reads:

https://postURL/?postTitle=“Maybe Later” - A New Interaction Model for E-commerce Entrance Popups

Try clicking the link in the Tweet. It will take you to our blog, and will show you a popup that’s only triggered when the referrer is Twitter (specifically a URL that contains t.co which is the Twitter URL shortener).

This is a really powerful way of connecting two previously disparate experiences, extending the information scent from one site to another. All without writing a single line of code.

Example #4: Preferred Social Network Share Request

If someone comes to you from twitter it’s a strong signal that Twitter is a social network of choice – or at least somewhere where they look for and respond to, socially shared content. As such you can give them a customized tweet ready for that network when they’ve demonstrated some engagement with your blog.

Using the referrer URL targeting option in Unbounce you can easily detect a visit from Twitter, Facebook, LinkedIn etc. Which is what I showed you in the previous example.

You can use different triggers for this concept that are likely to be more indicative of someone who’s engaged with the post. I’d suggest the scroll trigger (either up or down), time delay, or exit.

The reason I like this approach is that most people have a preferred social network. Mine is Twitter. If you give me a specific task, such as “Would you share this on Twitter for me, please?” with a Tweet button and prepared Tweet text, I’m more likely to engage versus having 5 social share buttons at the side or bottom of the post with no instructions.

Click here or the image below to see this concept in a popup.

You’d then craft a really good Tweet, with text or links specific to this tactic so you can measure its impact.

BTW: the button in that popup is functional and will actually Tweet about this blog post. I’d really love a share from you, just so you know. Show the popup again so you can Tweet it.

Example #5: Joke of the Day

Let’s end the post with a fun one. I’m sure you’ve all seen those messages or jokes that appear on Slack as it’s loading (it’s a thing). It can be fun to have that unusable time filled with something delightful.

Well, this is kinda like that, except that it’s not appearing during a loading sequence, it’s just straight up thrown in the face of your visitors. Because we need to experiment, people!!!!!!!!!

For bonus points, only show this to folks who have the cookie set in example #2 – “The Website Login Hijack” cos they’re customers and might appreciate it.

To do this, I took a fun joke site called “Good Bad Jokes” and embedded a random joke into an iframe in a popup. Boom!

Fair warning, some of these jokes are a little NSFW.

Click here for your Joke Of The Day.


Now go back to the top and try the augmented reality example again, and then share it on your preferred social network because it’s awesome, and that’s an awesome way to do business!

Cheers my dears,
Oli

Read this article: 

5 Legitimately Cool Use Cases for Website Popups You’ve Never Considered (Includes Augmented Reality)

Changing On-Page Behavior with Sticky Navigation and Data-Driven Design

As an optimizer, there’s nothing that excites me more than using design to change on-page behavior. By “change”, I mean to positively influence visitors to achieve their (and your) goals more effectively, and sticky navigation is a great way to increase your odds of driving behavioral change.

The best way I know to design experiences that change on-page behavior is to use my Data-Driven Design (3D) framework to gather and observe available data, and use the Micro Metrics Method (3M) to guide design exploration.

This is what I’ll be showing you today by using sticky navigation on a long landing page and also on this blog post.

It’ll help you move around the content while secretly showing you the cool things you can do with Unbounce ;)


What is Data-Driven Design? (3D)

Data-Driven Design is an 8-step collaborative optimization process designed to help your marketing team work together to increase conversions, but more importantly, to develop empathy for your customers and your coworkers. It begins with The 3D Playbook, which is an interactive lookup table that helps narrow down the data types you should be looking at when trying to optimize your landing pages, websites, and more.

It looks like the screenshot below, and you can check it out at this link. The process for using it needs more explanation that I can give in this post, but I am doing a webinar at Marketing Optimization Week where I’ll cover it in depth.

One of the most important steps in the process is taking the observations we make looking at data (analytics, heatmaps, usability tests etc.), and working as a team to design solutions to each of the problems you observe. Measuring the impact that these design changes have is called the Micro Metric Method (3M).


What is the Micro Metrics Method? (3M)

When you make observations as a team (I recommend you include a designer, copywriter, and marketer), not only are the solutions better, but the collaborative nature helps with team/client/executive buy-in for the changes you’ll propose. You can see a session I ran recently below. We watched usability test videos and took notes about the observations we were making in a shared doc that is created for you as part of the 3D Playbook (when you choose a page element from the menu it will create a series of worksheets for you and your team – the instructions on the first page of the sheet explain how).

A marketing team following the Data-Driven Design process

A definition of micro metrics

A completed worksheet with observations, severity ratings, and those assigned as micro metrics

The design solution sketches the team came up with to solve the problems identified by the micro metrics


I’m actually giving my Data-Driven Design for Marketing Teams talk for Marketing Optimization Week, so you should definitely register for that and I’ll run you through the whole process. MOW is a 4-day event from Feb 20-23 and I’m on the last day.

How to Use Sticky Navigation to Change On-Page Behavior

I’ve set up a demo page that shows a long landing page with a sticky nav that I created using an Unbounce Sticky Bar with some CSS to hide the close button. The goal of sticky navigation is to increase the level of engagement with your page by presenting persistent options that explain what’s available on the page.

I really love this approach to landing page design, where it’s standard – and recommended – to not have navigation (that takes you away from the page). In particular, it’s great because it’s persistent. It scrolls with you so the opportunity for behaviorally interesting clicks doesn’t go away. What I mean by that is that there’s so much more data to collect when the navigation follows you down the page. When it’s fixed to the top of the page, you have very few opportunities beyond the very first click, to get a sense of which items trigger intent.

According to The 3D Playbook, for sticky navigation, we should first look at heatmap data and the click-through rate of each navigation link, as well as the primary call to action you have on your page.

In the Unbounce app, I used a sticky bar to create a navigation bar, assigning each link to the ID of a page element on the landing page that it would reside on.

Below is a screenshot of the sticky nav that shows up on every post of Product Awareness Month (except this one and one other where I’m demoing sticky bars). I’ll be sharing the data I collected from this, and a gazillion other data sources, in the end of month results show.

Sticky nav helps increase engagement with your content, bringing people further down the page to sections they may otherwise not see, and almost as importantly, it lets you measure what people ate interested in.

DEMO: How to Use Sticky Navigation to Increase Blog Engagement

You can click here to show a sticky nav on this blog post. I’ve set it up so that the nav links connect to different “chapters” of the post. It’s a great way to direct your readers, and also to gather valuable engagement data by looking at click heatmaps and analytics.

It’s very easy in Unbounce to duplicate a Sticky Bar and apply it to another page! Huzzah! Product awareness in action. Remember to click here to show the sticky nav.

Notice the CSS ID shown for the click target in the screenshot below (it says URL: “#register-for-mow”). This makes the nav link jump to the corresponding section of the blog post that I set up by adding an ID to a page element.

Sticky Nav in Unbounce: links to #register-for-mow

#register-for-mow as a target ID in the blog post

Do me a favour and click on the nav so I get some heat map data. It won’t be legitimate as I’m asking you to do it, but hey, shits and giggles amiright?

This post wandered a bit into a few directions, but I hope you got a sense for how I like to think about optimization, why sticky nav is awesome, and why we need more collaborative frameworks like Data-Driven Design.

Cheers
Oli


p.s. Register for Marketing Optimization Week to see 4 days of the most badass content including my Data-Driven Design framework, plus Larry Kim from Mobile Monkey, Dana DiTomaso form KickPoint, Purna Virji from Microsoft, David Gerhardt from Drift, and many more.

Taken from: 

Changing On-Page Behavior with Sticky Navigation and Data-Driven Design

4 Ways to Use Advanced Triggers and Targeting to Craft Delightful Popups

I’ve already talked at length about how to design more delightful popups by using The Delight Equation, and today I want to extend that concept by discussing the triggers and advanced targeting you can use to make popup experiences even better.

I think we’d all agree that showing a popup to your visitors on every visit is a bad idea. We can also agree that generic offers and untargeted messaging is a big turnoff.

That’s where triggers and targeting can make a big difference to the user experience.

Advanced Trigger and Targeting Matrix

Below, I’ve sketched out an interaction matrix leveraging the triggering and targeting features that Unbounce Popups & Sticky Bars can use. I’ve filled in a few ideas, and in the rest of today’s Product Awareness Month post I’ll explain how four of these concepts work, including some live demos because it’s really easy and fun to do with Unbounce.

Fair warning. Some of these ideas are a little “out there”. However, I find that being a little ridiculous helps unlock your creativity. And we all need a little more creativity in our marketing.

Use Case #1: Choose Your Own Adventure (CYOA)

Trigger: Entrance, Timed, or Scroll Up
Targeting: URL

This is a great way to learn about the intentions of your visitors.

We’ve been running experiments on our “What is a Landing Page?” page to figure out what people want to do when they arrive. interesting. On that page, I asked the question “What are your landing page needs?” providing three options (each with their own next step CTA):

I’ll be sharing complete results from this experiment at the end of the month.

CYOA Demos

Pro Tip: You can attach a parameter to a URL (?ttdemo1 for instance) which lets you use URL targeting to only show the popup in that instance. Because I want to keep you on this page, I’m just going to provide three links that reload this page, but with individual URL parameters.

  1. Entrance trigger demo
    with URL parameter targeting ?ttdemo1
  2. Scroll Up trigger demo
    with URL parameter targeting ?ttdemo2
  3. Time Delay trigger demo
    with URL parameter targeting ?ttdemo3

To set this up, I simply duplicated the first popup twice, and set the URL targeting and trigger options appropriately.

What’s even cooler is that because I used the URL targeting for any Unbounce.com URL that contains ?ttdemo1, the experience can be shown to anyone, via any link, just by appending the URL parameter. Like this link to our homepage. #mindblownmuch?

Scroll Up and Time Delay are good triggers to use to capture the attention of people who may not have found what they’re looking for. Like U2. Scroll Up is great for mobile as it’s a little bit like an exit signal on desktop.

Make sure you track these pathways in Google Analytics and stick a heat map on the page (I use Hotjar) so you can get a simple visual of where people are clicking. This is one of the original click maps for “What is a Landing Page?”.

Once you’ve learned something about your visitors’ needs you can start making changes to the page to reflect that. I’ll be digging into a concept I’m calling “No-Touch CRO” next week, which has more examples of how you can use Popups and Sticky Bars to learn about your visitors without having to change your site.

Use Case #2: You Didn’t See My Most Valuable Page (MVP)

Trigger: Exit
Targeting: Cookie

Every website has pages that we consider critical to the conversion experience. For you, it might be the features page, the pricing page, or the homepage. It could even be a blog post that’s particularly good at convincing people to sign up.

How dare someone come to your site without visiting your favorite pages! Let’s be realistic though, not everyone has the time, inclination, motivation, or easily identifiable path to get to where you want them to go.

I’m calling this use case “You didn’t see my MVP!” – as it’s designed to at least make sure they’re given an opportunity to see your magic content.

This is how it works:

  1. Drop a cookie on your most valueable page (MVP).
  2. Set up a Popup or Sticky Bar to fire on exit when the MVP cookie is NOT present.

Pretty simple right?

MVP Demo **Desktop Only**

Follow these instructions to see a demo. It’s desktop only because you can trigger an exit popup on a phone.

  1. Click here
    To reload this page adding a URL parameter ?ttdemomvp.
  2. Trigger the exit popup
    Move your mouse out of the browser as if you are going to close it.
  3. Click the button on the popup to visit the MVP page
    The cookie will be set on that page.
  4. Click the back button to return to this page
  5. Refresh this page and try to trigger the exit popup
    Now that the cookie has been set the popup won’t fire, as we’ve already seen your high-converting content.

Use Case #3: Maybe Later

Trigger: Entrance + Click
Targeting: URL + Cookie

“Maybe Later” is one of my favorite concepts to come out of this month’s exploration. You can read the full post about it here, and I’ll provide the elevator pitch below.

“Maybe Later” is a Solution to Increase Engagement and Reduce Frustration

As you can see in the sketch above, instead of the now classic YES/NO popup “Maybe Later” includes a third option called, you guessed it, “Maybe Later”.

It’s more than just a third button, here’s how it works:

  1. The popup appears when you enter the site. You can choose “No” to get rid of it, “Yes” to take advantage of it, or “Maybe Later” to register your interest but get it out of your way.
  2. When you click “Maybe Later” a cookie is set to log your interest.
  3. Now while you are browsing the rest of the site, a Sticky Bar – targeted at the cookie that was set – appears at the bottom (or top) of the page, with a more subtle reminder of the offer, so that you know it there and ready if you decide to take advantage of it.
  4. If you decide against the offer, you can click “No thanks” on the Sticky Bar, the cookie is deleted, and the offer is hidden for good.

The core purpose of this idea is to put the control back with the shopper while creating an effective method for the retailer to engage with you, with your permission.

“Maybe Later” Demo

Follow these instructions and you’ll see “Maybe Later” in action:

Please note: the demo is desktop only right now.

  1. Visit this page (opens in new window).
  2. Click the “Maybe Later” button and the popup will close.
  3. Refresh that page and you’ll see a Sticky Bar with the same offer appear at the bottom.
  4. Come back to this page.
  5. Refresh this page and you’ll see the Sticky Bar here too.
  6. Click “No thanks” to get rid of it when you’ve had enough :D

Use Case #4: Location Redirect

Trigger: Entrance
Targeting: URL + Location

It’s common for e-commerce businesses to have localized websites like amazon.com/amazon.ca/amazon.co.uk etc. But sometimes you need to redirect people to the correct country because the link they clicked is coming from an affiliate (or other) that’s only pointing to the US domain.

The simplest way to handle this scenario is to create a popup that combines an entrance trigger with URL and Geo Location targeting.

You can then target a “We have a Canadian Store, Eh! Wanna go there instead?” message on the U.S. site to visitors who’s location is in Canada.

I created two popups. One to be shown to Canadians, and one to the rest of the world using the location targeting settings.

Click here to see the popup. If you’re in Canada you’ll see a redirect popup, and if you’re anywhere else you’ll see a “Continue to the U.S. store” popup.

And here’s a video of me VPN’ing to New York to show how the popup changes.

There are so many ways you can combine triggers, targeting, and frequency to create popup experiences that treat your visitors with relevance and respect. If you have any cool combos that you’re using, please chuck ’em into the comments so we can discuss how they work.

Cheers
Oli

p.s. Don’t forget to give the 30-day trial of Unbounce a go. You get landing pages, popups, and sticky bars all included in your plan.

View the original here – 

4 Ways to Use Advanced Triggers and Targeting to Craft Delightful Popups

Product Marketing Lessons Learned: An Interview with Shopify’s Hana Abaza [Video]

Hana Abaza runs the marketing show over at Shopify Plus, the enterprise arm of e-commerce software giant Shopify. In the interview, we unpack some of the ways they’re increasing product awareness and adoption of a new product – including the genesis of the idea for Shopify Plus, and some product marketing lessons learned.

We also talk about MacGyvering, crazy startup ideas, and a ton of resources you can use for your own product marketing efforts.

Watch My Interview with Hana Abaza on Product Marketing Lessons Learned

Show Notes

Here are all the resources we talked about:

  1. 09:03 Jobs to be Done (JTBD) Framework | Framework
  2. 15:45 Product adoption tips
    Some of Hana’s presentation slides.
  3. 18:00 Partner Marketing
    How Shopify leveraged their partners to create content to influence organic search for a new product.
  4. 20:08 Marketing a product with no pricing on your website
    Is it harder or easier to market an enterprise product when you only have a demo request?
  5. 24:10 Who does product marketing well?
  6. 25:15 First Round Capital Interview with Joanna Lord
  7. 27:14 Intercom Product Marketing
  8. 30:13 MacGyvering
  9. 31:10 Who would Hana take to a deserted island?
    The Unpublished David Ogilvy.
  10. 33:50 Hana’s favourite dad joke
    What do you call cheese that isn’t yours? Nacho Cheese!

Cheers
Oli Gardner

Get back here on Monday where I’ll be showing you how to use Sticky Bars to craft really cool mobile user experiences.

See the original post: 

Product Marketing Lessons Learned: An Interview with Shopify’s Hana Abaza [Video]

Doing the Two-Step: Opt-In Forms That Is [A Psychology Principle With Conversion Data]

I’ve no idea how to actually do the two-step. Apparently it looks a little something like this:

It’s way too complex for me. Fortunately, when it comes to marketing, the two-step opt-in form is much simpler.

What is a Two-Step Opt-In Form?

Well for starters it’s a two-time hyphenated term that’s really annoying to type. Functionally though, instead of including a form on your landing page, blog, or website, you use a link, button, or graphic to launch a popup that contains your form.

Why are Two-Step Opt-In Forms Good For Conversion?

There are two reasons why this approach is good for conversion rates, both of which have an element of behavioural psychology.

  • Foot in the Door (FITD): The FITD technique is an example of compliance psychology. By design, it’s good because the form is launched after a user-driven request. They clicked the link to subscribe with the intent to do exactly that, subscribe (or whatever the form’s conversion goal is). The click demonstrates the reaction to a modest request, creating a level of commitment that makes the visitor more likely to complete the form (the larger request) when it’s presented.
  • Perceived friction: Because there is no visible form, the idea of filling out a form is not really top of mind. This reduces the amount of effort required in your visitor’s mind.

What Does a Two-Step Opt-In Form Look Like?

They look a little like this aetful sketch I did last night.

Let’s try a demo. You can subscribe to follow along with Product Awareness Month here.
Clicking that link uses the two-step concept to launch a popup containing the subscribe form.

Pretty simple, right?

You could also click on any of the images below to do the same thing.

I configured all of these with Unbounce Popups by targeting this blog post URL and using the “On Click” trigger option set to function when an element with the ID #pam-two-step-v1 is clicked.

This trigger option is awesome because you can apply it to any element on your pages. And as you’ve just seen, you can have as many different popups as you like, all attached to different page elements.


You Can Also Use a Sticky Bar for a Two-Step Opt-In Form

The functionality is exactly the same if you want to use a Sticky Bar. Click the image below to show a Sticky Bar with a form, at the top of the page.


How Do Two-Step Opt-In Forms Perform?

Great question! I’m glad you asked.

Throughout Product Awareness Month I’ve sprinkled a few two-step opt-in popup links like this one: Subscribe Now. I’m also using the exact same popup using the exit trigger, so visitors see it when they are leaving the page.

To compare the data, the exit popup obviously gets seen a lot more as it triggers once for everyone. Conversely, the “On Click” popup gets fewer views because it’s a subtle CTA that only appears in a few places.

You can see some initial conversion rates below from the Unbounce dashboard.

Not huge sample sizes just yet (I’ll report on this again at the end of the month), but the difference is staggering.

The “On Click” triggered popup conversion rate is 1169% better than the exit popup.


Convinced yet? I hope so. Now I’d like to challenge you to try your own experiments with popup triggers and the awesome two-step opt-in form.

Sign up for a 30-day trial and build some Popups today. You also get the Sticky Bar and Landing Page products included in your account.

Cheers
Oli

p.s. Come back tomorrow to see a video interview I did with the awesome Head of Marketing at Shopify Plus, Hana Abaza.

More here – 

Doing the Two-Step: Opt-In Forms That Is [A Psychology Principle With Conversion Data]

How a Two-Step Opt-In Beat an Exit Popup by 1169% [by Using a Psychology Principle]

I’ve no idea how to actually do the two-step. Apparently it looks a little something like this:

It’s way too complex for me. Fortunately, when it comes to marketing, the two-step opt-in form is much simpler.

What is a Two-Step Opt-In Form?

Well for starters it’s a two-time hyphenated term that’s really annoying to type. Functionally though, instead of including a form on your landing page, blog, or website, you use a link, button, or graphic to launch a popup that contains your form.

Why are Two-Step Opt-In Forms Good For Conversion?

There are two reasons why this approach is good for conversion rates, both of which have an element of behavioural psychology.

  • Foot in the Door (FITD): The FITD technique is an example of compliance psychology. By design, it’s good because the form is launched after a user-driven request. They clicked the link to subscribe with the intent to do exactly that, subscribe (or whatever the form’s conversion goal is). The click demonstrates the reaction to a modest request, creating a level of commitment that makes the visitor more likely to complete the form (the larger request) when it’s presented.
  • Perceived friction: Because there is no visible form, the idea of filling out a form is not really top of mind. This reduces the amount of effort required in your visitor’s mind.

What Does a Two-Step Opt-In Form Look Like?

They look a little like this aetful sketch I did last night.

Let’s try a demo. You can subscribe to follow along with Product Awareness Month here.
Clicking that link uses the two-step concept to launch a popup containing the subscribe form.

Pretty simple, right?

You could also click on any of the images below to do the same thing.

I configured all of these with Unbounce Popups by targeting this blog post URL and using the “On Click” trigger option set to function when an element with the ID #pam-two-step-v1 is clicked.

This trigger option is awesome because you can apply it to any element on your pages. And as you’ve just seen, you can have as many different popups as you like, all attached to different page elements.


You Can Also Use a Sticky Bar for a Two-Step Opt-In Form

The functionality is exactly the same if you want to use a Sticky Bar. Click the image below to show a Sticky Bar with a form, at the top of the page.


How Do Two-Step Opt-In Forms Perform?

Great question! I’m glad you asked.

Throughout Product Awareness Month I’ve sprinkled a few two-step opt-in popup links like this one: Subscribe Now. I’m also using the exact same popup using the exit trigger, so visitors see it when they are leaving the page.

To compare the data, the exit popup obviously gets seen a lot more as it triggers once for everyone. Conversely, the “On Click” popup gets fewer views because it’s a subtle CTA that only appears in a few places.

You can see some initial conversion rates below from the Unbounce dashboard.

Not huge sample sizes just yet (I’ll report on this again at the end of the month), but the difference is staggering.

The “On Click” triggered popup conversion rate is 1169% better than the exit popup.


Convinced yet? I hope so. Now I’d like to challenge you to try your own experiments with popup triggers and the awesome two-step opt-in form.

Sign up for a 30-day trial and build some Popups today. You also get the Sticky Bar and Landing Page products included in your account.

Cheers
Oli

p.s. Come back tomorrow to see a video interview I did with the awesome Head of Marketing at Shopify Plus, Hana Abaza.

Visit site:

How a Two-Step Opt-In Beat an Exit Popup by 1169% [by Using a Psychology Principle]

9 Creative Sticky Bar Examples – Plus 21 New Unbounce Templates

alt : https://unbounce.com/photos/sticky-bar-condoms.mp4https://unbounce.com/photos/sticky-bar-condoms.mp4

Sticky Bars are the less intrusive cousin of the noble Popup. They appear at the top or bottom of the page (and sometimes the sides) when a visitor arrives, leaves, scrolls down or up, stays on the page for a certain time period or clicks a link or button. They have a million useful use cases, some of which you may not have considered.

In today’s Product Awareness Month post, I’ll be sharing:

  • 9 Sticky Bar Examples From Out in the Wild: These are examples the team has found on other folks websites, and a couple of our own.
  • 21 New Unbounce Sticky Bar Templates: Check out our latest designs that you can use today.

To get things started, here’s an example that I’ll talk about later in the new templates section. Click to show a Sticky Bar with a countdown timer.

I’d love to see your Sticky Bars too, so drop me a link in the comments, please.

9 Creative Sticky Bar Examples to Inspire Your Next Campaign

Discounts and newsletter subscriptions are valid, common and effective use cases, but I want to explore different types of interaction design, or campaign concepts that can compliment what you’re already using them for.

#1 Maybe Later

If you’ve been following along with Product Awareness Month (PAM), you’ll have seen the “Maybe Later” concept. This is where an entrance popup morphs into a persistent Sticky Bar when your visitors click the middle “Maybe Later” button instead of yes or no.

You can see a live demo of how it works here. A popup will appear when you arrive. Click “Maybe Later”, then refresh the page and a Sticky Bar will appear, and can be configured to show up site-wide until you convert or say “No Thanks”.


#2 Sticky Bar to Popup

This concept is the exact opposite of “Maybe Later”, and it uses a concept known as a two-step opt-in. Instead of showing a form on the Sticky Bar, it just shows a button to express interest.

Click-Through Sticky Bar

When you click the Sticky Bar CTA it launches a popup to collect the email address. This two-stage concept can increase conversions because the first click establishes intent and a level of commitment to continue – while not showing a scary form right away. I’ll be discussing the two-step opt-in in a future post.

Lead Gen Popup


#3 Sticky Video Widget

You’ve seen these on many blogs I’m sure. It’s really cool functionality for increasing engagement in your videos. You can see a demo here. And instructions on how to implement it can be found in the Unbounce community here.


#4 E-commerce Product Reminder

This example is really cool. As you scroll down a product page on an e-commerce site, an “Add to Cart” Sticky Bar appears when you scroll past the main hero image.


#5 E-commerce Checkout Discount Nudge

This Sticky Bar sticks with you for every step in the photo creation and checkout process. Clearly, they are comfortable with the coupon being applied to the sale because it’s an incredibly competitive business niche and let’s face it when you see a coupon code field you go searching for one. So why not just offer it straight up.

For the record, trying to buy canvas prints to deliver to family in the UK is a freakin’ nightmare. I had to try 8 different sites before one of them would allow me to put a Canadian address in the billing info fields. They are losing a TON of money by not realizing that customers can be in other places.


#6 On-Click Side Slide

On-click Sticky Bars and Popups are the best kind when it comes to a permission-based interaction. You make something interesting and ask people to click on it. In this example, there is an element on the left side of the page which slides in from the side when clicked.

Unbouncer Noah Matsell created a similar thing in Unbounce (see demo here). It doesn’t actually use a Sticky Bar. Instead it’s just a box with text in it. I love how it works. Try it out, and think about all the cool stuff you could stick in a sidebar.


#7 EU Cookie Policy

European Union laws around privacy are some of the toughest in the world, and for the last few years, the EU Cookie Privacy Law required that all EU businesses, as well as international businesses serving EU customers, show a privacy statement with a clickable acknowledgment interaction. I’m not a lawyer so I don’t know all the ins and outs, but needless to say, it’s a great use case that you may not even know that your web team or legal team actually needs.

Coming up in May is the new GDPR legislation which will usurp this law, but offer its own needs and requirements, so stay tuned for more on that, and how you should be dealing with it. In fact, I did a quick poll on Twitter to see what people thought about the cookie law and got an interesting mix of responses. Don’t be in the “Haven’t dealt with it yet” camp when it comes to GDPR. That could get you dinged.

We released a new Cookie Bar template below that you can use until you deal with the new legislation.

#8 Microsite Navigation

Another example from earlier in Product Awareness Month. You can use a Sticky Bar as the connective global navigation that turns a group of landing pages into a microsite.

A really simple way to create a multi-page marketing campaign experience.

#9 Net Promoter Score (NPS)

Net Promoter Score surveys are a method of measuring how your customers feel about your product or service. Based on a scale from 0-10 and the question “How likely are you to recommend company name to a friend?”

Co-founder Carter Gilchrist made this NPS demo to show how it works:


Follow our Product Awareness Month journey >> click here to launch a popup with a subscribe form (it uses our on-click trigger feature).


21 New Unbounce Sticky Bar Templates You Can Use Today

We just released a whole bunch of new Sticky Bar and Popup templates which you can see inside the Unbounce app screenshot below. I chose a few of them to showcase below based on some of the examples I discussed above.


Sticky Bar Template #1: Countdown Timer

Countdown timers are great for creating a sense of urgency, and can have a positive influence on conversions as a result.


Click to show this Sticky Bar at the bottom | at the top.


Sticky Bar Template #2: Location Redirect

If you have multiple websites or online stores, you can use Location Targeting (Unbounce supports city, region, country, and continent) to let people know there is a local version they might want to switch to.


Sticky Bar Template #3: Product Release

Announce product releases on your website to drive people to the features page of the new product.


Sticky Bar Template #4: Cookie Privacy Law

As I mentioned earlier, this is big for companies in Europe, and also businesses who have European customers. On May 25, 2018 this law will be usurped by the new General Data Protection Regulation (GDPR).


Sticky Bar Template #5: Product Beta Access

Build an email list for an upcoming beta release.


Sticky Bar Template #6: Product Hunt Launch

Product Hunt can be a great place to launch new products. To be successful you need to get upvotes and you can use a Sticky Bar to send people there from your website.

Check Out Our Sticky Bar Live Demo

We built a cool tool that shows what Sticky Bars and Popups look like on your site. Simply enter your URL here to preview. It even grabs your brand colors and in this case, Amanda from Orbit Media makes a cameo appearance.

Cheers
Oli Gardner

p.s. You should check out The Landing Page Analyzer. Why? Because – hyperbole alert – it’s the single greatest tool in the history of the world when it comes to grading your landing pages.

Jump to original:  

9 Creative Sticky Bar Examples – Plus 21 New Unbounce Templates

How pilot pesting can dramatically improve your user research

Reading Time: 6 minutes

Today, we are talking about user research, a critical component of any design toolkit. Quality user research allows you to generate deep, meaningful user insights. It’s a key component of WiderFunnel’s Explore phase, where it provides a powerful source of ideas that can be used to generate great experiment hypothesis.

Unfortunately, user research isn’t always as easy as it sounds.

Do any of the following sound familiar:

  • During your research sessions, your participants don’t understand what they have been asked to do?
  • The phrasing of your questions has given away the answer or has caused bias in your results?
  • During your tests, it’s impossible for your participants to complete the assigned tasks in the time provided?
  • After conducting participants sessions, you spend more time analyzing the research design rather than the actual results.

If you’ve experienced any of these, don’t worry. You’re not alone.

Even the most seasoned researchers experience “oh-shoot” moments, where they realize there are flaws in their research approach.

Fortunately, there is a way to significantly reduce these moments. It’s called pilot testing.

Pilot testing is a rehearsal of your research study. It allows you to test your research approach with a small number of test participants before the main study. Although this may seem like an additional step, it may, in fact, be the time best spent on any research project.
Just like proper experiment design is a necessity, investing time to critique, test, and iteratively improve your research design, before the research execution phase, can ensure that your user research runs smoothly, and dramatically improves the outputs from your study.

And the best part? Pilot testing can be applied to all types of research approaches, from basic surveys to more complex diary studies.

Start with the process

At WiderFunnel, our research approach is unique for every project, but always follows a defined process:

  1. Developing a defined research approach (Methodology, Tools, Participant Target Profile)
  2. Pilot testing of research design
  3. Recruiting qualified research participants
  4. Execution of research
  5. Analyzing the outputs
  6. Reporting on research findings
website user research in conversion optimization
User Research Process at WiderFunnel

Each part of this process can be discussed at length, but, as I said, this post will focus on pilot testing.

Your research should always start with asking the high-level question: “What are we aiming to learn through this research?”. You can use this question to guide the development of research methodology, select research tools, and determine the participant target profile. Pilot testing allows you to quickly test and improve this approach.

WiderFunnel’s pilot testing process consists of two phases: 1) an internal research design review and 2) participant pilot testing.

During the design review, members from our research and strategy teams sit down as a group and spend time critically thinking about the research approach. This involves reviewing:

  • Our high-level goals for what we are aiming to learn
  • The tools we are going to use
  • The tasks participants will be asked to perform
  • Participant questions
  • The research participant sample size, and
  • The participant target profile

Our team often spends a lot of time discussing the questions we plan to ask participants. It can be tempting to ask participants numerous questions over a broad range of topics. This inclination is often due to a fear of missing the discovery of an insight. Or, in some cases, is the result of working with a large group of stakeholders across different departments, each trying to push their own unique agenda.

However, applying a broad, unfocused approach to participant questions can be dangerous. It can cause a research team to lose sight of its original goals and produce research data that is difficult to interpret; thus limiting the number of actionable insights generated.

To overcome this, WiderFunnel uses the following approach when creating research questions:

Phase 1: To start, the research team creates a list of potential questions. These questions are then reviewed during the design review. The goal is to create a concise set of questions that are clearly written, do not bias the participant, and compliment each other. Often this involves removing a large number of the questions from our initial list and reworking those that remain.

Phase 2: The second phase of WiderFunnel’s research pilot testing consists of participant pilot testing.

This follows a rapid and iterative approach, where we pilot our defined research approach on an initial 1 to 2 participants. Based on how these participants respond, the research approach is evaluated, improved, and then tested on 1 to 2 new participants.

Researchers repeat this process until all of the research design “bugs” have been ironed out, much like QA-ing a new experiment. There are different criteria you can use to test the research experience, but we focus on testing three main areas: clarity of instructions, participant tasks and questions, and the research timing.

  • Clarity of instructions: This involves making sure that the instructions are not misleading or confusing to the participants
  • Testing of the tasks and questions: This involves testing the actual research workflow
  • Research timing: We evaluate the timing of each task and the overall experiment

Let’s look at an example.

Recently, a client approached us to do research on a new area of their website that they were developing for a new service offering. Specifically, the client wanted to conduct an eye tracking study on a new landing page and supporting content page.

With the client, we co-created a design brief that outlined the key learning goals, target participants, the client’s project budget, and a research timeline. The main learning goals for the study included developing an understanding of customer engagement (eye tracking) on both the landing and content page and exploring customer understanding of the new service.

Using the defined learning goals and research budget, we developed a research approach for the project. Due to the client’s budget and request for eye tracking we decided to use Sticky, a remote eye tracking tool to conduct the research.

We chose Sticky because it allows you to conduct unmoderated remote eye tracking experiments, and follow them up with a survey if needed.

In addition, we were also able to use Sticky’s existing participant pool, Sticky Crowd, to define our target participants. In this case, the criteria for the target participants were determined based on past research that had been conducted by the client.

Leveraging the capabilities of Sticky, we were able to define our research methodology and develop an initial workflow for our research participants. We then created an initial list of potential survey questions to supplement the eye tracking test.

At this point, our research and strategy team conducted an internal research design review. We examined both the research task and flow, the associated timing, and finalized the survey questions.

In this case, we used open-ended questions in order to not bias the participants, and limited the total number of questions to five. Questions were reworked from the proposed lists to improve the wording, ensure that questions complimented each other, and were focused on achieving the learning goals: exploring customer understanding of the new service.

To help with question clarity, we used Grammarly to test the structure of each question.

Following the internal design review, we began participant pilot testing.

Unfortunately, piloting an eye tracking test on 1 to 2 users is not an affordable option when using the Sticky platform. To overcome this we got creative and used some free tools to test the research design.

We chose to use Keynote presentation (timed transitions) and its Keynote Live feature to remotely test the research workflow, and Google Forms to test the survey questions. GoToMeeting was used to observe participants via video chat during the participant pilot testing. Using these tools we were able to conduct a quick and affordable pilot test.

The initial pilot test was conducted with two individual participants, both of which fit the criteria for the target participants. The pilot test immediately pointed out flaws in the research design, which included confusion regarding the test instructions and issues with the timing for each task.

In this case, our initial instructions did not provide our participants with enough information on the context of what they were looking for, resulting in confusion of what they were actually supposed to do. Additionally, we made an initial assumption that 5 seconds would be enough time for each participant to view and comprehend each page. However, the supporting content page was very context rich and 5 seconds did not provide participants enough time to view all the content on the page.

With these insights, we adjusted our research design to remove the flaws, and then conducted an additional pilot with two new individual participants. All of the adjustments seemed to resolve the previous “bugs”.

In this case, pilot testing not only gave us the confidence to move forward with the main study, it actually provide its own “A-ha” moment. Through our initial pilot tests, we realized that participants expected a set function for each page. For the landing page, participants expected a page that grabbed their attention and attracted them to the service, whereas, they expect the supporting content page to provide more details on the service and educate them on how it worked. Insights from these pilot tests reshaped our strategic approach to both pages.

Nick So

The seemingly ‘failed’ result of the pilot test actually gave us a huge Aha moment on how users perceived these two pages, which not only changed the answers we wanted to get from the user research test, but also drastically shifted our strategic approach to the A/B variations themselves.

Nick So, Director of Strategy, WiderFunnel

In some instances, pilot testing can actually provide its own unique insights. It is a nice bonus when this happens, but it is important to remember to always validate these insights through additional research and testing.

Final Thoughts

Still not convinced about the value of pilot testing? Here’s one final thought.

By conducting pilot testing you not only improve the insights generated from a single project, but also the process your team uses to conduct research. The reflective and iterative nature of pilot testing will actually accelerate the development of your skills as a researcher.

Pilot testing your research, just like proper experiment design, is essential. Yes, this will require an investment of both time and effort. But trust us, that small investment will deliver significant returns on your next research project and beyond.

Do you agree that pilot testing is an essential part of all research projects?

Have you had an “oh-shoot” research moment that could have been prevented by pilot testing? Let us know in the comments!

The post How pilot pesting can dramatically improve your user research appeared first on WiderFunnel Conversion Optimization.

Credit: 

How pilot pesting can dramatically improve your user research

A Beginner’s Guide to Launching a Successful Marketing Campaign [INFOGRAPHIC]

So you’re gearing up to run your first marketing campaign, are you? You’ve got your pencils sharpened and lined up in descending order of length. You’ve got a rainbow collection of sticky notes.

But you’ve got no idea where to start. Don’t worry, we’ve got your back.

In partnership with infographic builder Venngage, we’ve put together a super actionable and digestible (dare we say tasty?) infographic that illustrates the entire marketing campaign process, all the way from ideation and planning to evaluating your campaign’s success.

Hover over keywords within the infographic to link to additional info and our handy-dandy glossary, and feel free to save it to your desktop or pin it for future campaigns. And if you’re more of the learn-by-reading type, we’ve got a little somethin’ somethin’ for you, too.

Don’t let running your first marketing campaign overwhelm you. Instead, take a deep breath and work through it one bite and a time.

Create an infographic with Venngage

Original link:  A Beginner’s Guide to Launching a Successful Marketing Campaign [INFOGRAPHIC]

A Sticky Menu Is Quicker To Navigate

Most designers would agree that navigation is one of the most critical components of a website. Despite this, it is not always easy to use or access. Traditionally, users must scroll back to the top of the website to access the navigation menu. I recently wondered whether sticky menus makes websites quicker to navigate, and I conducted a usability study to find the answer. Let’s look at the results of the study, a few implementation techniques and some related challenges.

Original post: 

A Sticky Menu Is Quicker To Navigate

Just another WordPress site