import Image from "next/image";
import LayoutMdx from "@/components/shared/LayoutMdx";
import NewsletterSignup from "@/components/shared/NewsletterSignup";
import HeaderImage from "../weekly-update-181122/weeklyupdate.png";
import ResponsiveEmbed from "react-responsive-embed";

import CDetail from "./customer-detail.png";
import CXM from "./customers-xm.png";
import Box1 from "./feedback-box-1.png";
import Box2 from "./feedback-box-2.png";
import Box3 from "./feedback-box-3.png";
import FXM from "./formbricks-xm.png";

export const meta = {
  title: "Weekly Summary - 30th Dec 2022",
  description:
    "Holidays, illness and iterations: The Feedback Box is ready in plain JS and the MVP for the XM dashboard stands. Let’s have a look!",
  date: "2022-12-30",
};

_Holidays, illness and iterations: The Feedback Box is ready in plain JS and the MVP for the XM dashboard stands. Let’s have a look!_

<Image src={HeaderImage} alt="Weekly Update" className="rounded-lg" />

### Highlights

- Feedback Box in Vanilla JS
- Prototype for Formbricks XM
- Illness and testing setup

<ResponsiveEmbed
  src="https://www.tella.tv/video/clbxj4vgj00hj0fjrckk42fw6/embed"
  allowFullScreen
  className="rounded-lg"
/>

## Feedback Box in Vanilla JS

We first built the Feedback Box in React (as seen in the video) and then rebuilt it in plain JavaScript. We ran several tests and are currently working on the customizable config for colors, contact person and CTAs before we deploy it.

<div className="grid md:grid-cols-3 gap-1">
  <div>
    <Image src={Box1} alt="Feedback Box Open Source 1" className="rounded-lg" />
  </div>
  <div>
    <Image src={Box2} alt="Feedback Box Open Source 2" className="rounded-lg" />
  </div>
  <div>
    <Image src={Box3} alt="Feedback Box Open Source 3" className="rounded-lg" />
  </div>
</div>

## Prototyping Formbricks XM

We forked the Formbricks HQ to facilitate the product changes needed for an opinionated XM solution for SaaS startups. This is the first draft of the dashboard to manage user feedback:

<Image src={FXM} alt="Experience Management for SaaS" className="rounded-lg" />

So far, the meta data you get is:

- Category: Idea, Love, Bug
- Time of Feedback
- User incl. Email / uuid
- Device Info
- Page

And you can act on it by:

- Sending an email (simple mailto: link)
- Archive

A key insight from user interviews is that the feedback shared with the founders or product team is **always the starting point of a deeper conversation**. To facilitate that we can build category-specific actions:

- Idea / Love: Issuing an in-app interview prompt to schedule a time for this specific user
- Bug: Linear and GitHub projects integrations
- Bug: Integration to open support ticket
- Love: Prepare testimonial for quick share on Social / Landing Page
- All: Templates to reply faster
- All: Segment Integration to enrich user profiles

<Image src={CXM} alt="Customer Overview" className="rounded-lg" />

The feedback box allows to send along as much meta data as you need. Doing so, it’s possible to build up a customer profile over all micro-survey touchpoints in the SaaS app.

<Image src={CDetail} alt="Customer Detail View Open Source Hotjar" className="rounded-lg" />

Over time, the properties in the user profiles can be used to create cohorts for contextualized micro-interactions like 1-on-1 interview prompts, handing out SWAG or Product-Market-Fit surveys.

## Influenza and test setups

Unfortunately we have not been spared from an influenza infection, which slowed us down a bit. We took the time to look at the hypotheses we’re building the experience management solution for SaaS startups on. Here are the critical ones:

- **Problem Risk:** SaaS founders recognize that they don’t know enough about their users
- **Value Risk:** SaaS founders see the value of a systematic, productized approach for continuous in-app discovery and are willing to pay for it
- **Feasibility Risk:** Even with a small amount of responses we can create sufficient value to keep founders from churning out of Formbricks after a few months
- **Solution Fit:** Natively embedded surveys drive higher conversion than “bottom right pop-ups”

### Current status of validation

- **Problem Risk** 🟢 **-** Based on our own experience, 11 interviews with the target group and extensive desk research we can say: The majority of SaaS operators know that they don’t know enough about their users.
- **Value Risk** 🔴 **-** Even though we have two paying customers it is too early to assess. To build more conviction we’ll setup a landing page with a waitlist survey. We’ll also go into direct sales to find 8 more beta users to pay $49 / month.
- **Feasibility Risk** 🔴 **-** We’re building the prototype right now. Once implemented we will go through a few iterations before we can assess if Formbricks XM provides value for 200 WAUs and up.
- **Solution Fit** 🟠 **-** On average, in-app surveys convert 6x higher than standalone surveys. However, we do not know yet how natively embedded (inline) surveys perform in comparison.

To gather sufficient data we’re employing a mix of pretotyping (landing page + waitlist survey), prototyping (with customers) and user interviews.

# Guten Rutsch!

See you in 2023🤸

<NewsletterSignup />

export default ({ children }) => <LayoutMdx meta={meta}>{children}</LayoutMdx>;
