mcpField
W
web-design-guidelines

web-design-guidelines

github.com/makerjackieデザイン・UI141 回インストール36 週間前に更新
リポジトリ

web-design-guidelines について

指定したファイルを最新のWeb Interface Guidelinesに照らして確認し、問題をファイル名と行番号で報告するスキルです。Webインターフェースの実装をレビューする開発者向けで、レビューごとにルールを取得します。

主な機能

  1. 01最新のインターフェースガイドラインを取得
  2. 02指定ファイルやパターンを確認
  3. 03問題をファイル名と行番号で報告

活用シーン

  1. 01ガイドラインに沿ってWeb画面のファイルを確認
  2. 02パターンに一致する複数ファイルをレビュー
  3. 03ファイル未指定時に対象範囲を確認

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/makerjackie/jackie-skills-starter --skill web-design-guidelines

インストール後、Claude Code で/web-design-guidelinesを入力して読み込まれたか確認します。

詳細

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

Web Interface Guidelines への準拠状況を確認します。

動作の仕組み

  1. 以下のソース URL から最新のガイドラインを取得します
  2. 指定されたファイルを読み込みます(または、ファイルやパターンをユーザーに確認します)
  3. 取得したガイドラインのすべてのルールに照らして確認します
  4. 簡潔な file:line 形式で指摘事項を出力します

ガイドラインのソース

レビューのたびに最新のガイドラインを取得します。

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

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

使用方法

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

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

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

コメント