Lay vs BugHerd

6 min read|Comparison

BugHerd is a visual feedback tool that lets reviewers click anywhere on a web page to drop a pin. The pin records the click position as screen coordinates, captures a screenshot, and creates a task on BugHerd's built-in kanban board. It is one of the earliest tools designed for website feedback.

Lay takes a fundamentally different approach to the "where" of feedback. Instead of recording where someone clicked on the screen, Lay records which element they clicked on. This distinction — coordinates vs. elements — drives every downstream difference in how feedback behaves.

How BugHerd Works

BugHerd's workflow begins with a browser extension or an embedded JavaScript snippet. When a reviewer clicks the page, BugHerd captures the click coordinates (x, y pixel position relative to the page), a screenshot of the viewport, the URL, browser information, and screen dimensions. The feedback appears as a numbered pin on the page and as a card on BugHerd's kanban board.

The kanban board is BugHerd's organizational layer. Teams drag feedback cards between columns (Backlog, To Do, Doing, Done) and can assign tasks to team members. BugHerd integrates with project management tools to push tasks out when needed.

This coordinate-based approach is intuitive. Click where the problem is, describe it, submit. The pin sits at the exact spot the reviewer clicked. For static, single-viewport websites, this works well.

The challenge arises with dynamic, responsive applications. A pin placed at pixel position (800, 400) on a 1440px desktop viewport may point at a navigation menu. On a 390px mobile viewport, that same coordinate either points at empty space, a completely different element, or falls outside the visible area entirely. The pin has no concept of the element it was intended to reference — it knows only its position on the screen.

How Lay Works Differently

When a reviewer clicks an element in Lay, the system does not record screen coordinates as the primary anchor. It records the element itself through Three-Layer Anchoring:

  1. CSS selector path — A stable path to the element in the DOM, generated with awareness of framework classes and dynamic attributes to maximize selector stability
  2. Element fingerprint — A hash of the element's tag name, text content, key attributes, and DOM position, used to reattach if the selector breaks after a deploy
  3. Viewport coordinates — Percentage-based position as a last-resort fallback, not the primary anchor

This means Lay's feedback follows the element. When the layout shifts for responsive breakpoints, the selector resolves to the same element at its new position. When a deploy restructures the DOM, the fingerprint scorer finds the closest match and reattaches. The feedback always points at the right thing.

Beyond anchoring, Lay captures the full Context Stack — element identity, computed styles, accessibility data, viewport state, a cropped screenshot with element overlay, and AI classification. BugHerd captures a screenshot and browser info. The context depth is categorically different.

Feature Comparison

BugHerd vs Lay Feature Comparison
CapabilityBugHerdLay
Anchoring methodScreen coordinates (x, y pixel position)Element-anchored (CSS selector + fingerprint + coordinate fallback)
Responsive supportCoordinates drift on different viewportsSelector tracks the element regardless of viewport size
Deploy resiliencePins may drift or become meaningless after layout changesThree-Layer Anchoring reattaches to current DOM structure
Context depthScreenshot, URL, browser info, screen dimensionsElement identity, computed styles, accessibility, viewport, screenshot, AI classification
AI enrichmentNoYes — classification, urgency, developer triage
Browser extension requiredYes — guests need extension or use sidebarNo — SDK embedded in application
Feedback clusteringManual kanban boardAutomatic AI-powered semantic clustering
Issue syncOne-way to various PM toolsBidirectional Linear sync with Developer Handoff Packs

The Coordinate Problem

Coordinate-based feedback has a structural limitation: coordinates describe a position on the screen, not a thing on the page. This creates three specific failure modes:

Responsive drift. A coordinate is an absolute position. Responsive layouts move elements to different positions at different viewport widths. A pin placed on desktop may point at something completely unrelated on tablet or mobile. The reviewer's intent — "I'm talking about this button" — is lost.

