AgentSkillsCN

web-design-guidelines

对UI代码是否符合Web界面设计规范进行审查。当用户提出“评审UI”“检测无障碍性”“审核设计”“评估用户体验”“依据最佳实践对站点进行检查”等需求时，可选用此模板。

SKILL.md
--- frontmatter
name: web-design-guidelines
description: UIコードがWebインターフェースガイドラインに準拠しているかレビューする。「UIをレビューして」「アクセシビリティをチェックして」「デザインを監査して」「UXをレビューして」「ベストプラクティスに照らしてサイトを確認して」と依頼された時に使用する。
metadata:
  author: vercel
  version: "1.0.0"
  argument-hint: <file-or-pattern>

Webインターフェースガイドライン

Webインターフェースガイドラインへの準拠についてファイルをレビューする。

動作方法

  1. •以下のソースURLから最新のガイドラインを取得する
  2. •指定されたファイルを読み込む（ファイルまたはパターンが未指定の場合はユーザーに確認する）
  3. •取得したガイドラインのすべてのルールに照らして確認する
  4. •簡潔な file:line 形式で結果を出力する

ガイドラインのソース

レビューの前に毎回最新のガイドラインを取得する:

code
https://raw.githubusercontent.com/vercel-labs/web-interface-guidelines/main/command.md

WebFetchを使用して最新のルールを取得する。取得したコンテンツにはすべてのルールと出力形式の指示が含まれている。

使用方法

ユーザーがファイルまたはパターンの引数を指定した場合:

  1. •上記のソースURLからガイドラインを取得する
  2. •指定されたファイルを読み込む
  3. •取得したガイドラインのすべてのルールを適用する
  4. •ガイドラインで指定された形式を使用して結果を出力する

ファイルが指定されていない場合は、どのファイルをレビューするかユーザーに尋ねる。