The first meeting with your product is crucial and the way you position it on your landing page matters more than you know. Potential customers want to know exactly what problem your product helps them solve, and they want to know it now.
This playbook gives you actionable insights into how to nail the positioning of your new, awesome product and build your first kickass landing page.
At Founders, we have built 50+ landing pages for companies such as Duuoo.io, Kontist, dixie.io and, most recently, samestate.co. We learned something new every time, so we decided to share what we’ve discovered from building landing pages for early-stage startups. Don’t worry, it’s not another step-by-step guide telling you what to do.
1) Nailing down the positioning for your new, awesome product
a. How to use the job-to-be-done framework
b. Answering the 5Qs
2) Building your first kickass landing page
a. Using the Founders landing page template
b. Creating simple, relevant copy
3) Checklist: make sure your basic hygiene factors are in place
a. The important stuff you forget
b. Get to know the Growth Machine
Your positioning is a short, simple description of the problem your product solves and the benefits people get when they use it. It’s important to have this in place before you start writing copy or building a new landing page. Your positioning is there to guide you in the right direction and make it easier to build your landing page.
There are a lot of different methods you can use to position your new, awesome product. We use the job-to-be-done (JTBD) framework to position startups at Founders. In short, it’s basically just about answering the question “Why do people hire your product to get the job done?”
The JTBD framework focuses on your product’s benefits instead of its features. So instead of focusing on what your customers get, you should focus on what your product will do for them, i.e. the ‘why’ instead of the ‘what’.
Let’s use Samestate.io as an example. Samestate.io is a SaaS startup company that records user sessions in web app products (read more about Samestate here). Instead of focusing on features like ‘Get real-time user recordings’ or ‘See users' full browser sessions’, we highlighted the benefits customers get from seeing user recordings, such as ‘Get complete customer insights to solve problems more efficiently’.
‘People don’t want products; they want solutions to problems. They don't want a drill; they want a quarter-inch hole.'
I bet your product has some awesome features, and it’s totally natural to want to focus on all the things your customers get when they buy your product. However, if they don’t understand exactly what they should use your product for, they don’t know why they should buy it.
That being said, you shouldn’t remove all the features from your landing page. Features are very important because they explain how you get the job done. You should focus on them after you have defined your product’s JTBD. We’ll get to that later.
So by focusing on the benefits people get from using Samestate, we ended up with this JTBD:
It sounds pretty straightforward, but there is much more to it. You just got the short version of JTBD. Intercom wrote a whole book about it. Check it out if you want to learn more about JTBD. There is some pretty good stuff in it.
It sounds pretty simple to fill out those blank spaces in the JTBD framework, but it actually requires some preparation and brainstorming. At Founders, we always start by answering a number of questions to kickstart our work. Inspired by Intercom, we have created our own Founders version which focuses on the positioning for early-stage startups.
Let’s take a look at some examples:
Who will use your product? You need to define the audience you will focus on for your first landing page, at least at the beginning. Doing so will help you position your product, especially if you have more than one audience.
For example, Samestate is relevant to both customer support and developers, but it’s very difficult to create a JTBD that covers both those audiences. The way you would communicate to each of those audiences is very different. So we started out by defining the JTBD for customer support and, when the time comes, we’ll define JTBD for developers.
Always remember that in your early-stage phase, it’s all about testing and experimenting to find out what works best for your new business. If one audience turns out to be wrong, you can always test a new one.
What problem are you solving for your customers? A good way to get an overview is to write down your customers’ pains (problems) and answer them with your customers’ gains (solutions). Write down all the pains and gains you can think of that are related to that specific audience.
Here’s an example with Samestate:
Customer pain: I spend too much time clarifying issues with customers vs. fixing problems.
Customer gain: Recordings of user sessions make it easy to see exactly what customers are doing and track their actions to solve problems faster.
Think about your peers and competitors. Then write down how you differentiate yourself from them and what makes your product win. You can do that by looking at their superpowers vs. yours (see Q5).
As an example, one of Samestate’s competitor is Fullstory. We use the same technology for recordings, but we focus on very different things. Samestate focuses on customer support, whereas Fullstory concentrates on customer experience. That means Samestate needs to highlight that in its positioning.
What job are people hiring your product to do? Use this framework to write down your JTBD. We always write down three to five JTBDs to find the perfect one. If you only write down one, you limit your creativity.What is the job people are hiring your product to do? Use this framework to write down your JTBD. We always write down 3-5 JTBDs to find the perfect one. If you only write one down, you limit your creativeness.
Make a short list of all your features that enable you to get the job done and solve your audience's problems.
For Samestate, we made a list of five to ten features and selected the three most important ones for getting the job done. One important thing we learned is to write down different versions and suggestions for each question instead of focusing too much on nailing the perfect sentence on our first try. Remember that you can narrow it down afterwards.
Get started with the 5 Qs (we made a pretty simple template for you to fill out)
This might seem like a lot of work and writing, and what’s it all for? Answering the 5 Qs really helps you stay focused and makes it easier to define your product’s JTBD and positioning. One of the great things about answering the 5 Qs is that you have an awesome starting point for creating your copy once you are done. You’ll realise that when you start creating your landing page draft, which we’ll get to later. For the superpowers we initially wrote for Duuoo, Dixie and Samestate, we pretty much used the same copy on their landing pages. However, please don’t focus too much on using the right formulations and wording when answering the 5 Qs. You will adjust them when you write the copy in your landing page template.
Download the template we use at Founders and get started answering the 5 Qs.
Remember to keep and share this document with your team. It’s a great way to get everyone in your company to understand the product and make sure you’re all on the same page.
Once you know how to position your product, it’s time to build your very first landing page to show off your new product. Your landing page is very important because it’s the first impression you give to potential customers. To stay within the JTBD reference, you can think of your landing page as your CV. When recruiters screen resumes, they only spend five to seven seconds looking at each one before they decide whether a candidate is perfect for a job.
'You only have 15 seconds to capture your visitors’ attention before they drop off your landing page.'
So how do you build your first landing page? Figuring out how to structure your first landing page when you’re starting from scratch can be a bit confusing. There’s no need to panic, though — we created a landing page template based on our hands-on experience.
Our landing page template gives you a structure for all the sections and elements you need for your first landing page. We use it when we build landing pages for Founders startups. It is a pretty straightforward template that’s just a one-page document listing the sections and basic elements you need on your first landing page.
We keep the landing page template in a Google Doc. It’s much easier for you and your team to edit and add comments instead of editing directly in your CMS or HTML code. It’s also a great way to get an overview of your landing page before you start developing. It’s all gathered in one place, and once your copy is done, you can just copy and paste it into your CMS. Download the landing page template here.
The sections are as follows:
The menu makes it easy for your visitors to navigate your landing page. Since you only will build one landing page to begin with, you can create a sticky navigation menu that sticks to the page when visitors are scrolling. That way, it’s easy for visitors to navigate and find the info they need.
This is the title of your landing page — the one sentence that should capture your visitors’ attention and make them curious. Remember, you don’t have much time to convince them. The hero attracts attention and makes people curious.
There are many ways you can do that. We do it by asking a question the visitor can’t say no to or by highlighting the solution to their problems.
Here are some examples from landing pages we’ve built. Samestate makes customer support more efficient. So we ask visitors if they want ‘support superpowers’. If you work in customer support, it’s hard to say no to that, right? On Duuoo’s landing page, we focus on the solution to managers’ problems/desires: ‘Become a better manager’.
We also add a subhero that explains the product’s benefits; it’s based on the JTBD. Remember that the JTBD isn’t your headline — it’s something that guides you in everything you create for your new landing page. If you look at Samestate’s subhero, it’s pretty close to its JTBD. Remember to keep it short and simple since you don’t have much time to make your message sink in.
This magic button on your landing page makes visitors click and complete your goal, e.g. ‘download ebook’ or ‘sign up for waiting list’. For your first landing page, you need to decide what you want your goal to be. Is it to get trial users, build an email list or generate leads?
No matter which CTA you decide to use, the most important thing is that you have multiple clear CTAs throughout the page. We typically insert CTAs at the top, middle and bottom of the landing page. Remember to set up event tracking codes to see which button generates the most signups (we’ll talk more about that later). It’s also vital that you make it super easy for people to sign up. We learned this the hard way with dixie.io. At Dixie.io, we had a signup form where we asked people for too much information, such as their name, company, phone number and email. Asking for this sort of information is different when visitors are buying something on your landing page. However, if they’re just signing up for a free ebook or demo, they don’t want to give you all their information. After we simplified the signup form to only ask for email addresses, we immediately got more signups because it’s easier and more convenient for visitors to sign up.
From the landing pages that we built, we also learned that the best way to get signups is to offer visitors something for free or to make them feel special.
The number of companies that use videos for their products has increased, and people now prefer watching videos instead of reading long texts. So having a short video on your landing page that explains how your product works is pretty essential because it helps people understand your product. According to wyzowl, 91% of consumers have watched an explainer video to learn about a product or service.
Duuoo’s great example of one of these types of videos.
There are different ways to create videos depending on your budget and skills. If you are pretty new to it, Intercom has made a short, simple guide on how to do it yourself.
These are your key product features. We call them superpowers because they enable you to get the job done and solve your customers’ problems.
At the beginning of this playbook, I wrote that you shouldn’t focus on your product features, but it’s time to do it now. Your product features play an important role on your landing page. They show how your product helps get the job done.
I bet your product has a lot of great features that you want to tell the whole world about, but for this section, you only get to choose the three most important/essential features that get the job done. These are the three features that your product can’t survive without. HINT: Start by taking a look at the features you chose in Q5.
Here are the superpowers we came up with for Samestate:
1: Real-time recording
2: Simple communication between customers and developers
3: Intercom integration
Samestate also notifies you when bugs have been fixed, but that’s not vital for getting the job done.
To illustrate superpowers, we use this structure:
Example of superpowers from Samestate’s landing page:
Contact
Add contact details in the footer or install a chat system. This allows people to get in touch with you if they have any questions about your product.
We added an Intercom chat to all the landing pages we have built. It’s not only a great way to get in touch with your customers but also a super awesome way to get insights about how to optimise your landing page. For example, Dixie.io got a lot of questions about its pricing model, which made us realise that we should optimise the way we explained some elements in the pricing model.
You might have noticed that our template doesn’t contain sections for pricing, team members or customers. Aren’t they relevant? Yes, but not on your first landing page. As you grow your product/company, you’ll automatically add sections such as these to your website.
Download the landing page template here
The most important thing to remember about your copy is that it should be focused, relevant and understandable. We nailed down five tips for you to follow when creating copy for your website.
“Simplicity is the ultimate sophistication" – Leonardo Da Vinci
You are now ready to copy and paste your landing page draft and set up your very first landing page. You have two options: 1) hardcode your landing page, or 2) build your landing page in a content management system (CMS). The option you choose really just depends on who’s responsible for maintaining the landing page. At Dixie.io, we started out with a hardcoded landing page, but we learned that it required too much work when those responsible don’t have hardcoding skills. When that’s the case, it’s easier to build the landing page in a CMS so those responsible can make the changes themselves when implementing small changes, such as fixing misspellings, adding new copy, etc. Keep in mind that this landing page is your first version, and you’ll change and update it several times as your company grows and develops. So decide who will be responsible for maintaining it before you decide where to build your landing page — it will save you a lot of work.
There are a lot of CMSs out there, such as Webflow, Unbounce and Wordpress. At Founders, we use Webflow because it’s super simple to build good-looking, responsive landing pages without writing code.
Before you launch your new, awesome landing page, you need to make sure you have the following in place:
Make sure to implement a Google Analytics script on your new landing page to track traffic, events, goal conversions, etc. Whatever you do, don’t forget to create and implement event tracking codes for each CTA button and set up goals in Analytics. That way, you can keep track of your signups and see exactly which button visitors clicked on when they took various actions, such as signing up.
It’s free, so there is no excuse not to do it! You can create a free Analytics account right here. We also wrote a playbook to get you started with Analytics.
What happens when people sign up on your landing page? If you don’t already know, the first step is to make sure you have a place to collect emails from your signups. You also need to have a signup flow ready so you can send out customised confirmation emails, e.g. to thank your signups for downloading your ebook, providing further info for the demo they signed up for, etc. Customised emails are also a great way to show your product’s personality. In addition, remember to create a ‘Thank you page’ when people sign up.
All you need for this is an email marketing platform. MailChimp is super user-friendly platform and a great way to start. Create your free account right here — did I mention it’s free if you have fewer than 2,000 subscribers?
At Founders, we started using Campaign Monitor to make the signup process shorter because we can easily remove the opt-in emails our customers get when they sign up and we can create customised ‘Thank you for signing up’ pages. That isn’t possible with MailChimp.
There are a lot of reasons why you should implement responsive web design. Here I’ll restrict myself to three reasons that should convince you about the importance of responsive web design:
1: Mobile usage is exploding
2: More people shop and research via mobile devices
3: Responsive landing pages provide a much better user experience
FYI: It’s pretty easy to create responsive web designs in webflow. See it for yourself.
When launching a new landing page, traffic is typically pretty low at the beginning, and it can be difficult to get a feel for visitors’ behaviours just from Google Analytics. Hotjar’s web session recordings are nice to have because they give you much more detailed insights into your visitors’ behaviours. The tool stores user sessions on video and enables you to ‘re-live’ user sessions. It also records all clicks, taps, scrolls and moves on your website and displays them on heatmaps. Try it out for free here.
This is a great platform for getting your first customers. It gives you access to a community of early adopters, i.e. those who build and break the startup scene for mobile apps, websites, hardware projects and tech creations. This is a community for new tech-related products.
Read our playbook to learn how we got four top-ranking startups on Product Hunt.
You have an awesome landing page, and you can’t wait to show it to the whole world. So now what do you do? You can either sit down and wait for people to find it themselves, or you can get started with all the fun stuff: experimenting!
In the early-stage phase, you need to test and experiment with different marketing activities to find the magic moment for generating leads, turning them into customers and growing your business. You need to find your way out of the dark.
For that purpose, we built Growth Machine. Growth Machine is an operational process for executing marketing activities and ensuring a structured approach. It focuses on learning and understanding the reasons behind success and failure, i.e. the ‘why’. Get started with Growth Machine.
To position your new product, it is absolutely key to first define your product’s job-to-be-done! The best way to get you started with that is by answering the 5 Qs. This might seem like a lot of work and writing, but answering these five questions really helps you stay focused and makes it easier to position your product.
To build your first landing page, you need a structure and some killer copy. By following Founders’ simple template, you can make sure you have all the basic elements you need on your first landing page.
Once you are done, don’t forget to set up tracking on your landing page, build a signup flow and build a responsive website.
Enjoy!
This whole playbook is based on our hands-on learnings from building +50 landing pages, the great work the guys at Intercom did when building landing pages and firstround’s.