UXライティング
画面の文言は、最後に流し込む飾りではなく、設計の一部です。分かりやすく書けない画面は、たいてい機能のほうが整理されていません。
図の中身を文字で読む
- ✕ 何が起きるか分からない ○ 結果が分かる
- ボタン 送信 無料で相談する 押した後に何が起きるか
- メールアドレスの形式をご確認ください
- エラー 入力が正しくありません 例: name@example.com
- まだ制作事例が登録されていません
- 空状態 データがありません 最初の1件を登録すると、ここに一覧が表示されます
- 確認 はい いいえ 編集を続ける 破棄して閉じる
- 何に対する回答か分からない 動詞で結果を書くと誤操作が減る
- 不安を消す一文が最後の一押しになる。「相談のみでも承ります」「後から変更できます」「3営業日以内にご連絡します」
ひと目で#
- UXライティング
- 画面の上の文言を、迷わず動けるように設計すること
- マイクロコピー
- ボタンのラベル、補足の一文、確認の文言
- トーン・オブ・ボイス
- 一貫した話し方の方針。書き手が変わっても印象を保つ
- 平易な言葉
- 一度読んで分かる書き方
- ダークパターン
- 意図しない選択へ仕向ける設計。境界を知っておく
分かりやすく書けない画面は、多くの場合、機能そのものが整理されていません。
使い分け#
| 場面 | 書き方 |
|---|---|
| ボタン | 動詞で結果を書く。「送信」より「無料で相談する」 |
| 確認 | 「はい／いいえ」ではなく「削除する／キャンセル」 |
| エラー | 何が、なぜ、どう直すかの3点 |
| 空状態 | 説明と、最初の操作への導線 |
| 押す直前の不安 | 一文で消す。「相談のみでも承ります」 |
| 完了 | 次に何が起きるか。「3営業日以内にご連絡します」 |
間違えやすいところ#
- 文言を最後に決める設計の一部であって、あと付けの飾りではない
- 開発者向けの用語をそのまま出す利用者には意味が通じない
- 短くすることだけを目指す要る情報が欠けると、かえって迷わせる
- すべてを丁寧語で長くする冗長になり、要点が埋もれる
- 不安をあおる文言を使う短期の数値は上がっても、信頼を失う
- 「今すぐ」「限定」を多用するダークパターンとの境界に近づく
- 開発中の仮の文言を残す「テキストが入ります」が公開される事故は珍しくない
- トーンを形容詞だけで決める「親しみやすく」では判断できない。具体例と禁止例を書く
ダークパターンの類型#
こっそり追加、解約の妨害、偽装広告、誤誘導、確認の羞恥、偽の緊急性、同意の事前選択。判断の基準は、利用者が事実を正しく理解したうえで選べるかどうかです。
図の中身を文字で読む
- 境界は、事実を正しく理解したうえで選べるかどうか
- 急かすこと自体が悪いのではない。事実と違うのが問題。
- ○ 事実のまま書く ✕ 事実を歪める
- 金曜の夜は埋まりやすいため、早めのご予約を 今すぐ予約。残り3枠
- 実際に埋まりやすい曜日だけに出す 空きは3枠ではない。型: 偽の緊急性
- オプションは、選ぶと金額に反映されます 保険オプションが最初からチェック済み
- 初期は未選択のまま置く 気づかず買う。型: 同意の事前選択
- 解約はマイページから、いつでも手続きできます 解約の導線がヘルプの奥にだけある
- 導線をナビに置く たどり着けない。型: 解約の妨害
- 「今すぐ」「限定」を使ってよいのは、それが事実のとき。短期の数字と引き換えに、信頼を失う。
急かすこと自体が問題なのではありません。同じ「早めのご予約を」でも、それが事実なら案内で、事実でないなら偽の緊急性です。
直す例#
架空の案件を1つ例にとります。どこを見て、何をどう直すかを書きます。
例として、予約を増やしたい、という相談で「今すぐ予約！残り3枠」と出す案が挙がりました。実際の空きは3枠ではありません。事実と違う緊急性は「偽の緊急性」というダークパターンの型で、短期の数字と引き換えに信頼を失います。代わりに、本当のことだけを書きました。「金曜の夜は埋まりやすいため、早めのご予約をおすすめします」。埋まりやすいのは事実だからです。迷った文言は、利用者が事実を正しく理解したうえで選べるかという1本の線に当ててから出します。
確認する#
- ボタンの文言だけで、押した結果が読める
- 緊急・限定の文言が事実と一致している
- 仮の文言（「テキストが入ります」等）が残っていない
この話が要る場面#
このページが答えになる、現場の困り事です。困り事の側から探すと、同じ場所に着きます。
押すと何が起きるかを書く。「送信」より「見積もりを依頼する」。
このコードで動いている見本です
主語を利用者にする。名詞止めをやめて動詞で書く。
NG: お問い合わせフォーム OK: ご質問を送る
読者が日常で使う語なら使う。使わない語なら、初出で言い換えを添える。
このコードで動いている見本です
この場面のほかの困り事と、そのまま貼れる部品は部品を選ぶ、迷わせないにまとめてある。逆引きには全188件。
場面から選ぶ#
場面を選ぶと、そのまま使える文言の案が理由つきで並びます。固有名詞と数字を自分の案件に置き換えて使ってください。見本の題材は、常盤野市の整体サロンです。
送信ボタンは、動詞で結果を書きます。
✕ よくある文言
何が送られ、そのあとどうなるかが読めません。フォームの最後まで来た人を、最後の一押しで迷わせます。
案1 結果をそのまま書く
動詞で結果を書いた形です。ラベルだけで、押したら申し込みになると分かります。
案2 まだ確定しないと伝える
確認ステップがあるフォームでは、まだ確定しないことをラベルで伝えます。確定への不安で手が止まる人には、こちらが効きます。
案3 手前の一文で不安を消す
日時の変更やキャンセルは、前日までメールで承ります。
押す直前の不安は、ボタンの手前の一文で消します。上の表の「相談のみでも承ります」と同じ働きです。
削除の確認は、「はい／いいえ」ではなく動詞の対で書きます。
✕ よくある文言
確認
本当によろしいですか？
何への「はい」なのかを読み直させます。急いでいる人ほど押し間違えます。
案1 動詞の対にして、対象を特定する
この予約を取り消しますか
12月5日（金）19:00 肩まわり 60分
ボタンが動詞の対なので、どちらで何が起きるかが読めます。対象の日時を本文に書き、別の予約との取り違えも防ぎます。
案2 戻せない操作は、失うものを先に書く
アカウントを削除しますか
予約の履歴も消えます。この操作は元に戻せません。
戻せない操作では、何を失うかを本文の先頭に置きます。ボタンは「削除する／キャンセル」。上の表の使い分けのままです。
入力エラーは、何が・なぜ・どう直すかの3点で書きます。
✕ よくある文言
入力内容に誤りがあります。
3点がどれもありません。どの欄が悪いのかも分からないので、全部を見直させることになります。
案1 3点をそろえる
電話番号に使えない文字が入っています。数字とハイフンで入力してください。例: 072-000-0000
何が（電話番号）、なぜ（使えない文字）、どう直すか（形式と例）がそろっています。やり直しが1回で済みます。
案2 なぜ必要かを添える
お名前が入力されていません。予約の確認のご連絡に使います。
必須の理由まで書く形です。何に使うかが分かると、入力の抵抗が下がります。
案3 通る値の側を示す
この時間は受付を終えています。19時までの枠からお選びください。
どの値なら通るのかまで書きます。「無効な値です」と違い、次の入力が決まります。
空の一覧には、説明と、最初の操作への導線を書きます。
✕ よくある文言
データがありません
開発者の言葉です。壊れているのか、まだ何も無いだけなのかも伝わりません。
案1 初めての状態を案内板にする
まだ予約はありません。
空き状況から日時を選ぶと、ここに表示されます。
空き状況を見る
説明と、最初の操作への導線の組み合わせです。空の画面が、次の一手の案内板に変わります。
案2 検索の0件は、条件の直し方を示す
この条件では見つかりませんでした。
日付を広げるか、時間帯の指定を外すと増えます。
0件を行き止まりにしません。どの条件を緩めれば増えるかを、具体で示します。
完了画面には、次に何が起きるかを書きます。
✕ よくある文言
送信が完了しました。
送れたことしか分かりません。確定なのか、返事を待つのかが読めず、確認の電話を招きます。
案1 いつ、何が起きるかを書く
予約の申し込みを受け付けました
1営業日以内に、確定のご連絡をメールでお送りします。届かないときは 000-0000-0000 へお電話ください。
次に起きること（いつ・何が届くか）と、起きなかったときの逃げ道まで書きます。待つ側の不安が消えます。
案2 次の行動に要る情報を渡す
ご予約が確定しました
当日は動きやすい服装でお越しください。タオルはこちらでご用意します。
完了画面は、ほぼ確実に読まれる場所です。当日に要る情報をここで渡すと、前日の問い合わせが減ります。
文言を流し込む器はパターン集にあります。エラー付き入力欄・空状態・確認ステップ付きフォーム・成功・エラーアラート・ボタン行。
場面の切り替えとコピーは JavaScript で動きます。無効の場合は、5場面の文言が全部並んで表示されます。