Say hello to Custom Widgets and goodbye to time-consuming back-and-forths when scaling ambitious customer experiences. With Custom Widgets, scale your best CX ideas across teams, brands and markets. AB Tasty has the largest widget library on the market, providing brands with over 25 pre-built ways to quickly engage consumers including scratch cards, NPS surveys and countdowns. But now we’re also giving you the ability to build, customize and share your own widgets! 🤩
Optimize the workflow between marketers, designers and developers
Custom Widgets are an innovation catalyst that fosters cross-team collaboration to bring ideas to life. Developers can now create highly customizable widgets following a step-by-step process. They simply code the different parts of the widgets using HTML, CSS and JavaScript and add various configuration options👩💻. This allows designers to easily tailor the widgets and ensure they meet brand guidelines 👨🎨. Marketers can then customize them for their campaign needs 🙋♀️.The new possibilities to engage with visitors are endless: wheel of fortune, carousels, lightboxes, etc. These Custom Widgets result in an optimized workflow that saves everyone time but still delivers exciting experiences. 💪
Create and scale a library of your best CX ideas
All Custom Widgets created (by developers, agencies, or AB Tasty) will be available in the widget library shared across all affiliates and accounts of a company. The library, accessible from the dashboard, is a great source of inspiration and ideationthat will speed up time to market and facilitate deployment across brands and markets ✨. The widget library will also include our existing widgets with selected use cases from AB Tasty clients to further guide you in creating the best customer journey. And, like with any other widget, marketers can easily customize the content and combine it with AB Tasty’s targeting to create powerful personalized campaigns with no coding skills and in minutes 🏃♀️.
Not sure where to start?
In our new widget library, our users can already enjoy 2 custom widgets available on the platform, a Wheel of Fortune and a gradient CTA button, that they can duplicate and modify to dive into how they work. On that same page they can click on “Create a custom widget” and follow our step-by-step process 🧐.
Why not try them now? If you’re looking for inspiration for your first Custom Widgets, check out our 30 Black Friday Tests ebook. It features successful tests from brands like Degrenne, a French cutlery and tableware retailer whose quality products are a staple in the hospitality industry. They wanted to accelerate the purchase process and provide a consistent omnichannel experience to their consumers. Using our widgets they gave their visitors the ability to see item availability in their local store 👇.
If you want to replicate this, your developers can create a Custom Widget that leverages geolocation data to create a pop-up displaying product availability in nearby stores. Your customers will be able to reserve their items and opt for in-store pickup. Once available in the widget library, other brands or countries you work with can access it, modify it and leverage it to provide their visitors with an omnichannel experience.
Once upon a time, driving digital customer experience optimization (EXO) meant having a competitive edge. You went the extra mile, you won. Nowadays, everyone is focused on EXO to the point where it’s the minimum necessary to stay in the game.
“Experience” encompasses the entire user journey across all touchpoints that a consumer encounters when interacting with your brand. Be it website, app, tablet, mobile, bot-generated or in-store, the quality of these interactions will impact your customers’ purchasing decisions and their loyalty.
Customer experience optimization can greatly influence buyers’ purchasing decisions and loyalty (Source)
Deliver solid experiences and it will shape your brand reputation and increase your conversion rates – the key is to never stop moving. Remain stagnant, and you’ll be overtaken; but if you can figure out what your customers want, find the line between what they’re looking for and what you can offer, and then evolve your interactions on an ongoing basis, you can deliver superior experiences and business success.
Here at AB Tasty we believe that optimization is the bare minimum you should be delivering. In order to stay competitive and stay ahead, the work should never stop. Establishing a continuous feedback loop through experimentation and data gathering and analysis are what it takes to maximize customer experience and keep your competitive edge.
In this article, we’ll cover:
[toc]
Why is customer experience optimization so relevant?
At the base, no matter what the product or sales channel, any business will try to satisfy their customers. Customer centricity has been around longer than we might think, but customer experience optimization really started to take flight as technology advanced and brand touchpoints and interactions diversified.
Throw in the fact that data is more readily available, collectible and collected, and suddenly the means to understand your customers better than they understand themselves is out there for the taking.
Use the data you collect to take your customer experience to the next level (Source)
Not convinced that it really matters? Think again. PwC’s Future of CX report found that one in three consumers will walk away from a brand after just one negative experience. Furthermore, 73% of consumers nominate their experience in brand interactions as an important factor in making purchasing decisions.
Is customer experience optimization truly essential?
Think about your own experiences when shopping online. How does it feel? Which brands do you gravitate towards and which ones just don’t seem to tickle your fancy? Do they see you as an individual, a real person, or are you just another transaction to them? It only takes a moment’s pause to consider your own experiences to understand why optimizing customer experiences is not just important, but essential.
As consumers, we make decisions about where to shop, which products to buy and which ones to keep buying based on our past experience of acquiring and consuming them. What’s more: the aforementioned Future of CX report from PwC found that customers are more likely to try additional products and services from a brand they trust, and that they’re even willing to pay more, too – up to 16% more depending on the product category. It’s also less expensive to encourage repeat business (customer loyalty) than to acquire new customers, so leveraging customer experience optimization to drive long-term brand affinity and customer lifetime value will pay for itself.
The three key ingredients to supercharge your customer experience optimization
When a customer arrives on your site – whether they’re searching for products, comparing different options or just looking to learn more about your products – there are a number of steps they’ll go through to achieve their end goal. All of these add up to a path that they’ve taken through your website, and one that presents both opportunities and pitfalls when it comes to optimizing your site and meeting your customers’ needs. The more you can understand your user journey and implement improvements while removing frictions along the purchase funnel, the better your site will perform.
Gathering data about your customers’ behavior and preferences will give you the information you need to run experiments to discern the optimal setup using A/B testing. Not sure if your CTAs have the best wording? Test them! Trying to understand the best configuration for your landing page? Run an experiment! Have doubts about whether product images should be cropped or full body? We can examine that too!
Ultimately, you’re aiming to ensure that all roads lead to an increase in conversions – and driving UX optimization on an ever-changing customer pathway is necessary to keep you ahead of the game.
Continuously optimizing your user experience is essential for staying ahead of the curve (Source)
2. Improve your personalization efforts
Know your customers and tailor to their needs!
Tailoring a digital brand interaction to the unique needs of the person behind the screen builds customer loyalty and drives repeat business. In the experience economy, you’re selling your product plus the interaction with the brand and the purchase itself alongside it. The user experience when acquiring and consuming the product is just as important as the utility it performs. Accordingly, personalizing these digital exchanges with your consumers is key to long-term customer retention.
To better understand your customers on a personal level, building a solid data foundation allows you to best understand your users, identify their needs and deliver personalized experiences that will keep your shoppers returning again and again. After all, personalization is about getting to the root of what customers have shown you that they want and delivering against that.
Use the data you gather to tailor each user’s experience on your site (Source)
As with your customer journey, responding to ever-changing desires can be challenging, so knowing your customers intimately is crucial for personalization success. Get it right and the impact is high so don’t leave any stone unturned when exploring improvement opportunities.
3. Implement server-side testing and feature management
Bring in the tech teams to expand your optimization activities!
Server-side testing is where we bring in the heavy hitters. While A/B testing can be rapidly implemented by marketing teams, server-side experimentation requires the buy-in and expertise of tech teams and developers.
Collaboration between the two groups is essential to deliver seamless customer experiences where the front-end (client-side) lures in your customers and the back-end (server-side) runs smoothly to ensure an effortless shopping experience. For instance, presenting a promotional offer (front-end) will only deliver results if the payment gateway runs glitch-free and the page loading times are fast (back-end).
Lukas Vermeer, director of experimentation at Vista, champions the value of testing both sides. “A lot of the value from experimentation…comes from two things: One is not shipping the bad stuff – a huge value point for experimentation. The other amount of value [comes from] figuring out strategically, going forward, what you should invest in.”
Lukas Vermeer, a guest speaker in the “1000 Experiments Club” podcast, champions the value of testing both sides (Source)
If your business has reached a certain level of maturity and sophistication, maximizing both client- and server-side testing will ensure that your optimization approaches are working the hardest they possibly can to deliver improved business outcomes.
How can customer experience optimization apply to different sectors?
E-commerce
Delivering digital customer experience optimization through experimentation can drive transactions, increase conversion rates and optimize user experience as you test your site in an effort to offer a smoother purchasing experience that caters to your users’ every need.
B2B
Not every website is for purchasing then and there; sometimes site visits are an initial step on a longer journey. You can drive lead generation for purchases in areas like automotive, bedroom furniture or holiday rentals by optimizing site layout, CTAs, and access to product and store information.
Travel
Offering a range of solutions, from individual products (like hotel or transport bookings) right up to comprehensive packages that take care of every step of a holiday, is a particularity of the travel industry. When bundling items together into packages, finding that pricing sweet spot is especially key. Server-side testing is particularly relevant in this field and can give you the tools to both curate your product offering and increase bookings as well.
Conclusion
When it comes to digital customer experience optimization, improving continuously is essential to your strategy; here at AB Tasty, we can’t stress that enough!
With both technology and customer attitudes evolving every second, the only way to keep the pace is by continuously adapting your company’s own optimization practices to respond to customer demands and unlock increased value and continuing loyalty.
Living and breathing such an approach means setting up your marketing, product and technical teams for smooth cross-collaboration and a shared mission and objectives. Ensuring that they’re also sharing the same experimentation and development roadmap to unlock resources and roll out improvements at the right time will keep your business on the road to success.
We teamed up with our friends at Creative CX to take a look at the impact of experimentation on Core Web Vitals. Read our guest blog from Creative CX’s CTO Nelson Sousa giving you insights into how CLS can affect your Google ranking, the pros and cons of experiments server and client side, as well as organisational and technical considerations to improve your site experience through testing, personalisation and experimentation.
What are Core Web Vitals?
Core Web Vitals (CWV) are a set of three primary metrics that affect your Google search ranking. According to StarCounter, the behemoth search engine accounts for 92% of the global market share. This change has the potential to reshape the way we look at optimising our websites. As more and more competing businesses seek to outdo one another for the top spots in search results.
One notable difference with CWV is that changes are focused on the user experience. Google wants to ensure that users receive relevant content and are directed to optimised applications. The change aims to minimise items jumping around the screen or moving from their initial position. The ability to quickly and successfully interact with an interface and ensure that the largest painted element appears on the screen in a reasonable amount of time.
What is CLS?
Let’s imagine the following scenario:
You are navigated to a website. Click on an element. It immediately moves away from its position on the page. This is a common frustration. It means you click elsewhere on a page, or on a link, which navigates you somewhere else again! Forcing you to go back and attempt to click your desired element again.
You have experienced what is known as Cumulative Layout Shift, or for short, CLS; a metric used to determine visual stability during the entire lifespan of a webpage. It is measured by score, and according to Core Web Vitals, webpages should not exceed a CLS score of 0.1
CLS within Experimentation
When working with client-side experimentation, a large percentage of A/B testing focuses on making experimentation changes on the client side (in the browser). This is a common pattern, which normally involves placing a HTML tag in your website, so that the browser can make a request to the experimentation tool’s server. Such experimentation tools have become increasingly important as Tech teams are no longer the sole entities making changes to a website.
For many, this is a great breakthrough.
It means marketing and other less technical teams access friendly user interfaces to manipulate websites without the need of a developer.It also frees up time for programmers to concentrate on other more technical aspects.
One drawback for client-side, is certain elements can be displayed to the user before the experimentation tool has had a chance to perform its changes. Once the tool finally executes and completes its changes, it may insert new elements in the same position where other elements already exist. Pushing those other elements further down the page. This downward push is an example of CLS in action.
Bear in mind that this only affects experiments above the fold. Elements initially visible on the page without the need of scrolling.
So when should you check for CLS and its impact upon the application? The answer is up for debate. Some companies begin to consider it during the design phase, while others during the User Acceptance Testing phase. No matter what your approach is, however, it should always be considered before publishing an experiment live to your customer base.
Common CLS culprits
According to Google’s article on optimising CLS, the most common causes of CLS are:
Actions waiting for a network response before updating DOM
Overall CLS Considerations
Team awareness and communication
Each variation change creates a unique CLS score. This score is a primary point in your prioritisation mechanism. It shapes the way you approach an idea. It also helps to determine whether or not a specific experiment will be carried out.
Including analysis from performance testing tools during your ideation and design phases can help you understand how your experiment will affect your CLS score. At Creative CX, we encourage weekly communication with our clients, and discuss CLS impact on a per-experiment basis.
Should we run experiments despite possible CLS impact?
Although in an ideal world you would look to keep the CLS score to 0, this isn’t always the case. Some experiment ideas may go over the threshold, but that doesn’t mean you cannot run the experiment.
If you have data-backed reasons to expect the experiment to generate an uplift in revenue or other metrics, the CLS impact can be ignored for the lifetime of the experiment. Don’t let the CLS score to deter you from generating ideas and making them come to life.
Constant monitoring of your web pages
Even after an experiment is live, it is vital to use performance testing tools and continuously monitor your pages to see if your experiments or changes cause unprecedented harmful effects. These tools will help you analyse your CLS impact and other key metrics such as First Contentful Paint and Time to Interactivity
Be aware of everyone’s role and impact
For the impact of experimentation on Web Core Vitals, you should be aware of two main things:
What is the impact of your provider?
What is the impact of modifications you make through this platform?
Experimentation platforms mainly impact two Web Vitals: Total Blocking Time and Speed Index. The way you use your platform, on the other hand, could potentially impact CLS and LCP (Largest Contentful Paint).
Vendors should do their best to minimize their technical footprint on TBT and Speed Index. There are best practices you should follow to keep your CLS and LCP values, without the vendor being held liable.
Here, we’ll cover both aspects:
Be aware of what’s downloaded when adding a tag to your site (TBT and Speed Index)
When you insert any snippet from an experimentation vendor onto your pages, you are basically making a network request to download a JavaScript file that will then execute a set of modifications on your page. This file is, by its nature, a moving piece: based on your usage – due to the number and nature of your experimentations, its size evolves.
The bigger the file, the more impact it can have on loading time. So, it’s important to always keep an eye on it. Especially as more stakeholders in your company will embrace experimentation and will want to run tests.
To limit the impact of experimenting on metrics such as Total Blocking Time and Speed Index, you should download strictly the minimum to run your experiment. Providers like AB Tasty make this possible using a modular approach.
Dynamic Imports
Using dynamic imports, the user only downloads what is necessary. For instance, if a user is visiting the website from a desktop, the file won’t include modules required for tests that affect mobile. If you have a campaign that targets only logged in users to your site, modifications won’t be included in the JavaScript file downloaded by anonymous users.
Every import also uses a caching policy based on its purpose. For instance, consent management or analytics modules can be cached for a long time. While campaign modules (the ones that hold your modifications) have a much shorter lifespan because you want updates you’re making to be reflected as soon as possible. Some modules can also be loaded asynchronously which has no impact on performance. For example, analytics modules used for tracking purposes.
To make it easy to monitor the impact on performance, AB Tasty also includes a tool, named “Performance Center”. The benefit of this is that you get a real time preview of your file size. It also provides on-going recommendations based on your account and campaign setup:
to stop campaigns that have been running for too long and that add unnecessarily weight to the file,
to update features on running campaigns, that have benefited from performance updates since their introduction (ex: widgets).
How are you loading your experimentation tool?
A common way to load an A/B testing platform is by inserting a script tag directly into your codebase, usually in the head tag of the HTML. This would normally require the help of a developer; therefore, some teams choose the route of using a tag manager as it is accessible by non-technical staff members.
This is certainly against best practice. Tag managers cannot guarantee when a specific tag will fire. Considering the tool will be making changes to your website, it is ideal for it to execute as soon as possible.
Normally it’s placed as high up the head tag of the HTML as possible. Right after any meta tags (as these provide metadata to the entire document), and before external libraries that deal with asynchronous tasks (e.g. tracking vendors such as ad networks). Even if some vendors provide asynchronous snippets to not block rendering, it’s better to load synchronously to avoid flickering issues, also called FOOC (Flash of Original Content).
Best Practice for flickering issues
Other best practice to solve this flickering issue include:
Make sure your solution uses vanilla JavaScript to render modifications. Some solutions still rely on the jQuery library for DOM manipulation, adding one additional network request. If you are already using jQuery on your site, make sure that your provider relies on your version rather than downloading a second version.
Optimize your code. For a solution to modify an element on your site, it must first select it. You could simplify this targeting process by adding unique ids or classes to the element. This avoids unnecessary processing to spot the right DOM element to update. For instance, rather than having to resolve “body > header > div > ul > li:first-child > a > span”, a quicker way would be to just resolve “span.first-link-in-header”.
Optimize the code auto generated by your provider.When playing around with any WYSIWYG editors, you may add several unnecessary JavaScript instructions. Quickly analyse the generated code and optimize it by rearranging it or removing needless parts.
Rely as much as possible on stylesheets. Adding a stylesheet class to apply a specific treatment is generally faster than adding the same treatment using a set of JavaScript instructions.
Ensure that your solution provides a cache mechanism for the script and relies on as many points of presence as possible (CDN)so the script can be loaded as quickly as possible, wherever your user is located.
Be aware of how you insert the script from your vendor. As performance optimization is getting more advanced, it’s easy to mess around with concepts such as async or defer, if you don’t fully understand them and their consequences.
Be wary of imported fonts
Unless you are using a Web Safe font, which many businesses can’t due to their branding, the browser needs to fetch a copy of the font so that it can be applied to the text on the website. This new font may be larger or smaller than the original font, causing a reflow of the elements. Using the CSS font-display property, alongside preloading your primary webfonts, can increase the change of a font meeting the first paint, and help specify how a font is displayed, potentially eliminating a layout shift.
Think carefully about the variation changes
When adding new HTML to the page, consider if you can replace an existing element with an element of similar size, thus minimising the layout shifts. Likewise, if you are inserting a brand-new element, do preliminary testing, to ensure that the shift is not exceeding the CLS threshold.
Technical CLS considerations
Always use size attributes for the width and height of your images, videos and other embedded items, such as advertisements, and iframes. We suggest using CSS aspect ratio properties for images specifically. Unlike older responsive practices, it will determine the size of the image before it is downloaded by the browser. The more common aspect ratios out there in the present day are 4:3 and 16:9. In other words, for every 4 units across, the screen is 3 units deep, and every 16 units across, the screen is 9 units deep, respectively.
Knowing one dimension makes it possible to calculate the other. If you have an element with 1000px width, your height would be 750px. This calculation is made as follows:
height = 1000 x (3 / 4)
When rendering elements to the browser, the initial layout often determines the width of a HTML element. With the aspect ratio provided, the corresponding height can be calculated and reserved. Handy tools such as Calculate Aspect Ratio can be used to do the heavy lifting math for you.
Use CSS transform property
The CSS transform property is a CSS trigger which will not trigger any geometry changes or painting. This will allow changing the element’s size without triggering any layout shifts. Animations and transitions, when done correctly with the user’s experience in mind, are a great way to guide the user from one state to another.
Move experiment to the server-side
Experimenting with many changes at once is considered against best practice. The weight of the tags used can affect the speed of the site. It may be worth moving these changes to the server-side, so that they are brought in upon initial page load. We have seen a shift in many sectors, where security in optimal, such as banking, to experiment server-side to avoid the use of tags altogether. This way, once a testing tool completes the changes, layout shift is minimised.
Working hand in hand with developers is the key to running server-side tests such as this. It requires good synchronisation between all stockholders, from marketing to product to engineering teams. Some level of experience is necessary. Moving to server-side experiments just for the sake of performance must be properly evaluated.
Server-side testing shouldn’t be confused with Tag Management server-side implementation. Some websites that implement a client-side experimentation platform through tag managers (which is a bad idea, as described previously), may be under the impressions that they can move their experimentation tag on the server-side as well and get some of tag management server-side benefits, namely reducing the number of networks request to 3rd party vendors. If this is applicable for some tracking vendors (Goggle Analytics, Facebook conversions API…), this won’t work with experiment tags that need to apply updates on DOM elements.
Summary
The above solutions are there to give you an overview of real life scenarios. Prioritise the work to be done in your tech stack. This is the key factor in improving the site experience in general. This could include moving requests to the server, using a front-end or server-side library that better meets your needs. All the way to rethinking your CDN provider and where that are available versus where most of your users are located.
One way to start is by using a free web tool such as Lighthouse and get reports about your website. This would give you the insight to begin testing elements and features that are directly or indirectly causing low scores.
For example, if you have a large banner image that is the cause of your Largest Contentful Paint appearing long after your page begins loading, you could experiment with different background images and test different designs against one another to understand which one loads the most efficiently. Repeat this process for all the CWV metrics, and if you’re feeling brave, dive into other metrics available in the Lighthouse tools.
While much thought has gone into the exact CWV levels to strive for, it does not mean Google will take you out of their search ranking as they will still prioritise overall information and relevant content over page experience. Not all companies will be able to hit these metrics, but it certainly sets standards to aim for.
Written by Nelson Sousa, Chief Technology Officer, Creative CX
Nelson is an expert in the field of experimentation and website development with over 15 years’ experience, specialising in UX driven web design, development, and optimisation.
At AB Tasty, we love to help you improve your customers’ experiences – and we are here to do the same for you on the AB Tasty platform! We’re constantly gathering feedback from our users, and next month, you’ll see us roll out our new navigation based on that feedback.
We’re doing this for a few reasons:
We want to give you the best – and that means further improving the quality of your experience on the platform. 💖
We want you to be able to find exactly what you need, when you need it – which means improving the organization of information, classifying your favorite (and new!) features in an easy-to-navigate way. 🕵️
We want you to have the most intuitive experience possible – by providing you with better guidance from the first time you log in and get you from A to B as quick as can be. 🗺
What does that mean for you?
We’ll guide you through the updates in the coming weeks, but here’s a sneak peek of what to expect:
Better visibility with a new sidebar navigation, allowing you to easily access any area of the platform with a single click – and collapse it for more workspace.
We’ve gotten rid of the hamburger menu in favor of giving you more control over where you want to go within the platform – whether it be Tests, Personalization, Audience, Analysis, or ROI – plus a login button to take you directly to Flagship, our feature management solution. 🧭
Improved access to Settings, reorganized to match our customers’ most-used options.
We’ve designed a sleeker look, consolidating settings menu for a cleaner appearance and easier navigation. 💅
New header to accompany you through every step of the workflow, from campaign creation to reporting, giving you a better bird’s eye view of a campaign’s status.
Your step-by-step buttons will remain exactly where they are, but the header will shift to make everything more easily visible to you – including an editable campaign name, status, and reporting, right alongside the tag and account info. 👀
We hope these exciting changes make a big impact on how you use AB Tasty! 💥
We know you might have questions as you go through the new navigation, and we are here to help! We also know you might have feedback – about the new design and beyond – and we invite you, as always, to share it with us on our Canny board, accessible via this link.
You may not be aware of this, but it’s likely that you’ve come across the serial position effect on more than one occasion.
A concept coined by renowned psychologist, Hermann Ebbinghaus, the serial position effect refers to how the location of an item in a sequence influences a person’s memory or recall.
The concept dictates that people usually remember items at the beginning or the end of a list or sequence with greater accuracy than those in the middle.
User experience (UX) designers leverage the serial position effect to improve their designs and create a richer, more seamless experience for consumers. This approach to digital design is present in the websites, apps or landing pages of iconic brands such as Apple, Nike or Electronic Arts (EA).
Here we’re going to explore the serial position effect in more detail, explore some notable design examples, and consider how you can use this powerful principle to improve your brand’s UX offerings.
What is the serial position effect?
When it comes to UX optimization, the order of things matter. As humans, we do indeed tend to remember the items near the start or end of a list — much like our brains respond well to storytelling.
Hermann Ebbinghaus coined the phrase based on in-depth studies on the short as well as long term memory and its impact on how we remember or perceive information. These studies were further developed by psychologists B.Murdock in 1962 and Glanzer & Cunitz in 1966.
These extensive studies resulted in the two vital serial position effect concepts: the primacy effect and the recency effect.
Primacy effect
The primacy effect is based on the discovery that an individual is likely to recall items, assets or information from the start of a list.
For instance, when someone attempts to remember something from a long list of words, they are likely to recall the terms words listed at the beginning, rather the middle.
As such, the primacy effect helps a user to remember the information they absorb first better than the information they see later on in their journey (further down a landing page, for example).
Recency effect
Essentially, the recency effect is a concept contrary to the primary effect. Rather than recalling information absorbed earlier on, the recency effect is based on the notion of people remembering the information they see last with more clarity. This model is dependent on short-term memory.
A mix of studies suggests that the recency effect is prevalent in thecourtroom. In many cases, jurors are more likely to recall, and agree with, the argument or conclusion they hear last.
In a UX design context, for instance, a potential customer will recall the last two items they saw on a personalized product recommendation carousel and purchase one of these products as a result.
The primacy and recency effect combined make up key elements of the serial position effect, which brings us onto our next point.
Applying the serial position effect to design
Now that you understand the fundamental concepts of the serial position effect, we’re going to consider how you can apply it to design — or more specifically, to user design interfaces.
Both the primacy and recency effect can have a significant impact on the design of user interfaces. Extensive lists of information put a strain on the human memory, often hindering perception and recall; and, by utilizing both ends of the serial position effect spectrum (primacy and recency), you can enhance your designs significantly.
By understanding that items or assets in the middle of a sequence are usually absorbed the least, it’s possible to leverage the serial position effect to minimize the loss of information. In doing so, it’s possible to create interface designs that are richer, more valuable, and easier to navigate.
Considering that 38% of consumers will bounce off a web page if its layout is poor or unattractive, getting your design right will prove critical to your long term success.
Applying the serial position effect to your interface design process is at its core, down to ensuring that users can navigate the items or information on your page intuitively.
If your design is digestible, fluid, and seamless, users will recall vital information with more clarity while taking desired actions like signing up to a newsletter or buying a specific product.
Here are four essential principles of applying the serial position effect to interface design:
1. Provide practical, task-relevant information
Adding and maintaining task-relevant information to your interface will not only make your design more engaging, but it will reduce the strain on users’ focus or recall.
Publishing platform Medium, for instance, has designed its user interface to simplify its interactions from a reader’s as well as a writer’s perspective.
With a host of visual tools tailored to the users’ preferred topics or interests, you gain a visual snapshot of information that offers access to relevant content and to your reading list, and allows you to create a new piece of content with swift, seamless actions.
2. Add recognizable cues
Adding dynamic cues to your user interface design minimizes cognitive strain while facilitating informational recall.
Audible notifications (e.g. pings when you receive a message) or textual cues (e.g. small informational pop-up boxes) create a real sense of recognition. Video games like ‘Need For Speed’ or ‘Broken Sword’ are excellent examples of cue-based design for user interfaces.
EA Games’ once popular ‘Plants vs Zombies’ game, for instance, utilizes a multitude of recognizable visual and audio cues to help players navigate their way through the game and remain ‘in the moment’ without pushing them to their cognitive limits.
Foley-style sounds unique to each move the player makes (planting sounds, digging sounds etc.), text-based captions that tell the player what to expect next, and visual icons at the top of the screen all work cohesively to make the user experience feel as natural as possible. You can apply similar cues to e-commerce sites to enrich your designs and make them more intuitive.
3. Reduce the level of recall required
The human attention span has its limits and, typically, can only retain five pieces of information at any one time.
If you prioritize limiting the necessity for recall, you will guide users through their journey in a way that helps them remember relevant information as and when required.
Technology colossus Apple utilizes a visual grid system with informational titles and scannable dropdown boxes to help its customers comprare models with ease and pick a product that suits their specific needs. At any one point in the interface journey, users are only presented with the information they need — details including essential specs, main comparisons, and price.
This simple yet effective design prioritizes the most valuable information, minimizing the need for recall in the process.
4. Emphasize essential information at the start and end
Playing directly into the hands of the primacy and recency effect, highlighting or placing the most essential information at the start and the end (or the top and bottom) of your interface, placing the less important items in the center.
World-renowned e-commerce leader Amazon, for example, displays digestible personalized prompts, commands, and information at the top of its homepage.
In the center of the page, you gain access to trending products and deals. At the bottom of the page, or interface, you’re presented with personalized suggestions based on your shopping history or browsing behavior:
This design technique maximizes the potential for users to recall the information that offers the most value or is likely to prompt further engagement. An effective approach that enriches the user experience while increasing the chances of regular consumer conversions.
“Design used to be the seasoning you’d sprinkle on for taste; now it’s the flour you need at the start of the recipe.”
— John Maeda, design & UX expert
Serial position effect for landing page UX
From the user interface design methods we’ve explored, it’s clear that the order, as well as the way you present information, have a significant impact on how people interact with your brand or business.
In today’s hyper-connected digital age, your UX offerings count more than ever. 88% of users are unlikely to return to a website or landing page after a poor user experience.
To enhance your landing page UX and create an experience that will increase engagement while encouraging customer loyalty, you should consider implementing the serial position effect.
To reiterate the impact the serial position effect can have on landing page UX, here’s a visualization of the serial position curve.
From a digital marketing perspective, the serial position curve clearly demonstrates that people recall information towards the start and end of an informational sequence, with items or messaging in the middle of a landing page absorbed least. It’s a steady consistent curve that can offer a practical framework for your landing pages’ UX designs.
Russian e-commerce brand, Marc Cony, uses the serial effect methodology to increase new user engagement through its primary landing page.
Marc Cony homepage highlighting discount information(Source)
Here, you can see that the landing page design is clean and minimal to simplify user navigation while highlighting its most engagement-driving messaging as soon as you visit.
As you navigate your way down the landing page, there is a clear hierarchy of information. Scroll down and you’re presented with the opportunity to personalize your shopping experience, before viewing content surrounding the brand’s blog and social media pages.
Finally, there is a clean, concise call to action (CTA) button that prompts you to sign up to the brand’s newsletter and ‘convert.’ This is an excellent example of how using serial effect principles can create a seamless user experience while guiding consumers towards a desired action — in this case, viewing sale items or becoming an email subscriber.
Online retail innovator, Thread, offers an interactive and visually-rich approach to reduce consumer recall and optimize its landing page for increased brand engagement.
Thread’s clean, grid-based design is easy to scan and it’s above the fold messaging prompts the user to take action without having to second-guess themselves.
Thread homepage visually-rich approach
This interactive approach offers personal value while offering an incentive to interact. Clicking on preferred styles requires minimal recall and, as such, keeps the information at the top of the page fresh in the mind of the consumer.
Thread website, subheadings navigation
Once you’ve selected your preferred styles, you’re directed to a new landing page. Clear subheadings help you navigate your way through the page with minimal cognitive strain, and once you reach the bottom, the ‘Next’ CTA tells you what to do.
This approach to the serial position effect helps to streamline the user experience while keeping consumers engaged in the brand at all times.
A well-crafted informational hierarchy and interactive visual approach is a testament to the power of presenting information effectively without overwhelming the user with unnecessary data. This is definitely a driving force behind the startup’s ongoing success!
Whether you’re selling goods or services, applying the serial position effect will help you improve your landing pages’ UX and increase your conversion rates.
The Digital Marketing Institute, primacy and recency effect on Homepage (Source)
Digital marketing course provider, the Digital Marketing Institute, utilizes both the primacy and recency effect to UX optimize many of its landing pages.
The DMI’s homepage, for example, includes a clearly labelled ‘Download Brochure’ button at the very top of the page. The main banner tells the user exactly what the brand does and how they will benefit from enrolling (using a second ‘Download Button’ to prompt action), thus leveraging the primacy effect to encourage conversions.
At the bottom of the landing page, the Digital Marketing Institute includes graphics showcasing its top-level clients to create a sense of brand authority that sticks in the consumers’ mind while providing clear, concise FAQs in a clean dropdown format.
This recency effect-style approach ensures that visitors can recall essential details about the courses the DMI provides while remembering the impressive clients that brand has served.
Applying the serial position effect to your landing pages will give your UX design and content concepts definitive direction, improving navigation and boosting engagement in the process.
To build on the examples we’ve explored, here are some additional tips based on the serial position effect to help you improve your landing page UX:
Place your most expensive items or services at the top of your landing page to make your mid-range items or services appear less expensive and increase your average order value (AOV).
Add an alluring image, strapline, and CTA button to your top of page banner to deliver important information in a way that minimizes cognitive strain and increases consumer conversions.
Break up the text in the middle of the page with subheadings, images, bolded or italicized font, bullet points and small chunks of text to make your UX design more navigable. Doing so will also increase your chances of leading consumers to important information further down the page.
Position valuable information and USPs towards the bottom of the page and use informational CTA buttons to tell the user what to do next.
Always ensure that your landing page design is clean, logical, and easy to navigate. If you don’t put functionality first, it’s likely that your UX offerings will be poor and your visitors will not retain any information.
How to use experimentation in design
Applying effective design and copywriting principles to your various digital touchpoints while leveraging the serial position effect to deliver valuable information to your consumers will accelerate your commercial success.
But, in an increasingly saturated digital age where the consumer has a wealth of their fingertips, how do you know if your design and serial position effect-based efforts are working as they should?
A range of factors including color, layout, design elements, and even a consumer’s cognitive bias can impact landing page browsing behavior. So, the best way to understand if your initiatives are working and experiment with design effectively is though A/B testing. With a combination of effective data and the right A/B testing platform, it’s possible to pinpoint a specific landing page or user interface’s strengths or weaknesses.
By developing two versions of the same landing page, you can drill down into specific page elements and discover which performs best.
For example, you might find that version ‘A’ of a landing page is earning more engagement above the fold due to the design or placement of a ‘Shop Now’ button. Through testing, you might also find that version ‘B’ is converting more email subscribers as a result of a particular piece of copy or messaging.
If you hone in on this wealth of comparative information, you will gain the power to experiment with every design element imaginable, taking the best-performing elements to create a fully-optimized version of a specific page or touchpoint.
A/B testing will give your design experimentation activities shape while protecting your marketing budget.
If you understand which messaging or design elements to focus on, you can get to the root of the issue and make tweaks for optimizations that are likely to offer the best possible return on investment (ROI).
Concerning the serial position effect, through A/B testing and experimentation you will be able to flatten the serial position curve to balance the information on your interfaces or landing pages.
By balancing the information elements on your interfaces or landing pages, you can make your UX designs easier to navigate while improving brand engagement. You will also gain the ability to experiment with design elements to emphasize the information or assets featured at the top or bottom of your digital touchpoints.
Essentially, if users aren’t engaging with the information at the top or bottom of a specific page, it will become clear that your serial position effect-centric efforts aren’t working. From there, you can experiment with the hierarchy of your information in addition to design elements including buttons, color combinations, imagery, copy formatting, and text boxes.
At this point, it’s worth noting that in our ever-evolving commercial landscape, experimentation never stops. What works today may not tomorrow — and to optimize your digital touchpoints for sustainable growth, constant testing and evolution is essential.
“Design creates culture. Culture shapes values. Values determine the future.” — Robert L. Peters, Graphic Designer
Final thoughts
We’ve outlined the fundamentals of the serial position effect and looked at how to apply the concept to UX and landing page design while outlining the importance of experimentation and testing.
Reflecting on our journey, what is crystal clear is that, in order to deliver the very best designs and UX offerings to your consumers, you need to reduce cognitive strain as much as possible.
The serial position effect helps us to understand human limitations in terms of both long term and short term memory, as well as the importance of ordering your information effectively.
As designers, when applying the serial position effect, it’s critical to empower the user by providing task-relevant information on the screen where possible, sharing concise prompts or cues, reducing the level of recall needed across the user journey, and highlighting the most valuable information at the start and end of a sequence where necessary.
When interacting with your digital touchpoints or interfaces, your users shouldn’t be overwhelmed with information. They should be able to navigate every aspect of your interfaces or landing pages intuitively, with little additional thought, while understanding what to do next and why they are doing it.
Your UX and design offerings should deliver relevant, valuable information to your users in a way that is completely seamless — and, by using the serial position effect to guide your decision, you will set yourself apart from the competition.
After our amazing digital summit at the end of 2020, we wanted to sit down with Matt Bullock, Director of Growth at Roboboogie to learn more about ROI-driven design.
Tell us about Roboboogie and your session. Why did you choose this topic?
Matt: Our session was titled Building an ROI-Driven Testing Plan. When working with our existing clients, or talking with new potential clients, we look at UX opportunities from both a data and design perspective. By applying ROI-modeling, we can prioritize the opportunities with the highest potential to drive revenue or increase conversions.
What are the top 3 things you hope attendees took away from your session?
Matt: We have made the shift from “Design and Hope” to a data-backed “Test and Optimize” approach to design and digital transformation, and it’s a change that every organization can make.
An ROI-Driven testing plan can be applied across a wide range of conversion points and isn’t exclusive to eCommerce.
Start small and then evolve your testing plan. Building a test-and-optimize culture takes time. You can lead the charge internally or partner with an agency. As your ROI compounds, everyone is going to want in on the action!
2021 is going to be a transformative year where we hope to see a gradual return to “normalcy.” While some changes we endured in 2020 are temporary, it looks like others are here to stay. What do you think are the temporary trends and some that you hope will be more permanent?
Matt: Produce to your doorstep and curbside pickup were slowly picking up steam before 2020. Before the end of the year, it was moving into the territory of a customer expectation for all retailers with a brick-and-mortar location. While there will undoubtedly be nostalgia and some relief when retailers are able to safely open for browsing, I do think there will be a sizable contingent of users who will stick with local delivery and curbside pickup.
There is a lot of complexity that is added to the e-commerce experience when you introduce multiple shipping methods and inventory systems. I expect the experience will continue evolving quickly in 2021.
We saw a number of hot topics come up over the course of 2020: the “new normal,” personalization, the virtual economy, etc. What do you anticipate will be the hot topics for 2021?
Matt: We’re hopeful that we’ll be safely transitioning out of isolation near the end of 2021, and that could bring some really exciting changes to the user’s digital habits. We could all use less screen time in 2021 and I think we’ll see some innovation in the realm of social interaction and screen-time efficiency. We’ll look to see how we can use personalization and CX data to create experiences that help users efficiently use their screen time so that we can safely spend time with our friends and family in real life.
What about the year ahead excites the team at Roboboogie the most?
Matt: In the last 12 months, the consumer experience has reached amazing new heights and expectations. New generations, young and old, are expanding their personal technology stacks to stay connected and to get their essentials, as they continue to socialize, shop, get their news, and consume entertainment from a safe distance. To meet those expectations, the need for testing and personalization continues to grow and we’re excited to help brands of all sizes meet the needs of their customers in new creative ways.
According to a PWC survey, one in three customers would leave a brand after just one bad experience. Hence, your company may invest a lot of time and money optimizing your digital product to stay relevant in today’s often crammed markets.
A critical part of the overall product experience is user onboarding: get it right and win loyal customers, but get it wrong and lose those users forever.
So it makes sense to continuously tweak the user onboarding process – the perfect job for a product team. Such a team often consists of 5 to 8 people, including product managers, designers, and developers. Different companies work with various product team sizes and configurations – whatever is best for their use case. However, we rarely see DevOps engineers in these teams because many view DevOps as just a vehicle for successful feature releases.
Ultimately, however, these DevOps engineers have to get up at night to fix a newly deployed feature that crashes the app every time a user navigates through the onboarding process.
We want to ask you: Can an app whose onboarding process doesn’t work technically be successful, and do release teams significantly impact UX after all? Let’s find out.
In this article, we’ll be exploring how to:
[toc content=”.entry-content”]
Make users feel right at home with a great onboarding experience
Most apps require an onboarding process to show new users how to achieve their goals as efficiently and conveniently as possible.
For this, we need to keep in mind that the onboarding experience can affect your relationship with prospects – both positively and negatively.
No matter how good your app actually is, the first impression counts!
Large companies like Slack or Dropbox also frequently overhaul their user onboarding to ensure users have a comfortable, fun, and productive start to their product. But see for yourself. The following images show an excerpt from Slack’s onboarding process from 2014 and 2021. Of course, the design has changed drastically, but you can also see that instead of reading where the team name comes up in the Slack interface, we actually see the user interface and our team name on it. These improvements are certainly not the results of guesswork but of meticulously coordinated optimization workflows.
–
The evolution of Slack’s onboarding process (Source)
As even big enterprises invest in optimizing their onboarding processes, we realize that we should do the same and not rest on our laurels. The question remains, how do you make sure you are building the right onboarding experience in the right way?
And this is where cross-functional product teams and Flagship come into play!
Leverage Flagship to unite product teams and ensure great UX
At AB Tasty, when we work towards a great user experience, we focus on two main themes:
Release the right feature: We step into our users’ shoes and conduct experiments and tests to ensure that the feature delivers value and looks and feels good.
Deploy the feature right: It’s not just about functionality and looks. We utilize feature management to ensure that what we’ve created works flawlessly at all times and on different platforms. –
Flagship provides a shared environment for experimentation and feature management
–
Flagship gives you the means to get the most out of both: data-driven experimentation and feature management to create and release features for great customer experiences. So we see release teams as an integral part of creating value for our users. This may not be the most popular opinion. Still, now we’d like to tell you more about why we think DevOps should be more closely integrated with product teams.
It’s no secret that teams that work toward a common goal are more likely to reach their true potential than those that don’t. By isolating DevOps from product teams, you probably can’t count on the positive effects of unity and passion necessary to create and release great products. For this reason, we encourage product teams to work more closely with DevOps. Release teams also care about delivering value and great experiences to users. And they bring the skills required to do so to the table.
Flagship provides product managers, developers, and DevOps engineers with a shared environment for experimentation and feature management. You get easy access to all the data and tools needed to have a productive conversation about the product optimization process in a common data-driven language. Simultaneously, instead of isolating specific roles and responsibilities in silos, each member of the product team can focus on doing their job while continuing to work as a collective force.
Now, let’s take a look at how Flagship’s experimentation and feature management capabilities enable product teams to deliver outstanding user experiences.
Deploy the feature right with feature management
First, let’s talk about a few examples of how feature management and releasing a feature right can positively impact your users’ onboarding experience.
Suppose you want to add tooltips to your onboarding process to help users navigate your product’s dashboard confidently. The product team prepares the new feature accordingly and thoroughly tests the functionality on the test servers. After everything seems to be working, they roll out the new feature for all users in one fell swoop. Hopefully, it’s not Friday afternoon, as the changeover could cause unforeseen problems on the production server, like:
Your user is stuck in an infinite loop that they can’t exit
User input isn’t saved, e.g., in a form
The app crashes repeatedly
The user is sent back to the start for no apparent reason
Just imagine what such behavior means for users going through your onboarding process and looking forward to finally using your product when it suddenly stops working. Poof, the magic moment has passed. The user has most likely lost confidence in your app due to bad UX.
Flagship makes code deployments stress-free
With Flagship’s feature management capabilities, your product teams can publish new features with ease – even on Friday afternoons.
Feature management enables release teams to provide the new tooltips feature to a selected target group before continually rolling it out to everyone. This way, you can be sure that the new feature works under realistic conditions, i.e., on production servers with real users.
Through controlled and monitored rollouts, DevOps teams immediately know whether something isn’t working correctly. This enables them to react on time and be glad that only a few users have noticed the error.
For example, suppose the developers wrapped the tooltip feature in a feature flag (which they really should be doing). In that case, they can quickly deactivate it via the flagship dashboard if a problem occurs. Of course, they can also configure automatic code rollbacks based on KPIs to react even faster.
Proper feature management can de-stress your release teams: Gone are the sleepless nights spent dealing with damage control! If you want to learn more about the benefits of feature management for tech teams, we recommend our blog post here.
Release the right feature with experimentation
Perhaps you have great empaths on your product teams and feel like you know your users pretty well. Still, it is wise to experiment and test to create an onboarding process that your users will love.
Let’s look at the tooltip example from before again. Suppose that after your product team successfully integrated the tooltips into user onboarding, your analytics data shows that something must be wrong. Many users still don’t know how to use your app and abandon the process midway through. If you can’t identify and resolve the problem right away, you need to leverage other means to improve the tooltip’s user experience.
First, make sure that everything is fine from a technical point of view. Next, your product team should start working on possible variants to improve the tooltips’ presentation and functionality. You can then experiment and test with Flagship to determine which of these variants and ideas offer the best user experience.
For example, you could utilize A/B tests to see if showing a how-to video before displaying the tooltips helps users get started with your product. Or experiment with different tooltips sequences – perhaps the process is easier to understand if you change the tooltips’ order.
You’re also free to experiment with different colors, copy, UI elements, call to action, and so on. To make your experiments as meaningful as possible, you can define which users see which feature variant and track user acceptance, test results, and KPIs in the Flagship dashboard.
Another advantage of Flagship is that you can utilize 1-to-1 personalization based on audience segments to provide users with unique experiences. For example, after a user registered for a paid subscription, show them a customized welcome message and add more value to their onboarding experience.
… What about client-side tools for experimentation?
Many client-side experience optimization tools, such as our AB Tasty, can also perform most of these experiments – without code deployments. However, the advantage of coding your experiments for a critical process such as user onboarding is that you don’t potentially slow it down with automatically generated UI overlays. Instead, tests and experiments with Flagship are fast, secure, and flicker-free, as they come directly from the server and don’t have to be calculated in the user’s browser. Of course, client-side tools still have their justification and unique uses – Flagship is a great tool to complement your client-side strategy.
Wrapping up
If you want to provide users with the best possible onboarding experience, you need cross-functional teams who know how to release the right feature and how to release a feature right. One of our goals is to advocate the importance of release teams to great UX – whether a product technically works is as important as how it looks and behaves.
Using Flagship’s experimentation and feature management capabilities, product teams can benefit from a shared platform to collaborate on improving the onboarding experience in a productive and data-driven way.
Would you like to try Flagship for your product teams? Book a demo and see how experimentation and feature management can transform your users’ onboarding experience from okay to Yay.
We’ve spent the past couple of months at AB Tasty developing our product integrations with the leading Product Analytics providers. In this post, I’m excited to highlight Heap. Not only does Heap feature my favorite color (dark purple) in its branding, it offers its users an unbridled view for product managers and marketers to see how their customers engage with and move through digital journeys.
We think that’s quite a feat, and we want to showcase how our customers can create actionable programs to capitalize on the insights provided by Heap.
Without having a full understanding of your basic user journey and the various offshoots that customers may take along the way, marketers and product teams are forced to guess or rely on qualitative feedback to improve, optimize, or build on digital experiences.
Evolution, rapid iteration, and growth begins with understanding precisely how your users behave and why.
You need to have a clear picture of your user experience to understand their frictional moments and have the ability to quickly and efficiently test different hypotheses and action plans to find the best way to resolve those pain points.
On the other hand, while experimenting to identify potential solutions, you need to have insights into their impacts and how they resolve a frictional experience.
Measure everything along the customer journey with Heap. Plan actions and set up experimentation and personalization campaigns to optimize your user experience with AB Tasty then analyze the results of your campaigns.
Allow me to take you through an example, which may hit home for many readers. I know it hits home with me, personally, although I am a proud member of #teamhotleads scrapping for the coveted demo request as opposed to shopping cart conversions. Anyway…
The journey starts with Heap. Within the Heap platform, you can track all aspects of your users’ digital experiences, identify critical drop-off points in the clickstream that prevent conversions while identifying ways to simplify and clarify steps for customers.
Maybe you have a snazzy new checkout page that has increased your purchase rate. How can you be sure you’re funneling the maximum amount of traffic to that snazzy new page to reach your full purchase potential? Enter Heap.
Use your Heap platform to pin-point exact moments in your users’ journeys that result in drop-offs or, spinning it as a positive, as we like to do, “areas for improvement.” Once you’re able to identify these less-than-optimal moments in the journey within Heap, you need to formulate a game plan to take action to improve your traffic flow to your snazzy new checkout page. How? Enter AB Tasty.
Within AB Tasty you can craft experimentation programs ranging from changing your button colors to targeting hyper-specialized segments of visitors with powerful personalization campaigns. Using your experimentation results, create optimization roadmaps that allow you a path to realizing your full traffic potential on that checkout page that you spent so much time developing.
Formulate hypotheses and create an action plan, then conduct precise personalization and experimentation campaigns with real-time and retroactive data with the AB Tasty optimization platform. Once you’ve taken action, you can measure the impact and track the success in the Heap platform.
This seems pretty tactical, right? Let’s take it up a few levels to understand where this can provide strategic value.
Running ad hoc experiments can sometimes yield surprising and valuable improvements in certain metrics. An experimentation roadmap can bring you even more impact to those improvements.
By focusing your experiments on targeted points within the customer journey and building a roadmap of your experimentation plan, you can achieve compounding improvements to your customer experience, and, as a result, your revenue goals.
To learn more about how to set up your AB Tasty campaign data with Heap, check out our knowledge base article.
It’s a competitive world online. In order to beat your competition, you need world-class customer experience (CX).
But what exactly does customer experience mean, anyway?
This is a non-technical guide to customer experience; we’ll cover what CX is, why it’s important, how it benefits your business, and how you can measure it.
By the end of the article, you’ll have everything you need to start measuring, improving, and delivering an exceptional experience for your customers.
The Definition of Customer Experience
Customer experience is a big deal.
So much so that a study by Econsultancy found that the number one priority for more than 2,000 marketers was customer experience when asked the question:
“Over the next five years, what is the primary way your organization will seek to differentiate itself from competitors?”
So what is customer experience?
Customer experience (CX for short) is the perception of your customers’ experience with your business or brand.
Every time a customer interacts with your brand and everything your business does, it has an impact on how your customers perceive your business.
Customer experience is the culmination of all of these experiences and interactions, impacting your decision whether to return to the business or make a purchase.
Simply put, the key to your success is epic customer experience.
The Importance of Customer Experience for Your Business
The core benefits of improving your customer experience include the following:
Increase the loyalty of your customers
Increase the happiness and satisfaction of your customers
Increase positive reviews and recommendations
Reduce returns
Reduce complaints
Reduce churn
There is no doubt that to be a successful business, you need to put your customers first. If you do, it’s not only good for them, but it’s also good for your business.
The Customer Journey and Customer Experience
As we’ve seen, customer experience is concerned with the holistic experience of your customers with your brand.
This means that every step of the customer journey has the potential to impact on your customer’s experience.
In terms of customer experience, the stages of a customer’s journey include discovery, research, purchase, and post-purchase customer support.
It should go without saying, but in terms of customer experience, there’s one extremely important caveat to the customer journey.
Instead of considering each stage of the journey from the business’s perspective, it’s imperative to consider these touchpoints from the perspective of the customer.
To improve customer experience at each stage, we need to understand how and why they are different, and what we can do to improve the experiences of your customers.
To better understand customer experience, let’s break down the customer journey into stages.
Stage One: Consideration
When a customer changes from an observer to a potential customer, they enter the “Consideration” phase.
It’s at this stage that a customer is making a choice whether to consider your brand or exclude it from their buying journey.
At this point, branding is hugely important. Well-known brands have the upper hand at this point, but if you own a smaller company, the best way you can make an impact is by having a clear message that solves a customer’s problem.
Stage Two: Evaluation
There are two ways in which a potential customer can enter the evaluation stage.
First, they may have “selected” your brand during the consideration stage or, interestingly, they may enter the cycle fresh in the evaluation stage.
While this may seem odd, it’s common sense. As a potential customer researches products similar to yours, it’s likely that they stumble across new brands, as well as the brands they’ve previously considered.
The way you advertise to customers at this stage of the cycle should, therefore, reflect both of these types of customers and you should take into account the fact that many people have not yet interacted with your brand at all.
Stage Three: Buying
Hooray! This is the stage we’ve all been waiting for. And it’s more than likely the stage that most marketers focus on.
Everything from the text on the ‘Buy’ button to the copy on the product page is A/B tested, iterated, and scrutinized.
Of course, this is highly important, but by placing too much emphasis on this one stage of the cycle, it could be detrimental to the customer experience overall.
Stage Four: Post-Purchase
Often overlooked, the post-purchase stage is an equally important part of the customer experience journey.
How you treat your customers after they have bought from you will affect whether they choose to repeat the process…or not.
The effect of customer satisfaction after a purchase can have a huge impact on your bottom line. Consider these statistics:
It can cost up to 25 times as much to acquire a new customer than to retain an existing one
If you increase retention rates by 5%, then you can increase profits by 25% to 95%
And here’s the punch line: only 18% of businesses focus on customer retention.
This represents a huge opportunity for you to beat your competition, increase your profits, and improve your customer experience. Win, win, win.
The Importance of Website Personalization
“Website personalization is the real-time individualization of a website to suit each visitor’s unique needs and guide them through a custom conversion funnel.”
And it goes hand in hand with customer experience.
Personalization can be done at any stage of the funnel, from personalized email marketing to exit-intent popups and discount offers.
A well-targeted personalized message evokes an emotional response and creates a stronger, more memorable connection with your brand.
How to Measure Customer Experience
Instead of measuring the ROI of customer experience, which will likely take the focus off customer satisfaction, you should use one or more of the following industry-specific metrics:
NPS (Net Promoter Score)
The Net Promoter Score, or NPS, measures customer experience and can also predict business growth.
It’s a simple measurement, but it’s been adopted around the world and is seen as one of the best ways to measure your customer’s experience.
To run the test, ask your customers on a scale of one to ten whether or not they would recommend your brand or business to a friend.
Respondents are then grouped into “Promoters” (score 9-10), “Passives” (score 7-8), or “Dectractors” (0-6).
Once you’ve collected your responses, subtract the percentage of Detractors from the percentage of Promoters, and you have your Net Promoter Score.
It’s simple, straightforward, and it works.
CES (Customer Effort Score)
Like the NPS, CES is another way to measure customer experience.
Also using a survey, it asks customers to rank their experience with the business ranging from “Very Difficult” to “Very Easy.”
The theory is, if you make it easy for your customers to make a purchase or solve their problem, then it’s more likely that they will continue to pay for your product or service.
The easiest way to increase customer loyalty is not through “wowing your customers,” but rather through making it easier to get their job done.
CSAT (Customer Satisfaction Score)
The final customer service metric is the Customer Satisfaction Score.
It’s a basic test and, due to the difference in opinion over what is classed as “satisfactory,” its validity can be questioned.
Nevertheless, it’s simple to do and can offer insight into how well your customers experience your brand.
The survey asks the question “How satisfied were you with your experience?” in order to gauge customer satisfaction with their purchase or interaction with your business.
The response should be on a scale from 1–3, 1–5, or 1–10.
TTR (Time to Resolution)
Time to Resolution, or TTR, is the average time it takes for your customer service team to resolve an issue raised by a customer.
One of the best ways to reduce customer frustration is to ensure the timely resolution of their issues.
Unfortunately, if you don’t measure your response times, it’s impossible to know whether or not you’re hitting the mark.
To test your TTR, simply add up all of the time it takes to resolve issues and divide the total by the number of tickets addressed.
TTR is the average length of time it takes for customer service teams to resolve an issue.
Conclusion
In a digital world, customer expectations are higher than ever, and word of good (or bad) service travels at the speed of light. Customer experience requires constant care and attention. Focus on a long-term customer experience strategy and always offer a customer-centric strategy.
By understanding your customer experience journey and testing your customers’ satisfaction levels, you can improve your customers’ perceptions of your brand and, in turn, improve brand loyalty, increase retention, and achieve higher profits.
Did you know that 90% of the time people spend on their phones is in mobile apps? Creating an app for your business is a great way to ensure that people can easily find your services right on their phones.
However, a lackluster app can sour your relationship and brand image. Regular usability testing of your mobile app helps you see how this handy marketing tool can be improved.
Read on to learn how you can conduct high-quality usability testing for your mobile apps.
Good Usability Testing: The Benefits
Usability tests for mobile apps are designed to observe test-subject users while they use your app. The purpose of testing is to measure the app’s user-friendliness and learn about how it can better support your brand’s key marketing objectives.
Usability testing helps to ensure that your app is adding value to your business, as well as meeting the expectations of the final users. Ensuring you have good usability for your mobile app will help your business improve customer satisfaction, decrease time on customer support, and increase your sales and revenue.
Seven Steps to Run an Effective Usability Test
Decide on your Objectives
First and foremost, come up with specific objectives for your usability test. When designing your objectives, keep the five usability attributes in mind:
Once you have the big idea objectives, nail them down to specifics.
One objective could be determining what aspects users enjoy about your mobile app. Perhaps they find it easy to use, or they like the colors you’ve assigned. Another objective might be seeing if a new feature helps or hinders users from completing a specific task.
Whichever way you decide to do it, make sure you have some core objectives and some flexible ones. Core objectives should be questions you ask every time you run a usability test. Flexible objectives are ones that depend on new updates or changes that didn’t exist before.
Design the Tasks
Next, it’s time to design the tasks that you’ll ask your users to do. There are a few key guidelines you should follow when designing usability tasks.
First, even if your mobile app is still in development, remove placeholder text like “lorem ipsum” with a draft of what should be there. This will help you get a better sense of how people navigate the site and decide which information is important. If they see placeholder text everywhere, you’re not getting a good sense of how they weigh the information presented to them.
Avoid providing clues in your instructions. Offering extra hints and tips might lead them to take actions they wouldn’t have otherwise figured out.
Before you run your test, check that there isn’t any ambiguity in your instructions. If you leave instructions up to interpretation, your results might make it seem that your app isn’t user-friendly.
Choose Between Lab Settings or Remote Testing
There isn’t one right option when choosing between a lab setting or running your test remotely. However, there are pros and cons to each choice.
You don’t need an actual lab to run a test in a lab setting. This just means that you’re running the test yourself in a controlled environment.
In Lab settings, you have the benefit of gaining extra observations. Even small things like hesitation or scrunched eyebrows can tell you a lot about their user experience. You also gain complete control over their experience and the environment in which the test is conducted.
One downside of lab settings is that you risk muddling the results with theframing effect. If you accidentally ask a question in a leading way or provide too much information, you’ll end up getting results that reflect your knowledge and experience with the app – instead of your users.
The advantage of remote testing is that you don’t need to schedule a time and place to host your users. The users do the test on their own time, and you get sent the results, which saves time for your team. And like we mentioned, remote testing is a great way to avoid the framing effect.
There is a range of testing tools available for mobile UX, so be sure you choose one that supports the measurement of your key objectives.
Ready, Set, Run the Test
Now that everything is ready, it’s time to run your test. There are a few differentmoderation methods you can choose from.
One option is to ask your participants to think out loud as they work through the tasks. “Oops, didn’t think it’d do that” is great feedback. If you’re running a test remotely, this can give you extra information about their thought process. One downside to this is that having to speak out loud might be a distraction or cause the user to complete the test slower than they would otherwise.
If you’re doing a lab test, you can take advantage of being in-person to ask them questions as they progress. However, it’s important to ask questions in a non-judgmental and non-leading tone.
Finally, you can moderate retroactively. This type of moderation asks your user to watch a replay of themselves and explain their actions, or you ask users to elaborate on certain decisions they made.
Organize and Analyze Your Data
Now that you’ve collected your usability data, it’s time to organize and analyze it. Drawing meaningful conclusions is arguably the most important step toboost the impact of your testing.
It’s best practice to review the testing sessions one at a time. Look at all the materials you have for that user, including notes on recordings, transcripts, and other info you might have.
Organize your data in an easily digestible way. Some standard categories for reporting might include the user’s name or ID number, task title, and encountered problems. You might also want to categorize problems for easy sorting – confusion, broken links, or disappointment might be some examples.
Regardless of how you choose to analyze your research, don’t forget to look at both quantitative and qualitative data. Quantitative data is great for giving your app an overall scorecard and providing summaries to higher-ups. But, keeping the qualitative data is important for remembering the details of your testing.
Work to identify positive trends and patterns, as well as challenges and roadblocks that your users faced. Be sure to cross-check your data against different metrics to help reveal if certain patterns only revealed themselves on certain devices or demographics of your audience.
Try to get in the habit of developing a standardized report so that you can easily compare changes over time. This will help ensure that you and your team can easily review progress and setbacks you’ve faced from your last usability test.
Time to Act: How to Improve Based on What You Learned
Running usability tests on mobile apps can be overwhelming. You receive so much information at once that it’s like drinking from a firehose. The first step to avoiding feeling totally overwhelmed is to prioritize your feedback.
Look at your data and choose which aspects should be the biggest priority. You can rank priorities from one to ten or categorize them from low importance to critical. Distribute these tasks in order of importance.
Take careful notes of what your team achieves and what still needs to be completed before the next test.
Which brings us to…
Plan Your Next Test
For salespeople, the slogan is “ABC – Always Be Closing.” For developers, it’s ABT – Always Be Testing.
Usability testing should happen on a regular and scheduled basis. These tests can guide choices for new design features, and updates to improve functionality.
Based on what you learned from past usability tests, you should check that major issues from before have since been resolved. ThroughA/B testing, you can test your newest update to your older version.
Regardless if your mobile app is in development or you’re undergoing an update, you should keep an eye on competitor mobile apps. This can help you stay ahead of the curve and keep up with usability expectations for your industry. It can also inspire changes that take advantage of thefamiliarity principle.
Getting feedback on the usability of your app can be a difficult pill to swallow. It’s important to remember that a lot of feedback means you ran a successful usability test, and not that your app is a failure. Every test you run will bring you closer to perfecting the user-experience and supporting larger business goals.
Knowing one dimension makes it possible to calculate the other. If you have an element with 1000px width, your height would be 750px. This calculation is made as follows:
