ui-screenshot-improve

Audit SlabLedger UI screenshots and log visual friction fixes.

Updated Mar 25, 2026
One-click install
npx skills add https://github.com/guarzo/slabledger --skill ui-screenshot-improve
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-screenshot-improve
Source: https://github.com/guarzo/slabledger/tree/main/.claude/skills/ui-screenshot-improve
Command: npx skills add https://github.com/guarzo/slabledger --skill ui-screenshot-improve

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires jq, psql, and includes scripts (resource) components.

What problem does it solve?

Visual UI friction slows user tasks and degrades adoption; this skill provides a repeatable loop to identify, measure, and reduce friction across the SlabLedger UI.

Core Features & Use Cases

  • Load friction log and track iteration history to avoid rework.
  • Capture fresh screenshots, run canonical user journeys, and audit each page for friction signals (clarity, navigation, empty states).
  • Propose and ship targeted UI fixes with build verification, and verify regressions via ad-hoc probing when needed.

Quick Start

Run a full UI friction audit cycle on the current SlabLedger app to capture fresh screenshots, identify top friction points, ship fixes, and log results.

Frequently Asked Questions about ui-screenshot-improve

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I identify and fix visual UI friction using automated screenshots?

Visual UI friction is identified by capturing fresh screenshots and running canonical user journeys to audit dashboard, inventory, and campaign pages for clarity, navigation, and empty state signals. Targeted fixes are then shipped to the web codebase with build verification.

What is a UI friction log and how does it help reduce visual friction?

A UI friction log tracks iteration history and records outcomes for identified friction points across UI surfaces. Loading the friction log before auditing helps avoid rework and maintains a repeatable loop to measure and reduce friction across cycles.

Do I need Playwright to run UI screenshot audits and fix friction points?

Yes, running UI screenshot audits requires a Playwright-based harness to capture screenshots and probe canonical user journeys. You also need a minimal web codebase to implement fixes in the source directory and verify them via builds.

Can I use screenshot-driven audits to check empty states and navigation on dashboard pages?

Yes, screenshot-driven audits evaluate dashboard pages for friction signals including empty states, navigation, and clarity. The audit captures fresh screenshots of each UI surface and proposes targeted fixes to mitigate the identified friction.

How do I verify UI fixes and prevent regressions after mitigating visual friction?

You verify UI fixes by running builds after shipping targeted changes to the web codebase. To prevent regressions, run ad-hoc probing via the Playwright harness and record the verification outcomes in the friction log.

What are the limitations of using screenshot audits for UX friction detection?

Screenshot audits for UX friction detection require a Playwright harness and a web codebase to implement fixes, limiting use to testable web environments. They focus on visual signals like clarity and navigation rather than backend performance issues.