Deploy displacement. When a deploy adds, removes, or reorders elements, the page layout shifts. Pins placed before the deploy may now point at different elements. Unlike stale screenshots (which at least show what the page used to look like), displaced coordinate pins give no indication that they have drifted.

Scroll sensitivity. Coordinate systems that use page-relative positions depend on the page height remaining stable. Dynamic content, lazy loading, and content that varies by user can all shift the relationship between a coordinate and the element it was intended to reference.

Lay avoids these failure modes because the anchor is the element, not the position. The selector and fingerprint resolve to the element wherever it is — different viewport, different layout, different deploy.

When to Use BugHerd

BugHerd is a reasonable choice when:

  • You need feedback on static websites — If the site layout does not change between viewports or deploys, coordinate drift is minimal and BugHerd's pin-based workflow is straightforward.
  • Your team prefers kanban-style triage — BugHerd's built-in kanban board is well-designed for teams that organize work visually with drag-and-drop.
  • You need broad PM tool integration — BugHerd connects to Jira, Asana, Monday, GitHub, and others. If your team uses a tool that Lay does not yet integrate with, BugHerd may cover that gap.
  • Guest reviewers cannot install an SDK — BugHerd's browser extension lets external reviewers leave feedback on any site without code changes (though they do need the extension installed).

When to Use Lay

Lay is the better fit when:

  • Your application is responsive — If users access your app on different devices and viewports, coordinate-based pins will drift. Element anchoring resolves feedback to the correct element regardless of viewport size.
  • You deploy frequently — Continuous deployment means the DOM changes regularly. Three-Layer Anchoring and self-healing selectors keep feedback attached to the current UI, not the previous version.
  • You need depth beyond a screenshot — The Context Stack captures computed styles, accessibility data, and element metadata. Developers get a structured report, not a pin on an image.
  • AI classification and clustering save time — Lay automatically classifies feedback, assigns urgency, generates developer triage, and clusters semantically similar reports. This eliminates manual sorting on a kanban board.
  • You want SDK-native integration — Lay is an npm package embedded in your React application. No browser extensions, no third-party scripts, no guest onboarding friction.

The fundamental question is: should feedback know what it is pointing at? If the answer is yes — if you need feedback that tracks elements, not positions — Lay solves the problem that coordinates cannot.

Frequently Asked Questions
What is the main difference between Lay and BugHerd?
BugHerd pins feedback to screen coordinates — a specific pixel position on the page. Lay pins feedback to DOM elements using CSS selectors and fingerprints. When the layout changes, BugHerd's pin drifts to the wrong position. Lay's anchor follows the element wherever it moves in the DOM.
Does BugHerd feedback survive responsive breakpoints?
Not reliably. A pin placed at (800, 400) on a desktop viewport points to a completely different element on a mobile viewport. BugHerd uses fixed coordinates that do not adapt to responsive layouts. Lay's element anchoring resolves feedback to the correct element regardless of viewport size.
Does BugHerd require a browser extension?
Yes for the full annotation experience. BugHerd offers a sidebar widget as an alternative, but the primary workflow depends on a browser extension. Lay is embedded via an npm package — no extension needed. It works in any React application with a single provider component.
Can BugHerd cluster duplicate feedback?
No. BugHerd uses a kanban-style board where feedback is organized manually into columns. Lay automatically clusters semantically similar feedback using AI, even when different users describe the same issue differently, reducing duplicate triage.
When should I use BugHerd instead of Lay?
BugHerd works well for teams that need visual pin-based feedback on static websites and prefer a kanban-style workflow. It supports many project management integrations. Choose Lay when you need element-level precision, responsive support, deploy resilience, AI enrichment, or you are building with React.
Summary
DefinitionBugHerd pins feedback to screen coordinates. Lay pins feedback to DOM elements using CSS selectors and fingerprints, so comments survive responsive breakpoints, layout changes, and deploys without drifting.
Key ConceptsHow BugHerd Works, How Lay Works Differently, Feature Comparison, The Coordinate Problem, When to Use BugHerd
FrameworkThree-Layer Anchoring