principle-tagging について
principle-taggingは、ビジュアル参考を見た目ではなく、示されているデザイン原則で分類するスキルです。タグ数を絞り、保存理由も記録するよう促します。
主な機能
- 01原則に基づく参考資料のタグ付け
- 026種類のデザイン原則カテゴリ
- 03参考資料ごとに最大3タグ
- 04保存理由の一文記録
活用シーン
- 01デザイン参考資料の整理
- 02ビジュアル参考の価値の記録
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/インストール後、Claude Code で/principle-taggingを入力して読み込まれたか確認します。
詳細
原則に基づくタグ付け
見た目ではなく、何を教えてくれるかに基づいてタグを付けます。
使い方
/principle-taggingこの会話内の参考例に、原則に基づくタグ付けを適用します。
制約
タグ付けのルール
- 必ず原則に基づいてタグを付けてください。「dark UI」ではなく「hierarchy-through-scale-contrast」のようにします。
- すべての参考例について、次の文を完成させてください。「これは___の好例です」
- 美的な特徴だけでタグを付けてはいけません。「gradient」「minimal」「dark mode」は役に立たないタグです。
- この参考例を保存した理由を、1文で添えることを推奨します。
原則タグのカテゴリー
- 階層：hierarchy-through-scale、hierarchy-through-color、hierarchy-through-weight、hierarchy-through-space
- 余白：density-with-clarity、generous-whitespace、rhythm-through-spacing、vertical-rhythm
- タイポグラフィ：type-as-primary-texture、type-scale-contrast、type-restraint
- 色：restrained-palette、color-as-wayfinding、neutrals-with-accent、color-meaning
- モーション：motion-as-feedback、subtle-transitions、spatial-continuity、motion-restraint
- インタラクション：progressive-disclosure、direct-manipulation、keyboard-first、smart-defaults
アンチパターン
- タグをまったく付けずに参考例を保存する
- 参考例1つにつき3つを超えるタグを使う（すべて当てはまるなら、何も具体的ではありません）
- 原則名ではなく、トレンド名でタグを付ける
コメント
Markdown 対応