When Clicks Don’t Convert: What We Learned

When Clicks Don’t Convert: What We Learned

Redesigned Jira’s Paid Product Tour hero to improve clarity and conversions. The new layout drove more top-of-funnel engagement, but revealed a key insight: clicks alone don’t guarantee signups.

Product

Jira Software

What I did

Product Design

my role

Deign lead

Timeline

6 Weeks

The Why

The Why

Atlassian invested heavily in paid ads to drive traffic to Jira’s Product Tour page, but conversions stayed low. The existing hero paired a static product screenshot with an embedded signup form—drawing clicks, but not commitment. Building on insights from our earlier interactive demo experiment, we tested whether reordering the layout and refining visuals could improve signup quality.

Atlassian invested heavily in paid ads to drive traffic to Jira’s Product Tour page, but conversions stayed low. The existing hero paired a static product screenshot with an embedded signup form—drawing clicks, but not commitment. Building on insights from our earlier interactive demo experiment, we tested whether reordering the layout and refining visuals could improve signup quality.

Atlassian invested heavily in paid ads to drive traffic to Jira’s Product Tour page, but conversions stayed low. The existing hero paired a static product screenshot with an embedded signup form—drawing clicks, but not commitment. Building on insights from our earlier interactive demo experiment, we tested whether reordering the layout and refining visuals could improve signup quality.

The Why

Atlassian invested heavily in paid ads to drive traffic to Jira’s Product Tour page, but conversions stayed low. The existing hero paired a static product screenshot with an embedded signup form—drawing clicks, but not commitment. Building on insights from our earlier interactive demo experiment, we tested whether reordering the layout and refining visuals could improve signup quality.

Project Constraints

Project Constraints

This experiment ran on a high-spend marketing funnel, so changes needed to be lightweight, reversible, and data-driven. With limited engineering bandwidth, the scope was constrained to redesigning the hero section using existing design patterns, while carefully monitoring conversion metrics to minimize risk.

This experiment ran on a high-spend marketing funnel, so changes needed to be lightweight, reversible, and data-driven. With limited engineering bandwidth, the scope was constrained to redesigning the hero section using existing design patterns, while carefully monitoring conversion metrics to minimize risk.

High ad spend

Traffic volume was critical; small % changes mattered.

Hero section only

Constrained to above-the-fold experience.

System reuse

Had to stay within Atlassian's existing components.

This experiment ran on a high-spend marketing funnel, so changes needed to be lightweight, reversible, and data-driven. With limited engineering bandwidth, the scope was constrained to redesigning the hero section using existing design patterns, while carefully monitoring conversion metrics to minimize risk.

High ad spend

Traffic volume was critical; small % changes mattered.

Hero section only

Constrained to above-the-fold experience.

System reuse

Had to stay within Atlassian's existing components.

Project Constraints

This experiment ran on a high-spend marketing funnel, so changes needed to be lightweight, reversible, and data-driven. With limited engineering bandwidth, the scope was constrained to redesigning the hero section using existing design patterns, while carefully monitoring conversion metrics to minimize risk.

High ad spend

Traffic volume was critical; small % changes mattered.

Hero section only

Constrained to above-the-fold experience.

System reuse

Had to stay within Atlassian's existing components.

Before
After

Process

2. Wireframes
Explored layout variations to separate the signup form from the product shot and highlight value props.

  • Partnered with Content Design to refine messaging hierarchy and tested multiple hero arrangements.

Design Process

1. Audit
Reviewed analytics and heatmaps, saw users clicking hero CTAs but dropping later in the funnel.

  • Identified that the static screenshot + signup form combo was competing for attention and misaligned expectations.

2. Wireframes
Explored layout variations to separate the signup form from the product shot and highlight value props.

  • Partnered with Content Design to refine messaging hierarchy and tested multiple hero arrangements.

Fully Responsive

Explored layout variations to separate the signup form from the product shot and highlight value props.

3. Hi-Fi Designs
Built new hero concepts using Atlassian’s design system, extending patterns for CTAs and visuals.

  • Expanded: Created design variants with different product imagery, button placements, and microcopy emphasis.

Customize

Everything

Built new hero concepts using Atlassian’s design system, extending patterns for CTAs and visuals.

Design Process

1. Audit
Reviewed analytics and heatmaps, saw users clicking hero CTAs but dropping later in the funnel.

  • Identified that the static screenshot + signup form combo was competing for attention and misaligned expectations.

1. Audit
Reviewed analytics and heatmaps, saw users clicking hero CTAs but dropping later in the funnel.

  • Identified that the static screenshot + signup form combo was competing for attention and misaligned expectations.

2. Wireframes
Explored layout variations to separate the signup form from the product shot and highlight value props.

  • Partnered with Content Design to refine messaging hierarchy and tested multiple hero arrangements.

Fully Responsive

Explored layout variations to separate the signup form from the product shot and highlight value props.

3. Hi-Fi Designs
Built new hero concepts using Atlassian’s design system, extending patterns for CTAs and visuals.

  • Expanded: Created design variants with different product imagery, button placements, and microcopy emphasis.

Customize

Everything

Built new hero concepts using Atlassian’s design system, extending patterns for CTAs and visuals.

What we learned

What we learned

Early Success Did Not Translate to Final Conversions

Despite strong performance in early metrics, both treatments saw a drop in overall signup rates compared to the control:


Treatment A:
A significant decline in signup rates, indicating that while users engaged with the redesigned elements, they struggled to complete the process.

