Formbricks Documentation

The Product-Market Fit survey (or Sean Ellis Test) is a method to measure Product-Market Fit.

Purpose

By assessing how disappointed users would be if they could no longer use your service you get a good idea of how well your current product fits your target market.

Measuring it allows you to optimize it.

Formbricks Approach

Higher conversion: In-app surveys convert significantly better than email surveys
Pre-segment user base: Only ask users who experienced the value of your product
Specific dashboard: Understand your data right, separate signal from noise by design
Targeted approach: Personally address users with their name (if you have it)
Measure continuously: Feel the pulse of your user base consistently
No UI clutter: Natively embed the survey for best possible UX
Never ask twice: Assure to not survey users twice

Preview

Installation

To add the Product-Market Fit Survey to your app, you need to perform these steps:

Create new survey at app.formbricks.com
Embed JS snippet in <head>
Configure survey
Render in-app

1. Create new survey

Create an account at app.formbricks.com

Then, create a new Product-Market Fit Survey:

Go to the "Setup instructions" tab and locate your survey ID. You'll need it in a minute:

2. Embed Formbricks snippet in `<head>`

Embed the following Product-Market Fit Survey script in your HTML <head> tag.

Replace the formId with survey Id from the Formbricks dashboard:

<script src="https://cdn.jsdelivr.net/npm/@formbricks/pmf@0.1" defer></script>

<script>
  window.formbricksPmf = {
    ...window.formbricksPmf,
    config: {
      formbricksUrl: "https://app.formbricks.com",
      formId: "SURVEY ID HERE", // paste your survey ID here
      containerId: "formbricks-pmf", // required to render survey in your page
    },
  };
</script>

All you have to do now is assigning the containerId to the div where you want to render your survey (detailed instructions linked at the bottom):

<div id="formbricks-pmf"></div>

3. Configure survey

Sending user metadata with submission

The Product-Market Fit Survey is built for in-app experiences. We assume that you already have user properties stored in a session object. It makes sense to send them to Formbricks to enrich the user profile in the user view. Later on, you will be able to create cohorts to survey based on user properties.

Here is an example of how to take metadata from the next.js Session Object and pass it to Formbricks:

window.formbricksPmf = {
  ...window.formbricksPmf,
  config: {
    // ...
    customer: {
      email: "", // fill dynamically
      name: "", // fill dynamically
    },
  };
},

Note: the email field must be present in the customer object

Styling

You can style the Product-Market Fit Survey to match your UI. We recommend to at least replace the brand color with your main color.

window.formbricksPmf = {
  ...window.formbricksPmf,
  config: {
    // ...
    style: {
      brandColor: "#00c4b8",
    },
  };
},

Here are all variables you can set with the current defaults:

style: {
  brandColor: "#00c4b8",
  borderRadius: "0.4rem",
  containerBgColor: "#f8fafc",
  textColor: "#0f172a",
  buttonTextColor: "#ffffff",
  textareaBorderColor: "#e2e8f0",
},

Example config

Here is an example of a full config object:

window.formbricksPmf = {
  ...window.formbricksPmf,
  config: {
    formbricksUrl: "https://app.formbricks.com",
    formId: "cldetkpre0000nr0hku986hio",
    containerId: "formbricks-pmf-survey", // always needed
    customer: {
      id: "", // fill dynamically
      name: "", // fill dynamically
      email: "", // fill dynamically
    },
    style: {
      brandColor: "#00c4b8",
      borderRadius: "0.4rem",
      containerBgColor: "#f8fafc",
      textColor: "#0f172a",
      buttonTextColor: "#ffffff",
      textareaBorderColor: "#e2e8f0",
    },
  },
};

4. Render survey in your app

To add the Product-Market Fit Survey to your UI, you can use different wrappers. Please follow the instructions linked below:

Modal
Inline