What was the problem/opportunity?

When I first took over the marketing manager role, our website sucked. Made by an external agency & you could tell.

The was the old hero section:

It spoke to no one, made most visitors bounce, and the demos that did book were confused about the offering until after they met with us.

I wanted to build an improved version in-house. The goal was to make our first impression on the world an exciting one.

Something that connected with our ICP immediately and made you WANT to scroll further.

This was the result:

Here’s how I built it from the ground up in 4 weeks👇

Who were we talking to?

Remote B2B full-cycle AE’s who wanted to learn how to improve their discovery/demo meeting experience & sales leaders who were looking to improve processes and train their reps on new strategies and each deal stage.

What teams were involved?

I worked with a freelance designer to create the layout/imagery and a Webflow implementation specialist to push the site live.

How was success measured?

Our north star was visits to the home page and conversions to trials/demos. Direct, organic, referral, or paid.

We tracked everything through Google Analytics, Google Tags, Crazy Egg, Ahrefs, and Typeform.

What was the outcome?

Total home page traffic averaged around 3.6k/month, 43.2k/annually. A 300% increase YoY.

Inbound visit-to-demo/trial conversion rate averaged 4.37%/month total.

What was the strategy?

The Hero Section (Above the Fold)

Trust needed to be established immediately when you landed on the home page.

So I created a conversion-focused hero section that, in one scroll, connects:

• Tangible pain from user quotes (’You can’t afford bad meetings/demos/interviews/etc.’)

• Trust (customer reviews)

• A visual explanation (clickable GIF that takes you to an interactive demo)

The lines from the header logo through the hero were designed to guide the eye subtly.

Reviews were placed above the fold and on a carousel to keep you there for a second longer.

Each CTA button was linked to an embedded Typeform popup.

Leading prospects through a simple, yet detailed journey to either get started with a free trial as a single user or book a call with our sales team.

The Interactive Demo

Ungated interactive demos are a game-changer for product-led, sales-supported models.

Here is our interactive demo GIF, teasing the Zoom app & drawing you to click the button:

After clicking the button, you were taken to a real Pickle recording share page containing a demo recording I made with our sales team.

Enabling you to click around & experience how Pickle highlights key meeting moments like this:

Here is the demo walkthrough video we made:

Differentiator Section (Below the Fold)

This section grabbed your attention with a large graphic & established our unique point of view without diving into the details yet.

We continued to build trust and confidence with customer logos and our current integrations.

Benefits Section

I highlighted words our customers used when describing how Pickle has benefited them.

Avoiding the ‘feature dump’ as much as possible, including related quotes & engaging copy.

This was the format for each one:

How to Start Section

By this point, a visitor who scrolled this far without booking a demo was asking ‘How does this product work?’

So a plain text walkthrough demonstrates how fast they can get started. Including another accompanying user quote, because they are the stars of the show.

FAQ Section

Towards the bottom, we included the top lingering frequently asked questions a visitor might have.

The ‘Chat with us!’ button pops up a chat window if they have something more specific to ask.

The Footer

I tied some targeted keyword landing pages in the footer to improve our SEO with consistent internal linking across the site.