CtrlK
BlogDocsLog inGet started
Tessl Logo

ui-screenshots

Regenerate the MockServer dashboard screenshots used on www.mock-server.com by driving a populated demo dashboard with headless Chromium (Playwright). Use when the dashboard UI has changed and the website screenshots (jekyll-www.mock-server.com/images/MockServer*.png) need refreshing, or when asked to "update the UI screenshots", "regenerate dashboard screenshots", or "take screenshots of the dashboard for the docs". Captures one Retina PNG per tab at the same geometry as the existing images.

78

Quality

98%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Passed

No findings from the security scan

SKILL.md
Quality
Evals
Security

Quality

Content

96%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

A high-quality, executable skill body: dense and token-efficient, copy-paste-ready, with a clearly sequenced two-phase workflow and explicit validation checkpoints for the batch image-write operation. The only minor gap is that bulk reference tables sit inline rather than in a deferred reference file.

Suggestions

Consider moving the 19-row 'Tab inventory' table and/or the two env-var knob tables into a references/ file (e.g. TAB_INVENTORY.md) referenced from SKILL.md, keeping the overview leaner.

The 'Why two phases' section is valuable non-obvious rationale; if space is ever tight, it could be shortened to one sentence plus the SKIP_CHARTS pointer without losing the key insight.

DimensionReasoningScore

Conciseness

Lean and information-dense with no padding or explanation of concepts Claude already knows; every section (TL;DR, two-phase rationale, env-var tables, troubleshooting) carries operational value that earns its tokens.

5 / 5

Actionability

Copy-paste-ready bash in the TL;DR and Common variations, concrete env-var tables with defaults, exact file paths, and a full 19-row tab-to-filename inventory make the guidance fully executable across common cases.

5 / 5

Workflow Clarity

Multi-step process is explicitly sequenced (mermaid diagram of the two phases) with validation checkpoints — 'wait for the Ready … populated demo environment line', 'wait for the WebSocket to show Connected', and an 'After capturing' section that verifies intended PNGs changed and are fully rendered; the batch write-to-live-site risk is covered by these checkpoints, so no cap applies.

5 / 5

Progressive Disclosure

Well-organized into clear sections with a TL;DR up top and one-level references to repo files (the orchestrator/capture scripts, AppBar.tsx); no nested references. The 19-row tab inventory and two env-var tables are bulk reference content inlined in SKILL.md that could optionally split into a reference file, though as a self-contained skill (no bundle files present) the current placement is appropriate.

4 / 5

Total

19

/

20

Passed

Description

100%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

An exemplary description: concrete actions, natural trigger phrases, explicit 'what' and 'when', and a distinctive niche. Written in third person with no fluff or over-claims.

DimensionReasoningScore

Specificity

Lists multiple concrete actions — 'Regenerate the MockServer dashboard screenshots', 'driving a populated demo dashboard with headless Chromium (Playwright)', 'Captures one Retina PNG per tab at the same geometry as the existing images' — giving comprehensive, specific coverage of what the skill does.

5 / 5

Completeness

Explicitly answers both 'what' (regenerate dashboard screenshots via headless Chromium driving a populated demo) and 'when' (Use when the dashboard UI has changed … or when asked to 'update the UI screenshots' …) with concrete trigger phrases, matching the anchor.

5 / 5

Trigger Term Quality

Provides natural trigger phrases a user would actually say — 'update the UI screenshots', 'regenerate dashboard screenshots', 'take screenshots of the dashboard for the docs' — plus the concrete refresh condition (UI has changed, website screenshots need refreshing).

5 / 5

Distinctiveness Conflict Risk

Occupies a clear niche — MockServer dashboard screenshots for www.mock-server.com via Playwright at Retina geometry — with tooling and path specifics that make conflict with other skills minimal.

5 / 5

Total

20

/

20

Passed

Validation

100%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
mock-server/mockserver-monorepo
Reviewed

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.