Overview
Driving Engagement – Lead Page Design for Demo Request
[Product Name Confidential] is a product suite that includes diagnostic and instructional tools for math and reading for K-8 students. It uses data from adaptive assessments to create individualized learning pathways for each student. My role was to research, design, and develop a dedicated landing page to capture product demo requests. I collaborated with Sales, Content, and the Director of Digital Marketing to launch this new page.
Roles: Lead UX Design, Content Writer, UI Design
Tools & Methods: User Interviews, Competitive Research, User Personas, Accessibility, Brainstorm and sketch, Wireframe, Figma, XD, CrazyEgg
Key Performance Metrics: over 1000 new leads following launch, over 300 leads daily, 2nd most interacted with page and form with over 62,808 views compared to an average form view of 272.3
Understanding the Need
SME Interview
Recognizing the potential benefits for both sales and users, I immediately jumped into the research phase. This involved conducting an in-depth interview with the Business Development Team Leader. Through this process, I aimed to gain insights into the existing demo request systems, comprehensively map the user journey from request to demo initiation, and understand user expectations and pain points.
“In our current process, there’s no clear-cut method to capture demo requests. Sometimes they come through the website, calls, word of mouth, campaign reach, or by reaching out to reps.”
Competitive Research
I researched competitor and adjacent websites to understand their content, flow, and positioning. This investigative approach provided valuable insights that informed our content strategy, user flow, and overall positioning. I identified common patterns that could work successfully for a high-impact lead generation page, such as highlighting the product benefits and using images that users can relate to and see themselves in.
User Personas
Drawing from the insights garnered through my research, I crafted user personas by distilling the customer insights gleaned from the SME interview. These personas played a pivotal role in shaping my design choices, offering a clear and relatable representation of potential users such as teachers, parents, and school administrators who could benefit from [Product Name Confidential.]
While there are a variety of visitors coming to the site, I developed personas based on those most likely on the demo request journey, an instructional coach often tasked with sourcing learning solutions to enhance educational outcomes. A less obvious but necessary persona to consider is office admins, such as a secretary or executive assistant. While they are not directly in charge of the decision-making, they are often tasked with following up on requests made by the school leaders.
Designing for Impact
Accessibility
Making inclusivity a paramount concern, I integrated meticulous accessibility considerations into the design process. As the accessibility lead on the team, I diligently adhered to WCAG guidelines. This encompassed assigning alt text to images, meticulously ensuring text contrast standards, offering diverse avenues for content interaction, including captioned videos, and guaranteeing that all page components were readily accessible via keyboard inputs.
Brainstorm & Sketch
Armed with a clearer understanding of our users and their requirements, I engaged in a brainstorming session to conceptualize ideas for the redesigned landing page. Simultaneously, I also introduced an integrated Thank You page to delve into many possibilities regarding layouts and content arrangements. This process aimed to unearth ways to showcase our product best and cater to user preferences. Below are the initial design layouts.
One of the significant design decisions I faced was form placement. Would it be better to draw visitors in first and lead them to take action or present the action and then support that action through the content that follows?
Wireframes
Building upon the sketches as solid groundwork, I developed comprehensive wireframes that delineated the flow and content for both the landing page and the Thank You page.
We took a smart approach before starting the high-fidelity design phase to ensure we were all on the same page and that the design would work well.
For the landing page I thought carefully about user content needs when it comes to facilitating decision making. Key methods for this included highliging the prodcut benefits, providing social proof, story telling, and set expectations by providing the next steps.
For the thank you page, I thought about ways to keep the user present and interacting with the site to continue to build anticipation and help them confirm that our products and services are the right solution for them.
Content Writing
In conjunction with the design phase, I dedicated effort to curating captivating content for both the landing page and the Thank You page. Following the creation of initial drafts, I engaged in a collaborative effort with the Content team. We aimed to sculpt clear, succinct messaging that resonated deeply with our intended audience.
This process was really important in showing how valuable [Product Name Confidential] can be and making sure both teachers and students understand its benefits.
Hifi Design
With those detailed wireframes as my guide, I rolled up my sleeves and got into the nitty-gritty of crafting the high-fidelity design for the landing page. This process encompassed carefully curating a color scheme that aligned with the brand identity and fit within our CMS's design constraints. Additionally, I integrated relatable visuals that users can see themselves in and clear headings and Call-to-Action (CTA), making it easy for users to jump into action..
Results and Learnings
Live Page & Analytics Report
After finishing the design and getting the green light, I jumped into action and brought the landing and thank you pages to life using our content management system, enhanced with some custom code. Once everything was approved after a couple of rounds of editing and in-house testing, the page was ready for launch.
To keep tabs on how users interacted with the pages, I requested CrazyEgg analytics to give us insight into user behavior, interactions, and how engaged they were on the page.
For initial launch the live page was close to the mockup design, data gathered from analysitcs would determine if this was the right move.
Unveiling the Data & User Engagement
So, how did things play out in the real world? Let's dive into the numbers and see how users interacted with our revamped landing page.
Pardot Data
The impact of the freshly minted landing page was nothing short of remarkable. Here's a rundown of our impressive achievements:
In the very first quarter after launch, despite some initial technical hiccups, we generated over 1000 new leads within the opening two weeks.
The landing page drew in more than 300 leads daily, showcasing an impressive level of engagement.
Over the eight months following its launch, our demo request form stood out among the crowd. Among the 150+ forms scattered across our corporate website, it soared to become the second most viewed form site-wide. With a staggering 62,808 views, this level of interaction far outshone the modest average form view count of 272.3.
User Engagement Insights from CrazyEgg
Delving into CrazyEgg analytics revealed some intriguing user behaviors that caught our attention:
It turned out that even after landing on the Demo Request page, users still gravitated towards the "Try [Product Name Confidential]" button in the top left corner. The fix? We realized the need for a more precise heading that reassured users they were indeed on the demo request page.
Our step-by-step section unveiled a” few "rage clicks" instances on those blue number circles. The solution? We decided to ditch the blue circles in favor of regular numbers, offering users a more intuitive and frustration-free experience.
Our journey toward creating an impactful landing page brought us impressive stats and invaluable insights into user behavior. Through a combination of data and user engagement revelations, we fine-tuned our approach and paved the way for a more seamless user experience. On a personal note, managing this project was a helpful experience in learning to be flexible and avoid being married to the design. While I may think the solutions I’ve devised makes complete sense, feedback from users directly or through heatmap data can say otherwise, highlighting the need always to be open to iteration and improvement.