visual-verdict
Structured visual QA verdict for screenshot-to-reference comparisons
DeepseekModel
キュレーション済みスキル
品質 優秀 · 90
v1.0.0
取得
https://deepseekmodel.com/api/download.php?id=yeachan-heo-oh-my-claudecode-skills-visual-verdict-skill-md&format=skill
ダウンロード .skill
標準形式。system_prompt と model_config を収録し、任意の Agent で利用可能
.skill ファイルの system_prompt フィールドの実際の内容。
name visual-verdict description Structured visual QA verdict for screenshot-to-reference comparisons level 2 Use this skill to compare generated UI screenshots against one or more reference images and return a strict JSON verdict that can drive the next edit iteration. <Use_When> The task includes visual fidelity requirements (layout, spacing, typography, component styling) You have a generated screenshot and at least one reference image You need deterministic pass/fail guidance before continuing edits </Use_When> - `reference_images[]` (one or more image paths) - `generated_screenshot` (current output image) - Optional: `category_hint` (e.g., `hackernews`, `sns-feed`, `dashboard`) <Output_Contract> Return JSON only with this exact shape: { "score" : 0 , "verdict" : "revise" , "category_match" : false , "differences" : [ "..." ] , "suggestions" : [ "..." ] , "reasoning" : "short explanation" } Rules: score : integer 0-100 verdict : short status ( pass , revise , or fail ) category_match : true when the generated screenshot matches the intended UI category/style differences[] : concrete visual mismatches (layout, spacing, typography, colors, hierarchy) suggestions[] : actionable next edits tied to the differences reasoning : 1-2 sentence summary <Threshold_And_Loop> Target pass threshold is 90+ . If score < 90 , continue editing and rerun /oh-my-claudecode:visual-verdict before any further visual review pass. Do not treat the visual task as complete until the next screenshot clears the threshold. </Threshold_And_Loop> <Debug_Visualization> When mismatch diagnosis is hard: Keep $visual-verdict as the authoritative decision. Use pixel-level diff tooling (pixel diff / pixelmatch overlay) as a secondary debug aid to localize hotspots. Convert pixel diff hotspots into concrete differences[] and suggestions[] updates. </Debug_Visualization> ```json { "score": 87, "verdict": "revise", "category_match": true, "differences": [ "Top nav spacing is tighter than reference", "Primary button uses smaller font weight" ], "suggestions": [ "Increase nav item horizontal padding by 4px", "Set primary button font-weight to 600" ], "reasoning": "Core layout matches, but style details still diverge." } ``` Task: {{ARGUMENTS}}
このスキルを起動するキーワード。クリックでコピーできます。
このスキルにはトリガーワードがありません。
ダウンロードした .skill に含まれるフィールド。
| フィールド | 説明 |
|---|---|
| format | フォーマット識別子（skill/v1） |
| skill_id | スキル固有 ID |
| name | スキル名 |
| version | バージョン |
| description | 説明 |
| category | カテゴリ（配列） |
| trigger_words | トリガーワード |
| tags | タグ |
| source | ソース |
| source_url | ソース URL（本ページ） |
| exported_at | エクスポート日時（ダウンロード毎） |
| system_prompt | システムプロンプト本文 |
| model_config | モデル設定：provider / model / temperature / max_tokens / top_p |
| examples | サンプル |
| install_guide | 各プラットフォームの導入説明（Coze / Dify / Claude / カスタム） |
