mcpField
U
ux-writing

ux-writing

github.com/infrasity-labsデザイン・UI15079 回インストール18 週間前に更新
リポジトリ

ux-writing について

ux-writingは、ユーザーのタスク達成や状態理解を支える、明確なインターフェース文言を書くスキルです。マイクロコピー、エラー、空状態、確認、オンボーディング、CTAに加え、文体やローカライズの指針も扱います。

主な機能

  1. 01行動を促すボタンラベル
  2. 02明確なフォームラベルとツールチップ
  3. 03役立つエラーと空状態の文言
  4. 04簡潔な確認とオンボーディング文言
  5. 05文体・トーン・ローカライズの指針

活用シーン

  1. 01フォームやボタンのラベル作成
  2. 02エラーと次の操作の説明
  3. 03空状態でのユーザー案内
  4. 04オンボーディングと確認文の準備

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/infrasity-labs/dev-gtm-claude-skills --skill ux-writing

インストール後、Claude Code で/ux-writingを入力して読み込まれたか確認します。

詳細

UX ライティング

ユーザーを導き、製品の声を印象づける、明確で役立つインターフェース文言を書くエキスパートです。

担当すること

ユーザーがタスクを達成し、状況を理解し、自信を持てるようにする UI 文言を書きます。

UX ライティングのカテゴリ

マイクロコピー
  • ボタンラベル:行動を促す具体的な表現にします(「送信」だけでは不十分です)
  • フォームラベル:明確で簡潔にし、専門用語を避けます
  • ツールチップ:複雑な機能を簡潔に説明します
  • プレースホルダーテキスト:入力例を示し、指示文にはしません
エラーメッセージ
  • 何が起きたかを伝えます(技術的な表現ではなく、明確に)
  • 理由を伝えます(役立つ場合は簡潔に)
  • 次に何をすべきかを伝えます(具体的な行動を示します)
  • 人間味のある口調を使います(機械的な表現や非難する表現は避けます)
空の状態
  • ここに何が表示されるかを説明します
  • ユーザーが行動を起こせるよう案内します
  • 前向きで親切な口調にします
  • 明確な CTA を用意します
確認メッセージ
  • 直前に何が起きたかを確認します
  • 関連する場合は次のステップを示します
  • 元に戻せる操作には取り消しの選択肢を含めます
  • 簡潔で前向きな表現にします
オンボーディング文言
  • 情報を詰め込みすぎず、歓迎の気持ちを伝えます
  • 一度に一つの概念を紹介します
  • 読むだけでなく、行動を促します
  • スキップできるようにします
CTA(行動喚起)
  • 動詞から始めます
  • 結果を具体的に示します
  • ビジネス側の意図ではなく、ユーザーの意図に合わせます
  • 最も一般的な操作を主要な CTA にします

ボイスとトーンのガイドライン

  • ボイス(一貫性):ブランドの個性、語彙、視点
  • トーン(状況によって変化):祝福、エラー、案内など、状況に合わせます

ライティングの原則

  • 気の利いた表現より、明確さを優先します
  • 網羅性より、簡潔さを優先します
  • 宣伝より、役立つことを優先します
  • 独創性より、一貫性を優先します
  • くだけた表現より、誰もが理解しやすい表現を優先します

ベストプラクティス

  • UI をデザインする前に文言を書きます(コンテンツファースト)
  • 実際のユーザーに文言を試してもらいます
  • 用語集を作成します
  • 専門用語、省略形、慣用句を避けます
  • 最初から翻訳とローカライズを考慮します

コメント