Enabling users to monetize and grow their subscriber base through recommendations

through the Newsletter Recommendation Widget

Newsletter Recommendation - Hero Image

Overview

AWeber customers primarily gather email subscribers through four main methods: direct sign-ups on their websites or landing pages, advertisements, third-party integrations, and traditional word-of-mouth referrals. While all the aforementioned methods effectively collect a good subscriber base, they are limited to those four audience sources. Imagine if there were an additional way to attract audiences who are genuinely interested in the customer's business domain.

For example on Instagram, when you follow, let's say, a UX design account, it suggests additional UX design profiles that you might find interesting. In my case, I often end up following a few more that capture my attention.

Similarly, what if customers could advertise similar newsletters after subscribers sign up for their newsletter? This feature would allow AWeber customers to promote their newsletters, thereby expanding their audience base, while enabling those who recommend them to earn money through referrals.

Definition

The Newsletter Recommendation system is designed to present personalized newsletters that align with preferences and interests of individuals signing up for a specific newsletter.

Goal

Develop a solution that seamlessly incorporates the recommendation system into our current sign-up form builder, prioritizing reduced setup time compared to competitors. Additionally, design two dashboards to present analytics data on recommendations in a user-friendly manner.

Roles and Responsibilities

Product discovery | User Research | UX Design | UI Design | Usability Testing | Iterative prototyping

Initial Exploration

Value proposition

Advertisers get paid for recommending other similar newsletters.

Other customers grow their audiences through recommendations by advertisers.

Feature Demand

The motivation behind building this feature lies in the fact that our existing customers use similar products like Sparkloop and Facebook lead ads to expand their audience through recommendations. Integrating the feature within the AWeber platform simplifies and speeds up the recommendations setup process for customers, eliminating the need to use external integrations or tools.

Feature Benefits

No external integrations or tools are necessary, as this feature will be seamlessly integrated into the AWeber application, guaranteeing reliability and trust amongst customers.

Provides comprehensive reporting that consolidates all recommendations data within the customer's AWeber account.

Feature Objectives

01
Empowering advertisers with complete control over recommendations setup

02
Driving customer adoption to our recommendation system over competitors

03
Ensuring only legitimate newsletters are added to the system as recommendations

04
Presenting recommendations data to show insightful success metrics for customers

Recommendations Setup - Design Strategies

01. Empowering advertisers with complete control over recommendations setup

Design Iteration One

The first design iteration aimed to enable advertisers to selectively include or exclude specific newsletters during the setup process. Additionally, it provided them with the capability to modify their selections or deactivate recommendations entirely at any given time. The design also provided advertisers the control over the number of newsletters displayed within the flow. I introduced an autonomous setup flow incorporating a wizard comprising of three steps:

Step 1

Customers can select up to three categories relevant to their newsletter content

Iteration One - Step 1

Step 2

Newsletters are generated based on the selected categories. Customers can then select and customize newsletters in quantity.

A dynamic preview panel offers them a visual representation of the widget with their selections.

Iteration One - Step 2

Step 3

Customers select one or more existing sign up forms to apply the recommendations.

Iteration One - Step 3

Issue with Iteration One

Enabling newsletter recommendations on multiple sign-up forms simultaneously can lead to issues such as overlapping audiences, inconsistent user experiences, and complications in tracking and analytics. It also poses challenges in resource management, dilutes the impact of recommendations, introduces technical complexities, and risks subscriber fatigue.

Additionally, the option for users to select the number of newsletters displayed as recommendations was removed. The count was standardized to five to ensure visual consistency and provide an optimal user experience.

Design Iteration Two

To ensure a more granular control over recommendations set up, we pivoted to a per-sign-up form approach instead of applying them across multiple forms. This empowers customers to manage categories and offers for each form in their account. Moreover, it enables us to extend the existing sign-up form editor, seamlessly integrating the feature with the benefit of user familiarity.

The sign-up form editor was updated to include a toggle which, when enabled, provides options for setting up recommendations on specific sign-up forms.

Additionally, it now includes an interactive calculator that provides an estimate of potential earnings.

Iteration Two - Step 1

Once the toggle is enabled, customers can select categories and newsletters before finalizing the form for publishing.

Iteration Two - Step 2

Issue with Iteration Two

The extensive page form featuring numerous settings could result in confusion and reduced completion rates, as users may experience information overload and find it challenging to navigate through the content.

Moreover, there was insufficient emphasis on the recommendations feature section, necessitating enhancements to captivate users' attention.

Design Iteration Three (Final)

In the final exploration, we optimized the user flow by introducing a slide-out modal that enables customers to quickly configure recommendations. This design isolates the task, minimizes distractions and maintains user focus. This feature follows a familiar pattern used on other pages within the application, ensuring users are already acquainted with its functionality.

When triggered, the Activate CTA prompts a slide-out modal to appear, first presenting categories, followed by the display of offers based on the selected categories.

Final Iteration - Step 1

Customers have the option to review available offers and exclude any if necessary.

Final Iteration - Step 2

Customers can preview how the offers will appear to subscribers, before activating recommendations.

Final Iteration - Step 3

Upon activation, customers receive a clear success message confirming validation. They are provided with the ability to edit or deactivate recommendations as needed.

Final Iteration - Step 4

Empty and error states

Empty state

When the chosen categories yield no offers, a clear empty state message is displayed, providing customers instructions on next steps.

No offers state

Error State

When all available offers are excluded by a customer, an error message is displayed prompting them to include at least one offer.

All offers excluded

02. Driving customer adoption to our recommendation system over competitors

The design decisions made in this project significantly reduced the time required to set up recommendations by 80% compared to that of our strongest competitor. This efficiency is achieved through a streamlined set up process with fewer steps, in contrast to the extensive onboarding tasks associated with the competitors. Additionally, by integrating this functionality into the AWeber platform, we eliminated the need for external dependencies.

Simple recommendations setup

03. Ensuring only legitimate offers are added to the system

Our recommendation system was supported by a manual approval process conducted by the AWeber team. This process guaranteed that only legitimate offers meeting certain criteria were added to the system, ensuring their suitability for advertisement as recommendations. This is communicated to users through helper text and callouts.

04. Presenting data to show insightful success metrics for customers

To provide customers with comprehensive success metrics derived from recommendations, we designed two Dashboards: one tailored for referrals and another for acquisitions. These dashboards feature high-level primary and secondary metrics complemented by helpful tooltips, offering detailed explanations for each metric.

For improved clarity, primary metrics are highlighted in a subtle blue hue, while secondary metrics are presented in a lighter grey shade, ensuring effortless comprehension for customers. The design of the page adheres to a standard index page pattern prevalent throughout the application, promoting user familiarity and ease of navigation.

Referral Dashboard

Metrics are displayed cards, and subscriber information is presented in a well-structured index table. A status indicator, employing suitable colors, conveys the status of subscribers.

Additionally, the column sorting feature facilitates user navigation and expedites finding specific information within the table.


Acquisition Dashboard

The acquisition dashboard presents customers with filtering capability to streamline their navigation by offer names.

Referral DashboardAcquisition Dashboard

Impact

1. The design has proven to reduce the recommendations setup time by 80% when compared to third-party recommendations platform.

2. Facilitates substantial growth for advertisers, primarily through increased earnings.

3. Enables customers to achieve growth in their subscriber base.

4. Facilitates increased user engagement, contributing to AWeber's audience growth.