Template Tutorial

Build a product feedback form

Collecting structured feedback from your users is one of the most valuable things you can do after launching a product. This tutorial shows you how to create a feedback form that captures a rating, what went well, what needs improvement, and an optional email for follow-up.

What you will build

A form with four fields: rating (select), what went well (textarea), what to improve (textarea), and email (optional).
A structured format that makes it easy to spot patterns across many responses.
Honeypot spam protection to filter out bot submissions.
Notifications so you can act on feedback quickly.

Create the form in your dashboard

Log in to your BForms dashboard and click New Form. On the Settings tab, name it something like Product Feedback or User Feedback.

Set a redirect URL

In the Redirect URL field, enter the URL of a thank-you page. Since feedback forms are usually shown inside your app, this might redirect back to the dashboard or a "Thanks for your feedback" page:

example

https://yourapp.com/feedback/thanks

If you plan to submit the form via JavaScript (no page reload), you can leave this empty and show a success message inline instead.

Add your fields

Switch to the Fields tab. A good feedback form balances structured data (the rating) with open-ended questions that let users explain their thinking.

SelectRatingRequired

A 1-5 rating gives you a quick quantitative signal. Easy to aggregate and track over time.

1 - Very poor2 - Poor3 - Okay4 - Good5 - Excellent

TextareaWhat went well?

Open-ended positive feedback. Helps you understand what to keep doing and what resonates with users.

TextareaWhat could be improved?

Open-ended constructive feedback. This is where you find your most actionable insights.

EmailEmail (optional)

Optional. Lets you follow up with the user for clarification. Mark this as not required so it doesn't discourage anonymous feedback.

Why two separate text fields instead of one?

Asking "what went well" and "what to improve" separately prompts more thoughtful responses than a single "any feedback?" box. It also makes it easier to categorize responses in your dashboard — you can scan the "improve" column to find pain points without reading every full response.

Enable spam protection

Back on the Settings tab, set a Honeypot Field name. Even if the form is only shown to logged-in users, bots can still find and submit to the endpoint directly. The honeypot adds a safety net.

Use the default _honeypot or choose your own name. The hidden field is included in the HTML snippet below.

Configure allowed domains

In the Allowed Domains field, add the domain where your app runs. If the feedback form is only available inside your app, this is an important layer of protection:

allowed domains

yourapp.com

Embed the form

Click Create Form and copy the HTML snippet below. Replace your-form-slug with the actual slug from your dashboard.

feedback.html

<form action="https://bforms.dev/api/f/your-form-slug" method="POST">
  <label for="rating">How would you rate your experience?</label>
  <select id="rating" name="rating" required>
    <option value="">Select a rating</option>
    <option value="1">1 - Very poor</option>
    <option value="2">2 - Poor</option>
    <option value="3">3 - Okay</option>
    <option value="4">4 - Good</option>
    <option value="5">5 - Excellent</option>
  </select>

  <label for="what_went_well">What went well?</label>
  <textarea id="what_went_well" name="what_went_well" placeholder="Tell us what you liked..."></textarea>

  <label for="what_to_improve">What could be improved?</label>
  <textarea id="what_to_improve" name="what_to_improve" placeholder="Tell us what could be better..."></textarea>

  <label for="email">Email (optional)</label>
  <input type="email" id="email" name="email" placeholder="you@example.com" />

  <!-- Honeypot field - do not remove -->
  <input type="text" name="_honeypot" style="display:none" tabindex="-1" autocomplete="off" />

  <button type="submit">Send Feedback</button>
</form>

In-app feedback with JavaScript

If the feedback form lives inside your app, you probably want to submit it via the fetch API to avoid a full page reload. Use the JavaScript snippet from your dashboard. After a successful submission, show a toast or success message inline and optionally close a modal.

Enable notifications

For a feedback form, notifications are especially useful. Set up an email notification channel so your product team sees new feedback as it comes in. This lets you act on critical issues quickly rather than checking the dashboard periodically.

Test your form

Before making the form available to your users, verify the following:

Submit test feedback with different ratings and confirm all fields appear correctly in the dashboard.
Submit without an email to confirm the optional field works.
Verify the redirect or inline success message works as expected.
Test the honeypot to confirm spam submissions are discarded.

Tips and next steps

Time it right

Show the feedback form after a meaningful interaction — after a user completes a task, finishes onboarding, or has been active for a week. Avoid interrupting core workflows.

Track the page or feature

Add a hidden input with the page or feature name so you know what the user was doing when they submitted. Example: <input type="hidden" name="feature" value="dashboard" />

Review regularly

Set a weekly cadence to review feedback in your BForms dashboard. Look for patterns in ratings and recurring themes in the text fields.

Follow up on low ratings

When someone leaves a 1 or 2 star rating with an email, reach out within 24 hours. Users who feel heard often become your strongest advocates.

Newsletter tutorial Bug report tutorial