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.

72

Quality

89%

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

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 well-structured, token-efficient skill body with excellent progressive disclosure and clean reference organization. The main gap is the absence of inline executable code and explicit validation checkpoints in the workflow.

Suggestions

Add one short inline code snippet (e.g., a disconnect() cleanup pattern revoking a blob URL and disconnecting an observer) to lift actionability from guidance to copy-paste ready.

Insert an explicit validation/reconciliation checkpoint in the Core Workflow — e.g., after persisting playback progress, verify the stored value round-trips on load before treating state as reconciled.

For time-based UI frame updates, state how to confirm incremental updates are throttled correctly (an IntersectionObserver/rAF guard check) so the workflow self-validates rather than only describing the intent.

DimensionReasoningScore

Conciseness

Lean and efficient throughout — it never explains what Stimulus, Turbo Frames, or the named libraries are; every line (workflow steps, guardrails, reference pointers) earns its place and assumes Claude's competence.

5 / 5

Actionability

Gives concrete, specific directives with real API names ('URL.createObjectURL, Picture-in-Picture, IntersectionObserver, MediaSession', 'Clean up ... in disconnect()'), but provides no inline copy-paste code, relying on references for executable examples.

4 / 5

Workflow Clarity

A clear five-step Core Workflow with an ordered sequence and an explicit cleanup step, but lacks a validate/verify checkpoint or error-recovery loop, leaving minor validation gaps.

4 / 5

Progressive Disclosure

A concise overview with well-signaled, one-level-deep references — each reference path is named, mapped to a scenario, all referenced files exist, and INDEX.md is offered for the full catalog — making navigation easy.

5 / 5

Total

18

/

20

Passed

Description

92%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 high-quality description that is specific, complete, and strongly differentiated from sibling skills. Trigger-term coverage is very good but not maximally comprehensive in synonyms/extensions.

DimensionReasoningScore

Specificity

Lists multiple concrete actions — 'image/video/audio uploads, previews, playback controls, progress tracking' — plus named third-party integrations (WaveSurfer, Swiper, Picture-in-Picture, Blurhash), giving comprehensive coverage rather than vague abstractions.

5 / 5

Completeness

Explicitly answers 'what' (handle media-heavy Hotwire features with enumerated capabilities) and 'when' ('Prefer this skill when the core problem is media rendering, playback state, or media library integration') with concrete trigger phrasing.

5 / 5

Trigger Term Quality

Strong natural keywords ('uploads, previews, playback controls, progress tracking, media rendering, playback state') plus concrete library names users would cite, but lacks file-extension/synonym breadth that would push it to a 5.

4 / 5

Distinctiveness Conflict Risk

Carves a clear media niche and explicitly routes five neighbor skills (realtime-streaming, navigation-content, forms-validation, ux-feedback, stimulus-fundamentals) away, minimizing wrong-skill triggering.

5 / 5

Total

19

/

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