AI Newsletter Assistant

Improving conversions by 11% and boosting key business metrics through strategic redesign

B2C · AI · UX research · iterative design · product design

Project Overview

The AI newsletter assistant is an agent that generates messages based on user prompts and also suggests weekly topics with ready-to-schedule content, all within users' control.

The AI newsletter assistant is an agent that generates messages based on user prompts and also suggests weekly topics with ready-to-schedule content, all within users' control.

Problem

Problem

Users were dropping off on the entry page without engaging with the feature. By research and thorough analysis of user session data, I identified key pain points and redesigned the entry and loading experience, then implemented the changes myself.

Users were dropping off on the entry page without engaging with the feature. By research and thorough analysis of user session data, I identified key pain points and redesigned the entry and loading experience, then implemented the changes myself.

Contribution

  • UX research

  • UI/UX design

  • Front-end development

Contribution

  • UX research

  • UI/UX design

  • Front-end development

Impact

Impact

⬆️ 2,200

⬆️ 2,200

more feature page visits, up from 1,000

more feature page visits, up from 1,000

⬆️ 1,334

⬆️ 1,334

more users using the feature, up from 442.

more users using the feature, up from 442.

⬆️ 11%

⬆️ 11%

increase in conversion rate of users adding a prompt

increase in conversion rate of users adding a prompt

~ 5 hours

~ 5 hours

average user time saved through suggested topics

average user time saved through suggested topics

Jump To Solution ↓

Jump To Solution ↓

Jump To Solution ↓

BACKGROUND

What is the AI Newsletter Assistant?

The AI newsletter assistant is an agent that generates messages based on user prompts and also suggests weekly topics with ready-to-schedule content, all within users' control.

The AI newsletter assistant is an agent that generates messages based on user prompts and also suggests weekly topics with ready-to-schedule content, all within users' control.

📊

Analyzes user data such as website, business industry and past messages.

📊

Analyzes user data such as website, business industry and past messages.

✍️

Learns user's writing style and tone of voice to create engaging messages.

✍️

Learns user's writing style and tone of voice to create engaging messages.

✨

Delivers ready-to-schedule messages weekly, and plans content for users.

✨

Delivers ready-to-schedule messages weekly, and plans content for users.

For the beta release, this feature was rolled out to a select group of customers. Two issues were identified:

For the beta release, this feature was rolled out to a select group of customers. Two issues were identified:

only 442 users

out of those 1,000 were adding a prompt or trying the feature out.

only 442 users

out of those 1,000 were adding a prompt or trying the feature out.

only 1,000 users

only 1,000 users

only 1,000 users

were entering the newsletter assistant feature page

were entering the newsletter assistant feature page

only 400 users

only 400 users

out of those 1.1k were adding a prompt or trying the feature out.

out of those 1.1k were adding a prompt or trying the feature out.

Current experience

The MVP was quickly implemented with minimal design input, and while it showed potential, it wasn’t fully optimized for engagement. That’s when I inherited the project midway.

The MVP was quickly implemented with minimal design input, and while it showed potential, it wasn’t fully optimized for engagement. That’s when I inherited the project midway.

On a high level, my tasks were to

On a high level, my tasks were to

01.

Strategically add entry points to bring in more beta customers to the feature page

01.

Strategically add entry points to bring more beta customers to the feature page

02.

Redesign the feature page experience focusing on user confidence and prompt engagement

02.

Redesign the feature page experience focusing on user confidence and prompt engagement

RESEARCH

I learned the current user behavior

I learned the current user behavior

Feature Exposure

The feature was presented to beta customers in two key ways, and here’s what I observed in terms of engagement.

Feature Exposure

The feature was presented to beta customers in two key ways, and here’s what I observed in terms of engagement.

Promotional Content

Promotional Content

Promotional Content

204 users

📩 Email

🔔 Notifications

204 users

📩 Email

🔔 Notifications

204 users

📩 Email

🔔 Notifications

Dashboard Promo

Dashboard Promo

Dashboard Promo

98 users

98 users

98 users

Feature Experience

Our UX researcher conducted beta customer outreach to gather feedback and identify pain points.

Additionally, I spoke with three customers to further understand their challenges with using the feature.

Feature Experience

