CtrlK
BlogDocsLog inGet started
Tessl Logo

hwc-media-content

Handle media-heavy Hotwire features: image/video/audio uploads, previews, playback controls, progress tracking, and third-party media integrations (for example WaveSurfer, Swiper, Picture-in-Picture, Blurhash). Prefer this skill when the core problem is media rendering, playback state, or media library integration. Use hwc-realtime-streaming for server-pushed Turbo Stream updates, hwc-navigation-content for non-media pagination/tab/lazy-navigation flows, hwc-forms-validation for form validation and inline-edit behavior, hwc-ux-feedback for generic loading/transition patterns, and hwc-stimulus-fundamentals for Stimulus primitives not specific to media.

71

Quality

86%

Does it follow best practices?

Impact

No eval scenarios have been run

SecuritybySnyk

Passed

No known issues

SKILL.md
Quality
Evals
Security

Quality

Content

72%

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

This is a well-structured routing/overview skill that excels at conciseness and progressive disclosure. It efficiently directs Claude to the right reference file for each media scenario and clearly delineates boundaries with neighbor skills. The main weakness is the absence of any concrete code examples in the body itself—even a single representative snippet (e.g., a minimal Stimulus controller with disconnect cleanup) would make the core workflow more actionable and provide a pattern to follow before diving into references.

Suggestions

Add at least one minimal, executable Stimulus controller example demonstrating the core pattern (e.g., image preview with blob URL creation and revocation in disconnect()) to boost actionability.

Add a validation/verification checkpoint to the core workflow, such as 'Verify disconnect() cleanup by confirming no lingering blob URLs or observer references remain after controller disconnection.'

DimensionReasoningScore

Conciseness

Every line earns its place. No explanation of what Stimulus or Turbo Frames are, no padding about media concepts. The guardrails and workflow steps are terse and assume Claude's competence with browser APIs and Hotwire conventions.

3 / 3

Actionability

The skill provides clear directional guidance (use blob URLs, clean up in disconnect(), feature detection) but lacks any concrete code examples. For a media skill involving specific APIs like URL.createObjectURL, PiP, and IntersectionObserver, at least one executable snippet would significantly improve actionability. However, the references are well-organized to provide the detailed implementations.

2 / 3

Workflow Clarity

The 5-step core workflow provides a reasonable sequence for approaching media tasks, but it lacks validation checkpoints. For operations involving resource cleanup (blob URLs, player instances, observers), there's no explicit verification step to confirm cleanup happened or that media state reconciliation succeeded.

2 / 3

Progressive Disclosure

Excellent structure: concise overview with clearly signaled, one-level-deep references organized by specific media task. The 'Load References Selectively' instruction is smart for token efficiency, and the neighbor skill escalation section provides clear routing for boundary cases. The INDEX.md fallback is a nice touch.

3 / 3

Total

10

/

12

Passed

Description

100%

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

This is an excellent skill description that clearly defines its media-focused scope within the Hotwire ecosystem, lists concrete capabilities and specific third-party libraries, and provides explicit trigger guidance. The explicit boundary-drawing with five related skills is particularly strong for disambiguation in a multi-skill environment. No significant weaknesses identified.

DimensionReasoningScore

Specificity

Lists multiple specific concrete actions: image/video/audio uploads, previews, playback controls, progress tracking, and names specific third-party integrations (WaveSurfer, Swiper, Picture-in-Picture, Blurhash).

3 / 3

Completeness

Clearly answers both 'what' (media uploads, previews, playback controls, progress tracking, third-party media integrations) and 'when' ('Prefer this skill when the core problem is media rendering, playback state, or media library integration'). Also explicitly delineates boundaries by naming related skills to use instead for adjacent concerns.

3 / 3

Trigger Term Quality

Includes strong natural keywords users would say: 'image', 'video', 'audio', 'uploads', 'previews', 'playback controls', 'progress tracking', plus specific library names like 'WaveSurfer', 'Swiper', 'Blurhash' that users would mention directly.

3 / 3

Distinctiveness Conflict Risk

Exceptionally distinctive — not only defines a clear media-focused niche within the Hotwire ecosystem, but explicitly names five sibling skills and explains when to use each instead, dramatically reducing conflict risk.

3 / 3

Total

12

/

12

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.

Validation11 / 11 Passed

Validation for skill structure

No warnings or errors.

Repository
lucianghinda/superpowers-ruby
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.