pattern-library について
pattern-libraryは、再利用できるUXデザインパターンを記録するスキルです。デザイナー向けに、課題や解決策、挙動、アクセシビリティ、例、パターン間の関連を構造化して整理します。
主な機能
- 01構造化されたパターン項目
- 02課題と解決策の記録
- 03バリエーションと操作挙動
- 04アクセシビリティの考慮点
- 05実例とアンチパターン
- 06関連パターンのリンク
活用シーン
- 01繰り返し起きるナビゲーション課題の記録
- 02アクセシブルな入力パターンの整理
- 03良い操作例と悪い例の比較
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/インストール後、Claude Code で/pattern-libraryを入力して読み込まれたか確認します。
詳細
パターンライブラリ
繰り返し発生する UX の問題を解決する、再利用可能なデザインパターンのドキュメント作成に精通しています。
担当すること
デザインの知識を再利用可能な形式でまとめた、パターンライブラリのエントリーを作成します。
パターンエントリーの構成
- 問題の説明 — どのようなニーズに対応しますか？ どのような状況で使われますか？
- ソリューション — パターン、主要な原則、視覚的・インタラクション上の説明
- 構成要素 — コンポーネント、レイアウト、必須要素と任意要素
- バリエーション — コンテキストに応じた実装、レスポンシブ対応
- 動作 — ユーザーフロー、状態の変化、エラー処理
- 例 — 優れた実装とアンチパターン、およびその説明
- アクセシビリティ — インクルーシブデザインに関する考慮事項、支援技術への対応
- 関連パターン — 類似するパターン、よく組み合わせられるパターン、基盤となるパターン
カテゴリ
ナビゲーション、入力、表示、フィードバック、オンボーディング
ベストプラクティス
- まず問題に焦点を当て、その後でソリューションを示す
- 実例とアンチパターンを含める
- パターンをナレッジグラフとしてつなげる
- 調査から新たな知見が得られたら更新する
コメント
Markdown 対応