Our UX researcher conducted beta customer outreach to gather feedback and identify pain points.

Additionally, I spoke with three customers to further understand their challenges with using the feature.

Customer outreach quotes

INSIGHTS TO GOALS

I defined project goals based on key insights gathered from research

I defined project goals based on key insights gathered from research

DESIGN AUDIT

I performed a UI/UX audit to evaluate the current experience of the feature to inform the redesign

  1. Inconsistent UI

The light blue background resembles AWeber’s corporate notification emails, making it feel disconnected from the rest of the app.

  1. Unclear UX copy

The term “newsletter” may be misinterpreted, leading to confusion about the feature’s purpose.

  1. Lack of user guidance

No clear starting points exist to help users understand how to engage with the feature.

  1. No social proof

The UI does not instill confidence, which is critical for adoption of a new feature.

Additionally, the loading state was just a blank screen with a spinner, not engaging enough and failed to effectively educate users.

Additionally, the loading state was just a blank screen with a spinner, not engaging enough and failed to effectively educate users.

  1. Inconsistent UI

  1. Inconsistent UI

The light blue background resembles AWeber’s corporate notification emails, making it feel disconnected from the rest of the app.

The light blue background resembles AWeber’s corporate notification emails, making it feel disconnected from the rest of the app.

  1. Unclear Messaging

  1. Unclear Messaging

The term “newsletter” may be misinterpreted, leading to confusion about the feature’s purpose.

The term “newsletter” may be misinterpreted, leading to confusion about the feature’s purpose.

  1. Lack of User Guidance

  1. Lack of User Guidance

No clear starting points exist to help users understand how to engage with the feature.

No clear starting points exist to help users understand how to engage with the feature.

  1. No Trust Signals

  1. No Trust Signals

The UI does not instill confidence, which is critical for adoption of a new feature.

The UI does not instill confidence, which is critical for adoption of a new feature.

IDEATION

IDEATION

IDEATION

Task 01. Strategically adding entry points to bring in more beta customers to the feature page

  1. Adding a navigation item was the easiest way to drive traffic, so I positioned it based on "top entry pages" data.

The Messages item is among the top five entry pages, attracting over 30K monthly users. I strategized placing the Newsletter Assistant navigation item right above it to drive the most engagement.

The Messages item is among the top five entry pages, attracting over 30K monthly users. I strategized placing the Newsletter Assistant navigation item right above it to drive the most engagement.

  1. Nav item without any decoration

  1. Nav item without any decoration

  1. Nav item without any decoration

257 clicks on the first day

257 clicks on the first day

257 clicks on the first day

B. Nav item with a "NEW" badge

B. Nav item with a "NEW" badge

B. Nav item with a "NEW" badge

789 clicks after update

789 clicks after update

789 clicks after update

⬆️ 207% - clear winner

⬆️ 207% - clear winner

⬆️ 207% - clear winner

  1. I noticed that new users weren't seeing the Dashboard promo because of the obstructing "getting started" checklist.

This was an opportunity to introduce a dedicated promo for newly onboarded users who met the beta criteria.

This was an opportunity to introduce a dedicated promo for newly onboarded users who met the beta criteria.

  1. I noticed that new users weren't seeing the Dashboard promo because of the obstructing "getting started" checklist.

  1. I noticed that new users weren't seeing the Dashboard promo because of the obstructing "getting started" checklist.

This was an opportunity to introduce a dedicated promo for newly onboarded users who met the beta criteria.

This was an opportunity to introduce a dedicated promo for newly onboarded users who met the beta criteria.

Task 02. Redesign the feature page experience focusing on user confidence and prompt engagement

Task 02. Redesign the feature page experience focusing on user confidence and prompt engagement

I did some background work before moving to designing high-fidelity screens.

I did some background work before moving to designing high-fidelity screens.

I did some background work before moving to designing high-fidelity screens.

Design Brainstorming and Iterations

I brainstormed ways to align the UI with the app's overall design system for a more cohesive experience.

I ideated ready-to-add prompt options to minimize user effort and provide clear starting points.

I explored different types of social proof to enhance user confidence and trust in the product.

I explored different types of social proof layouts to enhance user confidence and trust in the product.

Design Brainstorming and Iterations

