web-design-guidelines について
web-design-guidelines は、Web Interface Guidelines に照らしてファイルをレビューするスキルです。既定では再現性のある固定版を使い、任意で上流の更新を比較して、ファイル名と行番号で指摘を示します。
主な機能
- 01固定版ガイドライン
- 02任意の上流更新チェック
- 03指定ファイルやパターンのレビュー
- 04ファイル名と行番号で簡潔に指摘
活用シーン
- 01ガイドラインに沿った画面ファイルの監査
- 02上流ルールの変更確認
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ nexu-io/ open-design --skill web-design-guidelinesインストール後、Claude Code で/web-design-guidelinesを入力して読み込まれたか確認します。
同梱ファイルreferences/guidelines.mdLICENSE
詳細
Web Interface Guidelines
Web Interface Guidelines への準拠状況をファイルごとに確認します。
仕組み
references/guidelines.mdから固定されたガイドラインを読み込みます。これは、デフォルトの再現可能な実行方法です- 必要に応じて、以下の上流 URL から最新のガイドラインを取得し、固定されたスナップショットと比較して変更点を確認します
- 指定されたファイルを読み込みます(または、ファイルやパターンをユーザーに確認します)
- ガイドラインのすべてのルールに照らして確認します
- 簡潔な
file:line形式で指摘事項を出力します
ガイドラインのソース
デフォルト(固定版): references/guidelines.md にベンダー提供されているコピーが、デフォルトの実行方法です。これは上流のガイドラインの固定されたスナップショットであり、どの実行環境でもスキルが再現可能な結果を生成することを保証します。
上流(最新): 最新のルールを確認したいユーザーは、以下のライブソースを利用できます。
https://raw.githubusercontent.com/vercel-labs/web-interface-guidelines/main/command.md
ライブ版の取得は任意です。固定されたスナップショットを常に基準とします。
使い方
ユーザーがファイルまたはパターンの引数を指定した場合:
references/guidelines.mdをデフォルトのソースとして読み込みます- 必要に応じて、上流の URL を取得して更新を確認します
- 指定されたファイルを読み込みます
- ガイドラインのすべてのルールを適用します
- ガイドラインに指定された形式で指摘事項を出力します
ファイルが指定されていない場合は、確認するファイルをユーザーに尋ねます。
コメント
Markdown 対応