CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

preview-screens

Use when the user wants to preview generated screens in a browser without starting Metro / a simulator — for example after /create-mobile-app finishes or after /edit-app regenerates a screen.

Quality

83%

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

88%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.

An exemplary workflow-focused skill body: concrete, copy-paste-ready commands, well-sequenced steps with real validation and fallback paths, and clean delegation of bulk detail to reference files. The only deductions are minor redundancy in the Notes section and references that live outside the skill bundle itself.

DimensionReasoningScore

Conciseness

The body is dense with task-specific instruction and explains no general concepts, but the Notes section restates rules already given inline (PDF/pen placeholder handling) and a few passages — the OS-opener commentary and the untouched-template detection wording — could be trimmed.

4 / 5

Actionability

Guidance is fully executable throughout: exact glob/grep patterns, a copy-paste bash opener chain with fallbacks, concrete conversion examples ('p="$4"' → 'padding:16px', YStack → styled div), and exact output message formats covering the common cases.

5 / 5

Workflow Clarity

Seven clearly sequenced steps with explicit validation and error recovery: Step 1 validates the project and stops on failure, Step 2 includes read-to-check verification of ambiguous screens, and Step 7 specifies fallback behavior and honest failure reporting when auto-open fails.

5 / 5

Progressive Disclosure

The body appropriately delegates the mapping table, component recipes, and screen templates to three clearly-signaled one-level-deep references with a mandatory read in Step 3. However, all references resolve to plugin-level shared paths ('../../shared/references/…', '${PLUGIN_ROOT}/…') outside the skill's own bundle, with no local references/ directory, a minor organization and portability gap.

4 / 5

Total

18

/

20

Passed

Description

73%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.

A well-targeted description with an explicit, example-driven 'Use when' clause and strong distinctiveness. Its main weakness is a thin 'what': it names only one capability and omits the actual deliverable (an HTML phone-frame mockup), which limits both specificity and completeness.

Suggestions

State the concrete deliverable in the 'what' clause, e.g. 'Generates a self-contained preview.html that renders every screen as a phone-frame mockup with tab navigation' — this would lift specificity from one action to several.

Add natural trigger synonyms users might say, such as 'mockup', 'screenshot-ready', or 'visual preview', to broaden keyword coverage.

Consider mentioning the read-only nature ('without modifying source code') to further differentiate from editing skills like /edit-app.

DimensionReasoningScore

Specificity

The single concrete action 'preview generated screens in a browser without starting Metro / a simulator' names the domain and one capability, but the description never says what the skill actually produces (a self-contained HTML phone-frame mockup), so coverage is not comprehensive.

3 / 5

Completeness

Both parts are present: the 'when' is explicit with concrete trigger phrases ('after /create-mobile-app finishes or after /edit-app regenerates a screen'), while the 'what' ('preview generated screens in a browser') is clear but could state the deliverable more specifically. It sits between the 4 and 5 anchors because the 'when' is anchor-5 quality but the 'what' is anchor-4.

4 / 5

Trigger Term Quality

Natural phrases like 'preview', 'generated screens', 'in a browser' plus the highly specific '/create-mobile-app' and '/edit-app' give good keyword coverage, though common synonyms such as 'mockup', 'screenshot', or 'visual preview' are missing.

4 / 5

Distinctiveness Conflict Risk

The description occupies a clear niche anchored to specific sibling skills (/create-mobile-app, /edit-app) and an Expo/Metro context, making it unlikely to fire for unrelated preview or screenshot skills.

5 / 5

Total

16

/

20

Passed

Validation

81%

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

Validation — 13 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

allowed_tools_field

'allowed-tools' contains unusual tool name(s)

Warning

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

relative_links

Relative link issues: 4 suspicious

Warning

Total

13

/

16

Passed

Repository

microsoft/power-platform-skills

Path

plugins/mobile-apps/skills/preview-screens/SKILL.md

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.