ux-copy

/ux-copy

見慣れないプレースホルダーがある場合や、接続されているツールを確認する必要がある場合は、CONNECTORS.md をご覧ください。

あらゆるインターフェースの文脈に合わせて、UX コピーを作成またはレビューします。

使用方法

/ux-copy $ARGUMENTS

お知らせいただきたいこと

• コンテキスト：どの画面、フロー、機能ですか？
• ユーザーの状態：ユーザーは何をしようとしていますか？どのような気持ちですか？
• トーン：フォーマル、親しみやすい、遊び心のある、安心感のあるものなど、どのようなトーンですか？
• 制約：文字数制限やプラットフォームのガイドラインはありますか？

原則

1. 明確に：伝えたいことを正確に伝えます。専門用語や曖昧な表現は避けます。
2. 簡潔に：意味を十分に伝えるために必要な最小限の言葉を使います。
3. 一貫性を保つ：同じものには、どこでも同じ用語を使います。
4. 役立つ内容に：すべての言葉が、ユーザーの目標達成に役立つようにします。
5. 人間らしく：ロボットではなく、親切な人のように書きます。

コピーのパターン

CTA

• 動詞から始めます：「無料トライアルを開始」「変更を保存」「レポートをダウンロード」
• 具体的にします：「送信」ではなく「アカウントを作成」
• アクションの結果がラベルからわかるようにします

エラーメッセージ

構成：何が起きたか + その理由 + 解決方法

• 「決済が拒否されました。カード発行会社によってカードが拒否されました。別のカードを試すか、カード発行会社にお問い合わせください。」

空の状態

構成：これは何か + 空である理由 + 始め方

• 「プロジェクトはまだありません。最初のプロジェクトを作成して、チームとの共同作業を始めましょう。」

確認ダイアログ

• 操作を明確にします：「本当に実行しますか？」ではなく「3 個のファイルを削除しますか？」
• 結果を説明します：「この操作は取り消せません」
• ボタンには「OK」／「キャンセル」ではなく、操作を表す「ファイルを削除」／「ファイルを残す」といったラベルを付けます

ツールチップ

• 簡潔で役立つものにし、当たり前のことは説明しません

読み込み中の状態

• 見通しを伝え、不安を和らげます

オンボーディング

• 段階的に情報を開示し、一度に一つの概念を伝えます

ボイスとトーン

状況に合わせてトーンを調整します。

• 成功：大げさにならない範囲で、お祝いの気持ちを伝えます
• エラー：共感を示し、役立つ内容にします
• 警告：明確で、次の行動がわかるようにします
• 中立：情報をわかりやすく簡潔に伝えます

出力

## UX Copy: [Context]

### Recommended Copy
**[Element]**: [Copy]

### Alternatives
| Option | Copy | Tone | Best For |
|--------|------|------|----------|
| A | [Copy] | [Tone] | [When to use] |
| B | [Copy] | [Tone] | [When to use] |
| C | [Copy] | [Tone] | [When to use] |

### Rationale
[Why this copy works — user context, clarity, action-orientation]

### Localization Notes
[Anything translators should know — idioms to avoid, character expansion, cultural context]

コネクターを利用できる場合

~~ナレッジベースが接続されている場合：

• ブランドボイスのガイドラインとコンテンツスタイルガイドを参照します
• 既存のコピーのパターンや用語の基準を確認します

~~デザインツールが接続されている場合：

• Figma で画面を確認し、ユーザーフロー全体を把握します
• デザイン上の文字数制限とレイアウトの制約を確認します

ヒント

1. コンテキストを具体的に伝えます — 「決済に失敗したときのエラーメッセージ」は「エラーメッセージ」より適切です。
2. ブランドボイスを伝えます — 「プロフェッショナルでありながら、温かみのあるトーンです」と伝えると、トーンを合わせやすくなります。
3. ユーザーの感情を考慮します — エラーメッセージには共感が必要です。成功メッセージではお祝いの気持ちを伝えられます。