Treatment B:
A smaller, statistically insignificant drop in signup rates, hinting at a more balanced design but still failing to achieve a net positive impact.

Early Success Did Not Translate to Final Conversions

Despite strong performance in early metrics, both treatments saw a drop in overall signup rates compared to the control:


Treatment A:
A significant decline in signup rates, indicating that while users engaged with the redesigned elements, they struggled to complete the process.

Treatment B:
A smaller, statistically insignificant drop in signup rates, hinting at a more balanced design but still failing to achieve a net positive impact.

Early Success Did Not Translate to Final Conversions

Despite strong performance in early metrics, both treatments saw a drop in overall signup rates compared to the control:


Treatment A:
A significant decline in signup rates, indicating that while users engaged with the redesigned elements, they struggled to complete the process.

Treatment B:
A smaller, statistically insignificant drop in signup rates, hinting at a more balanced design but still failing to achieve a net positive impact.

What we learned

Early Success Did Not Translate to Final Conversions

Despite strong performance in early metrics, both treatments saw a drop in overall signup rates compared to the control:


Treatment A:
A significant decline in signup rates, indicating that while users engaged with the redesigned elements, they struggled to complete the process.

Treatment B:
A smaller, statistically insignificant drop in signup rates, hinting at a more balanced design but still failing to achieve a net positive impact.

Treatment A

0%

Account
Creation

0%

Viewed Email
OTP Screen

-0%

Signups

Changes:

  • Moved the product shot to the right and the redesigned signup form to the left.

  • Increased the size and prominence of the product shot.

  • Outcome: Despite positive interaction metrics, the overall signup rate decreased significantly compared to the control.


Treatment B

0%

Account
Creation

0%

Viewed Email
OTP Screen

-0%

Signups

Changes:

Same setup as Treatment A with two additional elements:

  • An animated product shot to enhance engagement.

  • Social proof below the signup form.

  • Outcome: Smaller signup rate decrease (not statistically significant) compared to the control.


Final Design

Key Design Changes:

  • Redesigned Signup Form: Made it compact to free up space in the hero section.

  • Larger Product Shot: Enhanced product visualization with an animated product shot, highlighting key features.

  • Interactive Components: Included dynamic elements like social proof to increase engagement.

  • Addressing User Pain Points:

    • Reduced the dominance of the signup form to present product values more clearly.

    • Improved the balance of information and visuals, aligning user needs with business objectives.

Final Design

Key Design Changes:

  • Redesigned Signup Form: Made it compact to free up space in the hero section.

  • Larger Product Shot: Enhanced product visualization with an animated product shot, highlighting key features.

  • Interactive Components: Included dynamic elements like social proof to increase engagement.

  • Addressing User Pain Points:

    • Reduced the dominance of the signup form to present product values more clearly.

    • Improved the balance of information and visuals, aligning user needs with business objectives.

Final Design

Key Design Changes:

  • Redesigned Signup Form: Made it compact to free up space in the hero section.

  • Larger Product Shot: Enhanced product visualization with an animated product shot, highlighting key features.

  • Interactive Components: Included dynamic elements like social proof to increase engagement.

  • Addressing User Pain Points:

    • Reduced the dominance of the signup form to present product values more clearly.

    • Improved the balance of information and visuals, aligning user needs with business objectives.

Final Design

Key Design Changes:

  • Redesigned Signup Form: Made it compact to free up space in the hero section.

  • Larger Product Shot: Enhanced product visualization with an animated product shot, highlighting key features.

  • Interactive Components: Included dynamic elements like social proof to increase engagement.

  • Addressing User Pain Points:

    • Reduced the dominance of the signup form to present product values more clearly.

    • Improved the balance of information and visuals, aligning user needs with business objectives.

Reflection

Learnings:

  • A visually engaging and balanced hero section can attract users and encourage initial interaction.

  • Improving the middle and bottom funnel experiences is crucial to converting initial engagement into completed signups.

  • Next Steps:

    • Enhance the "Name Your Site" experience to reduce drop-offs and align top-of-funnel improvements with overall conversion goals.

    • Combine insights from Treatments A and B to refine the hero section further.

Reflection

Learnings:

  • A visually engaging and balanced hero section can attract users and encourage initial interaction.

  • Improving the middle and bottom funnel experiences is crucial to converting initial engagement into completed signups.

  • Next Steps:

    • Enhance the "Name Your Site" experience to reduce drop-offs and align top-of-funnel improvements with overall conversion goals.

    • Combine insights from Treatments A and B to refine the hero section further.

Reflection

Learnings:

  • A visually engaging and balanced hero section can attract users and encourage initial interaction.

  • Improving the middle and bottom funnel experiences is crucial to converting initial engagement into completed signups.

  • Next Steps:

    • Enhance the "Name Your Site" experience to reduce drop-offs and align top-of-funnel improvements with overall conversion goals.

    • Combine insights from Treatments A and B to refine the hero section further.

Reflection

Learnings:

  • A visually engaging and balanced hero section can attract users and encourage initial interaction.

  • Improving the middle and bottom funnel experiences is crucial to converting initial engagement into completed signups.

  • Next Steps:

    • Enhance the "Name Your Site" experience to reduce drop-offs and align top-of-funnel improvements with overall conversion goals.

    • Combine insights from Treatments A and B to refine the hero section further.

  • More Works More Works

  • More Works More Works

bystrom

bystrom

bystrom

bystrom

bildkritik

Go Back To Top

bildkritik

Go Back To Top