Design Brainstorming and Iterations

  1. I brainstormed ways to align the UI with the app's overall design for a more cohesive experience.

  1. I brainstormed ways to align the UI with the app's overall design for a more cohesive experience.

  1. I collaborated with product managers and UX designers to refine terminology for maximum clarity and consistency.

  1. I collaborated with product managers and UX designers to refine terminology for maximum clarity and consistency.

  1. I ideated ready-to-add prompt options to minimize user effort and provide clear starting points.

  1. I ideated ready-to-add prompt options to minimize user effort and provide clear starting points.

  1. I explored different types of social proof to enhance user confidence and trust in the product.

  1. I explored different types of social proof to enhance user confidence and trust in the product.

SOLUTION

SOLUTION

Final UI/UX Improvements

Feature Page

The product team preferred the feature to be separate, while ensuring UI consistency.

  • Chose the word "message" over "newsletter" to avoid confusion.

  • Introduced a full-width section for topics for better flow and a vertical layout for user focus on one item at a time.

  • Added social proof to provide more relatable output examples.

The product team preferred this feature to be separate, while ensuring UI consistency.

  • UI Consistency: Matched background color and UI elements with the app.

  • UX copy: Chose the word "message" over "newsletter" to avoid confusion.

  • Suggested Topics: Introduced a full-width section for better flow and a vertical layout for user focus on one item at a time.

  • Visual Social proof: Provides customers with more relatable output examples.

The Suggested Topics are AI-generated each session, so a clear loading state was essential.

I used a Skeleton component to ensure a smooth experience.

Loading Page

Added more context at each step of the process, ensuring the customer understands the AI agent's value while they wait.

IMPACT

After releasing the UI/UX improvements, we saw

After releasing the UI/UX improvements, we saw

⬆️ 2,200

⬆️ 2,200

more feature page visits, up from 1,000

more feature page visits, up from 1,000

⬆️ 1,334

⬆️ 1,334

more users using the feature, up from 442.

more users using the feature, up from 442.

⬆️ 11%

⬆️ 11%

increase in conversion rate of users adding a prompt

increase in conversion rate of users adding a prompt

~ 5 hours

~ 5 hours

average user time saved through suggested topics

average user time saved through suggested topics

“

The suggested prompts saved me 75% of my time. So helpful! I love it.


~ Customer of >3 years

The suggested prompts saved me 75% of my time. So helpful! I love it.


~ Customer of >3 years

Next project

Next project

Driving 40% subscriber growth by designing recommendation setup for web form editor

Newsletter Recommendation System

Driving 40% subscriber growth by designing recommendation setup for web form editor

Newsletter Recommendation System

Next project

Driving 40% subscriber growth by designing recommendation setup for web form editor

Newsletter Recommendation System

Driving 40% subscriber growth by designing recommendation setup for web form editor

Newsletter Recommendation System

FINAL DESIGN

FINAL DESIGN

Final UI/UX Improvements

Final UI/UX Improvements

Feature Page

Feature Page

Feature Separation: The product team requested this feature be separate, but I ensured UI consistency.

  • UI Consistency: Matched background color and UI elements with the app.

  • UX copy: Chose the word "message" over "newsletter" to avoid confusion.

  • Suggested Topics: Introduced a full-width section for better flow and a vertical layout for user focus on one item at a time.

  • Visual Social proof: Provides customers with more relatable output examples.

Feature Separation: The product team requested this feature be separate, but I ensured UI consistency.

  • UI Consistency: Matched background color and UI elements with the app.

  • UX copy: Chose the word "message" over "newsletter" to avoid confusion.

  • Suggested Topics: Introduced a full-width section for better flow and a vertical layout for user focus on one item at a time.

  • Visual Social proof: Provides customers with more relatable output examples.

The Suggested Topics are AI-generated each session, so a clear loading state was essential.

I used a Skeleton component to ensure a smooth experience.

The Suggested Topics are AI-generated each session, so a clear loading state was essential.

I used a Skeleton component to ensure a smooth experience.

Loading Page

Loading Page

Provides more context at each step of the process, ensuring the customer understands the agent's value while they wait.

Provides more context at each step of the process, ensuring the customer understands the agent's value while they wait.