Glitches

Glitches is a Chrome extension for capturing, annotating, and filing visual bug reports directly into GitHub, Jira, or Productive issues, with optional AI-powered auto-fixes via Claude Code.

What is Glitches?

Glitches, developed by Studio Nope, is a Chrome extension that turns visual feedback on any website into structured bug reports. It takes screenshots, screen recordings (up to 60 seconds), annotations, DOM inspector data, console errors, and browser context as input. It produces a filed issue in GitHub, Jira, or Productive, or a single annotated image copied to the clipboard. When GitHub is connected and Auto-Fix is enabled, Claude Code can open a pull request with a proposed fix.

Key Features

• Select & Highlight – Draw color-coded regions over any page element to pinpoint exactly what is wrong.
• Canvas Annotations – Freehand draw arrows, shapes, add text callouts, or paste images from clipboard onto the capture; everything composites into a single annotated image.
• DOM Inspector – Click any element to capture its HTML, CSS classes, and computed dimensions, giving developers the exact selector needed.
• Screen Recording – Record up to 60 seconds with optional microphone narration; toggle the mic mid-recording; keep using Select, Canvas, and Inspect during recording so annotations are captured live. Videos embed inline in GitHub issues and attach to Jira and Productive tickets.
• Auto-Fix with Claude Code – Toggle Auto-Fix when reporting to GitHub; Claude Code analyzes the screenshot, DOM context, console errors, and the codebase, then pushes a branch with a proposed fix and opens a pull request. Powered by your own Anthropic API key.
• Tracker Integrations – File reports straight into GitHub, Jira, or Productive with pre-filled labels, assignees, target branch (GitHub), project/issue type/components (Jira), or task/board/project (Productive).
• Smart Context – Every report automatically includes browser, viewport size, URL, Shopify shop data (if applicable), console errors, and network failures.
• Annotation-only mode – No tracker connected? Capture, annotate, and copy the result to clipboard as a single image.

Who is it for?

Developers – get precise DOM selectors and console errors without back‑and‑forth. Designers – annotate visual issues with arrows and text, then copy to clipboard for design reviews. QA testers – record screen flows with mic narration and attach inline to GitHub issues. Agencies – use workspace sharing and white‑label themes to submit bug reports on behalf of clients.

What can you do with Glitches?

Reporting a visual bug on a live website: Capture a screenshot, highlight the broken element, add a text callout, and file directly to GitHub with auto‑attached console errors and DOM snapshot. Demonstrating a regression in a user flow: Record a 30‑second screen capture with mic narration, annotate the problem area live, and attach the video to a Jira ticket. Performing a design review without an issue tracker: Annotate a screenshot with arrows and text, then copy the composite image to clipboard for sharing in Slack or email.

How does Glitches work?

Open the side panel by clicking the Glitches extension icon. Four steps follow: (1) Capture a screenshot or start a recording of any website. (2) Annotate using Select, Canvas, or DOM Inspector tools. (3) Optionally record a screen capture up to 60 seconds – annotations made during recording appear live in the video. (4) Report by writing a description, choosing a destination (GitHub, Jira, Productive, or clipboard), and optionally turning on Auto‑Fix for GitHub. The report lands in your tracker with all attached context.

Pricing

Glitches is free to start – you connect your own Anthropic API key for Auto‑Fix and your workspace token. Paid plans are available for teams that need workspace sharing and white‑label themes.

FAQ