Communitygithub.com

k1e1n04/claude-skills

UI以外のユーザー接点(API・設定ファイル/設定項目・拡張機能/プラグイン)を、UXの6原則に沿って設計・レビューします。

claude-skills とは?

このスキルは、システムアーキテクトや開発者がUI以外のユーザー接点(API、設定、拡張機能)のユーザーエクスペリエンス(UX)を設計・レビューするための包括的なフレームワークを提供します。従来のUIデザインに焦点を当てるのではなく、開発者体験(DX)やオンボーディングの質を高めるために、システムとユーザーのあらゆる接点を考慮します。6つの原則(ユーザーを理解する、必要最小限、マニュアル不要、情報交換の観点、シンプルなものをシンプルに、実装より前にUXを設計する)に基づき、接点ごと(設定、API、拡張機能)に具体的なガイドラインを提供します。このスキルは、Claude CodeやClineなどのAIエージェント向けに設計されており、設計提案やレビューを自動化し、実装の初期段階でUXを深く検討することで後戻りを防ぎます。

対応✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/k1e1n04/claude-skills/tree/HEAD/skills/ux-design-for-architects

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

ux-design-for-architects

アーキテクトが、UI 以外のユーザー接点(API / 設定 / 拡張機能) の UX を設計・レビューするための指針。UI 画面のデザイン (配色・レイアウト等) は対象外。

UX は UI だけでなく、システムとユーザーのあらゆる接点に及ぶ。接点の UX が悪いと、後から変えにくく (利用者が依存するため)、システム全体の成功確率が下がる。だから実装より先に決める。

進め方

  1. 接点を特定する: 対象は API / 設定 / 拡張機能のどれか (複数可)。
  2. ユーザーを特定する (原則1): 誰が、何のために、どの技術レベルで使うか。
  3. 該当する接点の詳細ガイドを読む:
    • 設定 → references/configuration.md
    • API → references/api.md
    • 拡張機能 → references/extensions.md
  4. 6 原則でチェックする (下記)。設計案を出すなら、原則に照らした根拠を一言添える。
  5. レビューなら、references/review-checklist.md の形式で指摘する。
  6. 判断が割れる点は、ユーザーに仮説付きで確認する (AskUserQuestion)。

UX の 6 原則

#原則要点なぜ
1ユーザーを理解する目標・技術レベル・メンタルモデル・典型ワークフローを把握し、期待どおりに動かす (驚き最小の原則)ユーザーは自分の予想と違う行動を取る。聞くより観察・計測が有効
2必要最小限のことをする必要なフィーチャーだけ出す。広く使われる標準 (OAuth, OpenID 等) があれば採用提供したものは負債になる。一度出すと慣れられ、直しにくい
3マニュアル不要にする使い方を自明にし、レコメンドや手がかりで導くユーザーはマニュアルを読まない。解決できなければ製品が悪いと判断する
4情報交換の観点で考える聞かずに済ませる > 少なく聞く > 答えやすい形で聞く。同じことを二度聞かない入力は負担。推測・記憶・導出で減らせる
5シンプルなものをシンプルに最初の数操作の障壁を取り除く。事前設定済みクライアントやサンプルを用意初心者ほど離脱しやすい。最初の体験が定着を決める
6実装より前に UX を設計するアーキテクチャより先に UX、フィードバックを回しながら詰める実装後の UX 変更は高コスト。実装は遅らせ、設計は深く

情報を聞く場面の判断 (原則4の具体化)

優先順位で考える:

  1. 聞かない: 妥当な既定値、環境からの自動検出、過去の入力の記憶、既知情報からの導出
  2. 少なく聞く: 本当に必要なものだけ
  3. 答えやすく聞く: 内部実装の言葉ではなく、ユーザーが頭の中で計算せず答えられる形で聞く (例: 「最大キャッシュエントリ数」ではなく「キャッシュに使うメモリ上限」、さらに「サーバーかクライアントか」のようなモード選択から詳細を導出)

出力・応答を返す場面 (原則4)

性能上の問題がなければ、ユーザーが理解できる形で多めに情報を返し、次の行動を予測できるようにする。ある呼び出しの結果を次の呼び出しへ渡す場合は、加工を最小限にして渡せるようにする。

接点ごとの要約

  • 設定: 設定は「導入しない」が最善。次に自動決定、最後に妥当な既定値付きで導入。問いは「ユーザーは我々より良い文脈を持っているか?」— Yes のときだけ設定にする。未知キー・適用失敗は黙殺せずエラー。有効な設定値は起動時などに確認できるようにする。
  • API: 利用者は開発者。学びやすく、誤用しにくく、次の一歩が常に明確に。1 つのことをうまくやる。定型コードを書かせない。標準に乗る。最初からバージョン管理。公開は必要になるまで遅らせ、まず内部で使う。
  • 拡張機能: ユースケースを深く理解するまで追加を待つ (後からリファクタリングで足せる)。1 つのことをうまくやる。入出力を定義し、内部構造を露出しない。一度公開すると変更しにくい。

よくある失敗 (設計・レビュー時に疑う)

  • UX の専門知識が足りない / 専門家の招へいが遅い
  • UI ばかり見て、API・設定・拡張機能の UX を軽視する
  • 技術リーダーが UX を決め、専門家に UI の微調整だけを頼む
  • 専門家の提案を聞き流す
  • 2 案で迷って設定にして逃げる (問題をユーザーへ押し付ける)

専門家がいない場合は、その旨を明示し、UX の専門家を早期に巻き込むことを推奨する。ただし助言を拒んで設計を止めず、本ガイドに沿った暫定案を出す。

イテレーティブな進め方との接続

  • ユーザージャーニーから設計を導く → ジャーニー上の各接点に本ガイドを適用
  • イテレーティブにスライスする → 最初のスライスで要る接点だけを作る (公開 API や拡張機能は MVP 後でよいことが多い)
  • 変更が難しいものは深く設計し、ゆっくり実装 → UX はこの代表例。実利用の観察で学ぶ

出力形式

設計提案: 「対象接点 → ユーザー像 → 提案 → 該当原則と理由 → 未決事項」の順で簡潔に。 レビュー: references/review-checklist.md の形式。

関連スキル