BugHerd → Mushi

Hours Low risk

BugHerd’s signature feature is pixel-pin annotations — clients click on a part of a web page to attach a comment to that exact element. Mushi provides similar element-level context via its capture pipeline (the report includes the clicked element’s CSS selector, position, and a screenshot) plus structured user metadata.

Mushi doesn’t replicate BugHerd’s collaborative-Kanban board feature. If your client-feedback workflow depends on the Kanban view, plan for a workflow change as well as a tool change. Most teams find Mushi’s report inbox + admin console sufficient.

Why switch

Open source. Mushi’s SDK + admin console are MIT-licensed.
Self-host. Mushi runs on your infrastructure; BugHerd is SaaS-only.
AI triage. Mushi categorises, prioritises, and assigns reports automatically — handy when client feedback is noisy.
Single inbox. Mushi consolidates internal-team and client feedback into one project; BugHerd siloes per-website projects.

API mapping

BugHerd	Mushi
`<script src="bugherd.com/sidebarv2.js?apikey=...">`	`<script>` mounting `Mushi.init({ projectId, apiKey })`
Sidebar widget (always visible)	Floating button widget (`widget.trigger: 'button'`) — discreet, opens on click
Element click → annotation	User triggers widget → screenshot + element selector capture
`bugherd.identify(user)`	`Mushi.setUser({ id, email, name })`
Project-board view	Mushi admin console — Reports tab
`data-bugherd-private` (skip element from screenshots)	`data-mushi-redact` (same idea)

Before / After


<!-- BEFORE — BugHerd -->
<script type="text/javascript">
  (function(d,t) {
    var bh = d.createElement(t); bh.async = true;
    bh.type = 'text/javascript';
    bh.src = 'https://www.bugherd.com/sidebarv2.js?apikey=YOUR_API_KEY';
    var s = d.getElementsByTagName(t)[0]; s.parentNode.insertBefore(bh, s);
  })(document, 'script');
</script>


<!-- AFTER — Mushi (web) -->
<script type="module">
  import { Mushi } from 'https://esm.sh/@mushi-mushi/web'
  Mushi.init({
    projectId: 'YOUR_PROJECT_ID',
    apiKey:    'YOUR_PUBLIC_KEY',
    widget:    { trigger: 'button' },  // BugHerd-equivalent UX
  })
</script>

For React / Vue / Svelte / Next, use the framework-specific SDK instead.

Migration checklist

8 required steps

Step 01
Create a Mushi project
Step 02
Install or script-tag Mushi
Step 03
Add Mushi alongside BugHerd
Step 04
Port any data-bugherd-private to data-mushi-redact
Step 05
Wire client identity (Mushi.setUser)
Step 06
Tell clients about the new widget
Step 07
Submit a test report from a real page
Step 08
Remove the BugHerd script + revoke the API key

Feature parity

Capability	BugHerd	Mushi
User-triggered report	✅	✅
Screenshot capture	✅	✅
Element selector context	✅ (pixel pin)	✅ (CSS selector + position)
Console + network capture	✅	✅
Sidebar / always-visible	✅	❌ — discreet floating button
Project Kanban board	✅	❌ — flat report inbox + filters
Client guest accounts	✅	❌ — anonymous reports OK; named clients via `setUser`
Visual annotations on screenshot	✅	❌ — text + selector only
Self-host	❌	✅
Open source	❌	✅
AI triage	❌	✅

If pixel-perfect visual annotations on screenshots are critical to your client workflow, BugHerd is genuinely better at that one thing. Most teams find Mushi’s selector + screenshot combination sufficient and the AI triage saves more time than they lose on annotations.