project-infographic

Generate a visually beautiful HTML infographic showing high-level project overview for sprint demos. Use when preparing presentations, stakeholder updates, or visual project summaries.

1.57x

Quality

54%

Does it follow best practices?

Impact

99%

1.57x

Average score across 3 eval scenarios

Securityby

Passed

No known issues

Optimize this skill with Tessl

npx tessl skill review --optimize ./.github/skills/project-infographic/SKILL.md

Quality

Discovery

67%

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 reasonably well-structured with a clear 'what' and 'when' clause, making it functional for skill selection. However, it could be more specific about the concrete actions performed (e.g., what data it visualizes) and include more natural trigger terms that users would say. The broad terms like 'presentations' and 'stakeholder updates' introduce some conflict risk with other skills.

Suggestions

Add more specific concrete actions, e.g., 'visualize sprint progress, milestones, team velocity, and key metrics as an HTML infographic'.

Expand trigger terms to include common variations like 'sprint review', 'status report', 'project dashboard', 'demo day', or 'progress visualization'.

Dimension	Reasoning	Score
Specificity	It names the domain (HTML infographic for project overview) and one specific action (generate), but doesn't list multiple concrete actions like 'summarize milestones, visualize sprint progress, highlight blockers'.	2 / 3
Completeness	Clearly answers both 'what' (generate a visually beautiful HTML infographic showing high-level project overview) and 'when' (use when preparing presentations, stakeholder updates, or visual project summaries) with explicit trigger guidance.	3 / 3
Trigger Term Quality	Includes some natural keywords like 'sprint demos', 'presentations', 'stakeholder updates', 'project summaries', but misses common variations like 'dashboard', 'status report', 'project status', 'demo day', or 'sprint review'.	2 / 3
Distinctiveness Conflict Risk	The combination of 'HTML infographic' + 'sprint demos' + 'project overview' is fairly specific, but 'presentations' and 'stakeholder updates' are broad enough to potentially overlap with general presentation or reporting skills.	2 / 3
	Total	9 / 12 Passed

Implementation

42%

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

The skill provides highly actionable and concrete guidance for generating HTML infographics, with excellent code examples and clear section definitions. However, it is severely bloated — the extensive CSS and HTML templates should be extracted into separate reference files, and the content explains many visual design concepts Claude already understands. Adding validation steps (e.g., verify scanned data completeness, check HTML output renders) would improve workflow reliability.

Suggestions

Extract the CSS design system, HTML architecture template, and example patterns into separate reference files (e.g., DESIGN_TOKENS.md, ARCHITECTURE_TEMPLATE.html) and reference them from the main skill with one-level-deep links.

Remove explanatory content Claude already knows (hover effect patterns, responsive breakpoint concepts, flexbox/grid basics) and keep only project-specific design decisions.

Add a validation checkpoint after the scan phase (e.g., 'List extracted findings and confirm with user before generating HTML') and after output generation (e.g., 'Verify all referenced features exist in the codebase').

Trim the 'Target Audience' and 'When to Use' sections to 1-2 lines each — Claude can infer appropriate usage from the skill description.

Dimension	Reasoning	Score
Conciseness	The skill is extremely verbose at ~250+ lines. It includes extensive CSS code examples and HTML templates that could be referenced from separate files. Much of the design system detail (hover effects, responsive breakpoints, color tokens) is information Claude already knows how to produce. The architectural diagram section alone is massive and could be a separate reference file.	1 / 3
Actionability	The skill provides fully concrete, executable guidance: specific file paths to scan, exact CSS code patterns to use, complete HTML structure examples, specific section layouts, and clear output file locations. The code examples are copy-paste ready and the scan process has specific targets.	3 / 3
Workflow Clarity	The scan process (steps 1-4) is clearly sequenced, and the output sections are well-defined. However, there are no validation checkpoints — no step to verify the generated HTML renders correctly, no feedback loop for checking accuracy against the codebase, and no verification that the scanned information is complete before generating output.	2 / 3
Progressive Disclosure	This is a monolithic wall of content with no references to external files. The extensive CSS design system, HTML architecture examples, and detailed section specifications should be split into separate reference files (e.g., DESIGN_SYSTEM.md, ARCHITECTURE_TEMPLATE.md). Everything is inlined, making the skill overwhelming to parse.	1 / 3
	Total	7 / 12 Passed

Validation

90%

Warnings & errors only

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

Validation — 10 / 11 Passed

Validation for skill structure

Criteria	Description	Result
frontmatter_unknown_keys	Unknown frontmatter key(s) found; consider removing or moving to metadata	Warning

	Total	10 / 11 Passed

Repository: 0xrabbidfly/eric-cartman
Commit: 17bd06f

Reviewed: 4 days ago

Table of Contents

Discovery Implementation Validation

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.