CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

frame-flowchart-sticky

SVG curve connectors, sticky-note nodes, and cursor interaction with a whiteboard-brainstorm feel.

56

Quality

71%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide
SecuritybySnyk

High

Do not use without reviewing

Fix and improve this skill with Tessl

tessl review fix ./skills/frame-flowchart-sticky/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

86%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 lean, highly concrete design spec: every section delivers exact values (sizes, colors, fonts, stroke parameters) with no filler, and the deliverable is unambiguous. The only gaps are the literal 'linear-gradient(...)' placeholder for the tape, the absent SVG markup example, and the single-file-HTML requirement being buried in the constraints section.

DimensionReasoningScore

Conciseness

Every line carries a design constant ("240×180px", "#fcd34d / #fca5a5 / #a7f3d0 / #a5b4fc", "stroke `#2a2a2a`, width 2.5", "transform: rotate(±2deg)") with zero padding and no explanation of concepts Claude already knows — every token earns its place.

5 / 5

Actionability

The spec is almost fully executable — exact dimensions, hex colors, shadow parameters, dash patterns, and named fonts ("Kalam / Caveat / Patrick Hand") — but the tape decoration is given as the literal placeholder "linear-gradient(...)" and no SVG path or marker snippet is provided, leaving minor gaps versus the copy-paste-ready anchor at 5.

4 / 5

Workflow Clarity

The body follows a clear build order (canvas → nodes → connectors → optional interactions → constraints) and the single deliverable is unambiguous ("单文件 HTML", 5–12 nodes, explicit 严禁 list), but the 'what to produce' statement and the real-content requirement sit in the final 【设计细节】 section rather than up front, and no verification of the output (e.g. checking connectors don't cross) is specified.

4 / 5

Progressive Disclosure

The body is under 50 lines, needs no external references (none exist in the bundle), and is organized into clearly labeled sections (【画布】【节点】【连接线】【可选交互】【设计细节】) — the simple-skill case where well-organized sections alone merit a 5.

5 / 5

Total

18

/

20

Passed

Description

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

The description is specific about visual style but reads as a feature list rather than a capability statement: no verb, no 'Use when' trigger clause, and the key natural keyword 'flowchart' never appears in the description field itself. It is distinctive but incomplete as a skill description.

Suggestions

Lead with an action verb and the core purpose, e.g. 'Renders a process or workflow as a whiteboard-style flowchart frame with SVG curve connectors and sticky-note nodes...'.

Add an explicit trigger clause: 'Use when the user asks for a flowchart, process diagram, or onboarding/explainer video in a whiteboard brainstorm style.'

Include the natural synonyms users would actually say — 'flowchart', 'diagram', 'process/workflow map' — since 'flowchart' currently appears only in the name and tags, not the description.

DimensionReasoningScore

Specificity

The description names three concrete visual features ("SVG curve connectors, sticky-note nodes, and cursor interaction") but never states an action — there is no verb saying what the skill does (create/render a flowchart frame), so it matches 'names domain and 1-2 concrete items, not comprehensive' rather than the 'several specific actions' anchor at 4.

3 / 5

Completeness

The 'what' is a vague noun list with no stated action and there is no 'Use when...' clause or equivalent trigger guidance, which caps completeness; this matches 'has a vague what and no when' rather than the clear-what anchor at 3.

2 / 5

Trigger Term Quality

Terms like "sticky-note", "whiteboard-brainstorm", and "SVG" are relevant, but the most natural phrases a user would say ("flowchart", "diagram", "process map") are missing from the description entirely — 'some relevant keywords but missing common variations'.

3 / 5

Distinctiveness Conflict Risk

The sticky-note/whiteboard-brainstorm aesthetic carves a distinct niche unlikely to collide with unrelated skills; minor overlap remains with sibling diagram or frame-design skills in the same catalog.

4 / 5

Total

12

/

20

Passed

Validation

93%

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

Validation — 15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

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

Warning

Total

15

/

16

Passed

Repository

nexu-io/open-design

Path

skills/frame-flowchart-sticky/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.