はじめに

本書『UX ライティングの教科書』は、社内のデザイナーの方におすすめを受けて存在を知りました。ライティングの領域に対して、意識すべきこと、実践する上で注意するべきポイントを抑えるための脳内インデックスを作りたいというモチベーションから読み始めました。

実際に読んでみて、文量も多くなく、実践的な内容と参考事例も多く読みやすい内容でした。前半で得られる考え方を基に実践し、悩んだら後半にある実践的な内容を参考にしていくことで理解を深めることもできそうな印象を抱きました。

以降、特に気になった部分に絞ってメモを展開します。

本書の内容は？

  • デジタルプロダクトを開発する際に、ブランドのボイス&トーンをデザインし、それに基づいてマイクロコピーを書くための方法論について
  • Part 1
    • ブランドの ボイス&トーン を特定するプロセスについて解説
    • マイクロコピーを書き始める 前に 判断しておくべき点について
  • Part 2
    • マイクロコピーが持つ大きな力について解説
  • Part 3
    • マイクロコピーのユーザビリティに与える影響について考察

マイクロコピー

本書に度々するキーワード。どんな定義で、どんな役割を持ち、何をもたらすかは次のとおり。

マイクロコピーの定義

本書では次のような定義となっています。

  • UI に付記するちょっとした言葉や短文のこと
  • ユーザーが起こす行動に 直接 影響を与える
  • 行動を起こす 前に モチベーションを向上する
  • 行動に 伴って 指示を与える
  • 行動の後にフィードバックを返す

UX における役割

マイクロコピーがもつ役割は次のとおり。

  • 言葉はコミュニケーションの基礎
  • 人間味を感じ、ユーザーが自分自身との結びつきを見いだせるようなデジタルプロダクトを作るなら言葉は必須

デジタルプロダクトに与えるもの

マイクロコピーが日々僕らが関わるデジタルプロダクトに与えるものは次のとおり。

  • 1、ポジティブな UX を提供し、顧客エンゲージメントを高める
    • マイクロコピーは人と機器の違いを埋め、機能本位な関係性を脱し人間味や個性を感じさせる UX を提供する
    • 必要な局面で必要な言葉を差し出しサポートする
    • それらの言葉は心に働きかけ、ポジティブな感情を引き出し、ネガティブな感情を低減する
  • 2、ユーザビリティを向上させる
    • マイクロコピーは UI 上の作業がスムーズに進行するようサポートし障壁を軽減する
    • 必要とされる箇所に的確に表示される良質なマイクロコピーは、行動の過程で発生しがちな問題を防ぐ
  • 3、ブランディングを強化し差別化を図る
    • ブランド&顧客に対する理解に基づくマイクロコピーはブランドの特性を際立たせ、ブランドの差別化に役立つ
    • 研ぎ澄まされた言葉でブランドのビジョンや価値を伝え、ターゲットとなる顧客に重要なメッセージを届ける
    • それがブランドとユーザーとのあらゆるインタラクションを通して、信頼できる一貫した体験を提供する

ボイス&トーン

ボイス&トーンが何をもたらし、どのように取り掛かるのかについてです。

ボイス&トーンとは

ライティングの領域におけるボイス&トーンとは、ユーザーとデジタルプロダクトの間で 人間味のあるつながり を支える重要な役割を担います。まずはボイス&トーンというワードがどのようなものかです。

  • ボイス
    • サービスの性格のようなもの
    • 実際の人の声のように変わることのない一貫性を持ったもの
    • 文章にボイスを反映し設計することで、企業、ブランドの個性やキャラクタを表現する
    • ブランディングの一面を担う
  • トーン
    • サービスの態度のようなもの
    • 文章に情緒的な抑揚をもたせるもの
    • 人間味あるコミュニケーション、話し方

人々がコンピュータを操作やデジタルインターフェースと向き合っていても、まるでそれらが人間であるかのように振る舞うという研究結果1があります。具体的にどういうことか、次の一文が端的で分かりやすかったです。

私たち人間は自分に働きかけてくる存在を、一貫性のあるひとつの人格として捉えようとします。

だからこそ、デジタルプロダクトの振る舞いが実社会の慣習と一致せず、期待するような反応を示さなかったらネガティブな印象を抱きかねません。

言葉はデジタルプロダクトをより人間らしく感じさせる重要なファクターであるからこそ、その効果を発揮するためにデジタルプロダクト自体が社会の慣習に馴染み違和感がなく、信頼に足るものである方が好ましいです。 言語的要素と非言語的要素に一貫性があり、両者が互いを補い合うようなプロダクトだと知的で楽しく、説得力に富むと受け取る。そしてそういった感情の変化が実際の行動にも影響を与えます。

言葉の選択基準と適用

ボイス&トーンのデザインとは、あらゆるデジタルプロダクトにおいて、ブランドがユーザーとコミュニケーションを取るための言葉の使い方を決定する作業です。

以下 2 つの基準にそって言葉を選びます。

  • 1、パーソナリティ
    • どんなパーソナリティを伝える？
    • 適切な言葉づかいは？
    • どの程度ユーモアを織り交ぜる？
    • 伝達速度、感情表現はどの程度？
    • どのくらいフレンドリー？
  • 2、メッセージ
    • 主要なメッセージは？
    • 行動を促すうえで強調したいことは？
    • 何を伝えたらプロダクト、ブランドに肯定感を持つ？

ボイス&トーンが決定したらライティングに適用しますが、それは次のような効用をもたらします。

  • 明確な指針に基づいた選択となるので、目的に適ったものとなり読み手を動かす力を持つ
  • 読み手が提案の価値を、どのようなニーズを満たすか、を簡単に理解できるようになる
  • 行動喚起がシンプルかつ効果的になる
  • ブランドに対する信頼性が高まり、魅力を持ち、頼りがいのある存在として認知される

ボイス&トーンのデザインタイミング

原則 早ければ早いほど良い 。最初からあることが好ましくはありつつ、どんなタイミングでも遅すぎることはありません。

とはいえ「具体的にはどんなタイミングで？」という疑問を持ちましたが、以下 7 つの重要な局面がチャンスとなるようです。

  1. 新規ブランドを立ち上げるとき
  2. 新規の、またはアップグレード版のプロダクトをリリースするとき
  3. ブランド差別化を強化するとき
  4. 新しいデジタルキャンペーンを展開するとき
  5. 組織全体でも維持ベースのコミュニケーション用インフラストラクチャー2を作成、またはアップグレードするとき
  6. 新しいマーケットに新しいターゲット顧客を設定して参入する前
  7. 現在使用している言葉がうまく機能していないと思い知ったとき

読了後、数々のチャンスを逃していたかなと反省がありました。。

ボイス&トーンのデザイン手順

一連のデザインプロセスに対する成果物は ボイス&トーンのスタイルガイド となります。マイクロコピー、コピーライティング、コンテンツの作成、ブランドが公式に発する文字情報を書くときは作成したスタイルガイドに従います。

後述する 4 つのステージを経て最終的な成果となりますが、事業状況によってどのレベル感までやるべきかの指針は次のとおり。

  • 中規模企業以上の企業
    • 第 1〜4 ステージすべてを実行したい
  • 小規模企業
    • 第 2、3 ステージだけでも実行したい

第 1 ステージ：ブランドを知る

本書の中で第 1、2 ステージの内容は特に深堀りされています。ざっくりとまとめると次のような流れです。

  • 1、ビジョンとミッションを定義する
    • 発信する言葉はすべてビジョンやミッションに基づき、それを推進するものであるべき
    • 定義する作業は複雑で理解に手間取るため、簡単に済ませようとせず十分に時間をかけるべき
    • 本書 48P の質問リストが工程の参考となる
    • また本書では『なぜなぜ分析』として、ブランドのキーパーソンにそれがなぜかの質問を繰り返し核心に迫る手法が TIPS として紹介されている
  • 2、価値を定義する
    • ブランド活動の指針となる理念、基本方針を明らかにする
    • ブランド活動の最重要価値を 5 つ選定する
    • 選定した価値それぞれに 1〜3 行程度の言葉で説明する
    • 説明は次の問に答えられる内容が良い
      • これはどのような性質の価値か？
      • この価値はうまく伝えるのはどんな言葉か？
  • 3、パーソナリティを言葉で伝える
    • そのブランドがひとりの人間だとしたら、を明らかにする
    • ここでも本書 48P の質問リストが活用できる
    • 注意点として、ブランドの個性=ユーザーの個性とはならない
      • ユーザー像は彼らとどのような関係性を築きたいかに応じて変化する

第 2 ステージ：ユーザーを知る

ブランドを深く知ることができたら、次はユーザーのことを知る必要があります。具体的な工程は次のとおり。

  • 1、ユーザーの人口構成を明らかにする
    • 人口統計的な特徴を抑え、語りかけたい人となりを明確にする
    • 次の属性は明らかにできると良い
      • 年齢
      • 性別
      • 生活圏
      • 教育レベル
      • 配偶者の有無
      • 他に興味ある分野
      • テクノロジーへの興味と度合い
  • 2、ターゲット顧客のニーズと問題を見極める
    • ユーザーが実際の操作において感じる実際の障壁、負担を彼ら自身の言葉で聞く
    • 発信するメッセージが、ユーザー自身の考えについて言及したいとき、ユーザー自身の言葉をそのまま使うのが ○
      • ユーザーの言葉は的確で貴重な名言
    • 次のような場所でユーザーの言葉を拾うことができる
      • オンラインチャットの記録
      • サーベイを実施した際のオープンクエスチョンへの回答
      • 関連性のあるテーマを扱うオンラインコミュニティ
      • ソーシャルメディア上のブランド自身、協業他社へのフィードバックやコメント
      • ユーザビリティテストの記録
      • コールセンターの着信および発信の内容
      • フォーカスグループの筆記録
      • ターゲット顧客が関連テーマについて語るために利用する、あらゆる場所や環境、手段
    • 上述した資料がない場合、5〜10 人の見込み客、または友人・家族に依頼してインタビューを実施する
  • 3、ターゲット顧客の夢や希望を言語化する
    • ユーザーがあなたのデジタルプロダクトを使う目的を明確にする
    • 人々が行動を起こすには相応の理由が必要
    • ユーザーに行動を起こしてほしいときは 彼らの夢や希望を語る
    • そのためにもユーザーの心を射抜くことのできる言葉を知ることが重要
  • 4、ターゲット顧客の行動を阻む要因を見極める
    • ユーザーが障壁を感じると、プロダクト・サービスの利用に踏み出せない
    • マイナス要因になる箇所には特に注意を払う必要がある
    • 普遍的なマイナス要因としては以下のようなものが挙げられる
      • 金銭的な負担
      • 個人情報の提供
    • マイナス要因をリストアップした上で分析し、納得できる理由をユーザーに知らせる
  • 5、ターゲット顧客が特定のブランドを好む理由を調べる
    • ブランドが持つ競争優位性は何かを明確にする
  • 6、ブランド、プロダクトとユーザーとの関係性を定義する
    • 長く続く望ましい関係性を目指して、ユーザーとの間にどのような関係性を築きたいかを思い描く
    • 具体的な関係性の例は次のとおり
      • 友人、親友
      • 師弟
      • ビジネスパートナー
      • 指導者と支持者
      • 売り手と買い手
      • スターとファン
      • 管理職と個人秘書
      • etc…

第 3 ステージ：関係者から最新の発信を聞き取り、成果をまとめる

  • 社内の主要メンバーに参加してもらい、構造化グループインタビューを実施
    • 具体的な質問例は本書の 48P
  • インタビューは 1on1 形式ではなくグループでの実施がおすすめ
    • グループとすることで関係者感の見解相違をすぐに解決できる

第 4 ステージ：集めた情報を統合し、スタイルガイドを作成する

ボイス&トーンの活用法

いざ出来上がったボイス&トーンのスタイルガイドは次のように活用されることを期待されています。

  • 以下重要な 2 つの問に対する答えがある
    • どんなスタイルで書くべきか
    • どんな内容を扱うべきか
  • 指針としての活用
    • どんなスタイルで書くべきか、という問に対して進むべき道を示してくれる
    • スタイルガイドはあらかじめ十分に読み込んでおく
    • あとは必要に応じて見返すことで要点を思い出し、ぶれない表現ができる
  • 判断基準としての活用
    • どんな内容のメッセージを書くべきか、という問に対しては判断基準を与えてくれる
    • 行動への動機づけ、どんあ障壁があるか、それはどのように取り除けるか、最も効果的なメッセージは、など

ボイス&トーンのスタイルガイドに従うためには、古い慣習から抜け出し、都度新しく思考を広げていく必要があります。そして、成果物としてのスタイルガイドが出来上がったことはあくまでスタートラインで、その内容に従ってライティングを実践することが重要です。

会話体ライティング

書き言葉 は大抵、形式的で小難しくきちんとした言葉を使うように教えられます。話し言葉 は軽快で回りくどさがなく、耳馴染みがよく誰にでもわかりやすい気さくな言葉になります。これは、手紙を使った通信手段が一般的だった時代に書き言葉が使われることが一般的だったと本書では紹介されています。時代が移り変わりインターネットが普及してくると、電子メールが、更にはインスタントメッセージがその遅延のギャップを埋めました。普段のコミュニケーション（Facebook、ワッツアップ → 個人的には Twitter、Slack）は書いている？それとも話している？

インターネットは、書き言葉と話し言葉を分断していた古い壁を壊し、第三の選択肢を出現させた：会話体ライティングだ。 引用：カーメル・ワイズマン、イラン・ゴネン共著『インターネット・ヘブライ』19P

書き言葉と話し言葉のいずれか一方ではなく、両者の要素を併せ持つ新しい言葉。

血の通った人間味のある顧客サービス担当者は、信頼感と親しみを兼ね備えた体験をユーザーに提供します。ライティングを通して同じ体験を提供したいなら、インターフェース上に表示される言葉が実際に顧客と対面して語りかける言葉と同じ働きをすることを理解する必要があります。

会話体ライティングの原則

  • ユーザーに直接語りかける
  • あくまでも自然に
  • 短くまとめ、ポイントを抑える
  • 耳慣れた、いつも通りの言葉を使う
  • 能動態を使う
  • 流れを作る

不適切な言葉は厳禁

話すように言葉を使うことを良しとしますが、がさつな物言いのことを指すわけではありません。

  • 不適切な言葉とは
    • ぞんざい
    • 正確さを欠く
    • いい加減な言い方
  • 適切な話し言葉とは
    • 丁寧
    • 敬意に溢れている
    • 文法的に正しい
  • 上質な言葉とは厳格でかしこまった言葉のことではない

言い換えれば、インターフェイスはどちらの側面も備え得るし、備えるべきなのです。思慮深く振る舞いながら楽しげに見え、知的でありながら笑顔を輝かせ、礼儀をわきまえながら人当たりの良さも持ち合わせます。あなたの周りにいる人々も、きっとそうでしょう。

会話で口にしない言い方は厳禁

顧客サービス担当者の応対であるかのような印象を目指すべきです。

  • 書き言葉ではかしこまった会話でも口にしないような言い方をすることがある
  • 真にサービス志向でありたいなら、形式的で堅苦しい言い回しを手放す必要がある
  • それは 会話では口にしないような言い方をしない に従うこと
  • いくつか例示されているものが分かりやすかったです
    • ダイヤルしたい電話番号を入力してください → 何番におかけですか？
    • パスワードをお忘れの場合 → パスワードをお忘れですか？
    • あなたが購入を希望する製品 → あなたのお買い物リスト

会話体ライティングのテクニック

これら会話体ライティングを実践する上で参考になったテクニックは次のとおり。

  • 文章構造の違いを意識する
    • 書き言葉は受動態が多く、話し言葉は能動態が多い
    • 会話では目の前の人物に対してシンプルに能動態で尋ねるはず
      • 「どのような支払い方法をご希望ですか？」etc…
    • 話し言葉で使う能動態は話しかける相手を主語にした表現になる
    • マイクロコピーでは常に能動態を使う
  • 優れた会話体ライティングのためのヒント
    • 1、思い浮かんだままの言葉を使う
      • ユーザーがあなたの目の前に立っていると想像し、できるだけ自然にその場の思いつきに任せる
      • 二人一組でやってみると効果的
    • 2、音読する
      • 言い方が自然か、文章の流れがスムーズか、人間が言葉を発しているように聞こえるか
    • 3、味気ない定型文は避ける
      • その状況で本当に言いたいのはどんな言葉かを自問する
      • 会話の一部であるかのような文章を書くなら、定型文で間に合わせることは避ける
    • 4、質問をする
      • 質問をすることで、それに返事をするというやり取りの感覚が生まれる
      • 複数の人間が会話を交わしているような 流れ を作ることができる
      • 「パスワード送信先のメールアドレスを入力してください」→「このリンクの送り先はどこですか？」

モチベーションを高める 4 大原則

本書 Part 1 で紹介されたボイス&トーンの締めくくりとなる章。モチベーションを高めるライティングの原則についてです。

1. 行動の方法ではなく、行動することの価値を伝える

  • ユーザーは自身にとって価値のあるものかどうかを数秒で判断する
  • 数秒のうちに離脱せず行動を起こすことの価値を確実に認識してもらう必要がある
  • プロダクト、サービスを利用すると何を手に入れることができ、どのような問題が解決され、生活全体がどのように向上するかを伝える
  • ボイス&トーンのスタイルガイドに従い、シンプルで、明快で、なおかつ説得力をもたせつつ要点を伝える必要がある
  • コツ
    • ユーザーが利益を得るために必要な手順や方法を伝えるのではなく、ユーザーが何を得るかをテーマにして書く
  • 例
    • Before：正しい財産管理のための多彩なツール
    • After：債務ときっぱり決別しましょう or 債務に最後のお別れを
  • 陥りがちな罠
    • つい自身のブランドやプロダクトやサービスについて語りたがる
    • 語るべきはユーザーのことだけ
    • 何を与えるか、ではなくユーザーが何を受け取るか、が重要
  • ポイント
    • 文章の主語を語りかけている相手にすること
    • 例
      • Before：登録手続きが、迅速な支払いを実現します（主語が “登録手続き”）
      • After：ユーザー登録をすると、すぐに支払いができます

2. ニコニコ効果、ワクワク効果

  • メッセージの中にユーモアがあるとユーザーは自己肯定感を高め、インターフェースをより好ましく受け止め、提案を受け入れ協力的に動く
    • 堅いだけじゃだめ
  • ただし不快感を与えるような言い方には注意
    • 人種差別的な表現
    • 性差別的な表現
    • 必要以上の知性を必要とするものや、複雑な言葉遊び
    • 乗り越えなければならないくつうや困難をネタにするもの
  • 良質で罪のないユーモア だけにとどめるのがベター
  • ワクワクする気持ちがあると何らかの行動を起こしたくなり、何も決断しないままで済ませず、何かを決断したいと望むようになる

3. ユーザーに敬意を払う：行動へのお誘い

  • 常に目指すのは ブランドへの信頼と継続性、感情的なつながりのある関係性
  • 押し付けではなく、行動することの便益を説明し、扉を開いてくれ、決断を委ねてくれるような態度
  • コツ
    • 望ましい行動がどんな利益につながるかを説明し、それを実行するように誘う
    • 押し付けがましい表現は避け、前向きにやる気をひきだすような表現で

4. ソーシャルプルーフ：みんなで渡れば怖くない

  • 群集心理を使う
    • 社会的動物である人間は、自分の行動を周囲の人々の行動に合わせて決めるような心理的傾向がある
  • ソーシャルプルーフは CVR を劇的に高める
    • ポジティブなソーシャルプルーフをボタンのすぐ近くに配置するのがクリック率の向上に寄与する
  • ソーシャルプルーフの種類
    • 数の説得力
    • 具体性
    • 他のユーザーからの意見、感想、推薦
    • 格付け
    • 公式なアワード、プレスお好意的なレビュー
    • ソーシャルメディア
    • 他のユーザー

これ以降はよくある UI ごとにボイス&トーンを活かしたメッセージを書くポイントについてです。個人的に気になった内容だけ簡単にまとめていきます。

会員登録フォーム

  • 1、タイトルを変更する
    • ユーザーを「ユーザー」と呼ぶことをやめる
      • 「登録済みユーザーはログイン」などの言い方は NG
    • 「会員登録」「登録」「アカウントの作成」など、ユーザーが現在の状況と、ここからやるべき操作を理解できる言葉を使うこと
    • 会話体ライティングが活きる部分でもある
  • 2、会員登録がなぜ彼らにとって望ましいかを伝える
    • 貴重な時間を使ってなぜ登録手続きをするのか、をきちんと伝える
    • 未登録だと手に入らず、登録して初めて享受できる利益をリストアップする
    • その中で特に重要な項目を箇条書きする → 2〜3 個で十分
    • 内容を十分に検証し、ユーザーにとって本当に利益となるような重要な項目を選ぶ
  • 3、障壁を取り除く
    • ユーザーが感じる障壁の代表例
      • フォームの入力欄を埋める作業に時間と手間がかかる
      • メールアドレスを知られて大量のスパムメールに悩まされたくない
      • 後から何らかの支払いを請求されるかもしれないという不安
    • これらに言及し、不安を取り除く必要がある
    • 加えて、ボタンと成功メッセージ、エラーメッセージをちゃんと仕上げること
    • 特にボタンには行動喚起につながる言葉を入れたい

寄り道「登録 vs サインアップ vs 参加する」

TIPS として紹介されていた 「登録 vs サインアップ vs 参加する」 が個人的に気になっていた疑問だったりしたので取り上げます。

  • サインアップ
    • 手続きが簡単かつ迅速であるという印象を与える言葉
  • 登録
    • ユーザーがフォームの入力欄に数多くの詳細な情報を入力することが必要な場合に適した言葉
  • 参加する
    • コミュニティに参加する感覚を伝えたい場合なら「参加する」
  • サインイン vs ログイン
    • サインアップとサインインはできれば画面に並べない
      • ユーザーが区別しにくく迷いが発生しがち
    • サインアップという言葉を使うなら、組み合わせる言葉は「ログイン」にする
  • 注意点
    • 「登録」を一度使ったら、別の箇所でも同様に「登録」を使う一貫性を常に保つこと

お問い合わせ

お問い合わせはユーザーが組織、企業のことをよく知ろうとしているとき、または何らかの援助が必要なときに頼る場所。そのため、他のページ以上に温かくユーザーを迎え入れるようなサービス志向であるべきです。良質なお問い合わせを作るには、ユーザーがどのような状況でお問い合わせを利用する必要に迫られたのか、問い合わせることで何を達成したいのかを明確にし状況に合わせたメッセージを提供するべきです。

  • 1、見込み顧客のためのお問い合わせページ
    • 「お問い合わせ」というありきたいなタイトルから脱し、価値を伝えるタイトルに変更する作業から
    • コンタクトを取ることがユーザーにどんな便益があるかを伝える
    • ボイス&トーンのスタイルガイドを参考に
  • 2、顧客サポートのためのお問い合わせページ
    • どんな問い合わせにも喜んで、誠意を尽くして応じる姿勢を伝える
    • 厳密な言い方をする
    • 障壁を取り除く
      • サポートに関する問い合わせはすべて読むと約束し、回答に要する時間を伝える

エラーメッセージ

基本的には表示される状況が望ましくないものでありつつ、当惑しているユーザーのための応急手当として慎重に言葉を選び、ユーザーを確実に救い出す必要があります。そもそものトラブルを防止するような手法については後述します。

  • エラーメッセージが果たすべき 3 つの役割
    • 1、問題が発生した事実と、その問題の性質を簡潔にわかりやすく説明する
    • 2、解決策を提示し、ユーザーがすぐに元に戻って操作を完了できるようにする
    • 3、操作の遅れを、できるだけ好ましい経験に変える
  • エラーメッセージのポイント
    • 解決するべき技術的問題を扱う必要があるため、文面をわかりやすく、実際的にすることが大切
    • エラーによって不快な思いをさせているからこそ、ごまかしのない人間的な言葉で、操作の遅れが引き起こす不快感をできるだけ和らげる
    • 優秀な顧客サービス担当者ならどんな言葉をかけるだろう、というような言い方を目指すべき
  • 二段構えの理想的なエラーメッセージ
    • 1、問題の性質を伝え、何がエラーとなっているかをできるだけ正確に説明する
    • 2、その問題を解決して操作を続行する方法について、建設的にアドバイスを提供する
  • 例外
    • 会員登録フォーム、ログインに関する一般的なエラーメッセージ（パスワードの不当性など）は、場合によって説明を省くことができる
    • ユーザーがこの手のエラーを経験する機会が多いため、問題の性質と解決方法を知っているため
      • この辺の話はターゲットとなる顧客による
  • 適切なエラーメッセージを書くために確認するべき事柄
    • 1、エラーが発生したとき、ユーザーは何をしようとしたか？
    • 2、システムはなぜエラーという反応を示したか？
    • 3、ユーザーが何をすれば操作を続行し完了できるか？
    • 4、解決策がない場合、別の選択肢をユーザーに提供できるか？（サポートセンターに問い合わせるなど）
  • エラーメッセージのボイス&トーン
    • 会話体ライティングを活用し、ユーザーにとって有用で読みやすいメッセージを提供する
    • 堅苦しい言い方や高圧的な言い方、指示を与えるような言い方は避ける
    • エラー、または失敗という言葉を使わずに書く
    • 技術的な用語や専門性の高い用語を避ける
    • 何がいけないかを伝えるのではなく、どうすればよいかを伝えるのがポイント

成功メッセージ

気になったところが多くはありませんが、一部抜粋。

  • 成功メッセージが持つ 3 つの目的
    • 1、核心を提供する
    • 2、指示を与える
    • 3、気持ちを通わせる
  • 次のステップを伝え、行動を促す。以下は一例
    • 現在どのような処理がどう進行中かを伝える
    • ユーザーにメールを送信した場合、受信トレイを確認するように促す
    • ユーザーに実行してほしい行動を伝える
      • プロダクト利用を開始するための導線配置など
    • それ以上の操作がない場合、本来重要な他のページ（商品紹介ページ、記事コンテンツなど）やユーザーの興味対象となる別のコンテンツに戻す

エンプティステート

本書で紹介されるいくつかのパターンについては省略。

  • 機能利用の開始前エンプティステート
    • あらゆるアプリのうち 77% はダウンロードから 3 日以内に削除される
    • すべてではないにしろ、利用開始時のエンプティステートはユーザーの第一印象を左右する重要な役割を担う
    • ユーザーが利用したことのないページや機能にはじめてアクセスするときは、それらのポテンシャルを伝え、利用を促すチャンス
  • 検索結果のエンプティステート
    • ユーザーへのメッセージでシステムの説明をしたり、クエリやバリューという用語を利用することは避ける
    • ユーザーに対して検索のやり直しを勧めることも避ける
      • 同じことの繰り返しはストレスになる
    • ユーザーを行き止まりの場所に放り出さないことが大切で、次の行動へと導く
    • 1、状況を説明する
      • 探している状況が見つからないことをきちんと伝える
      • 共感的な言葉や、場合によってはユーモアを取り入れる
    • 2、下記いずれかの対策を講じる
      • 同じ情報を探すための別の方法を提案する
      • 検索した条件に近い情報を提供する
      • もしかして ○○ ではありませんか？

プレースホルダー

a11y の文脈で語られるベストプラクティスに沿うことが、本書で語られている良しとされるプレースホルダーを構成しています。そのうえで改めていくつかのポイントをまとめます。

  • 余計なフィールドラベルが表示されるケースが増えている
    • スマホの普及によって、限られた画面の中で表現する手法が一般化した
      • 入力欄にプレースホルダーとしてフィールドラベルが配置する手法
    • そしてこの手法はデスクトップでも通例となった
    • 手法が普及しすぎたことで、本来不要なフィードラベルが表示されているようなケースが増えている
  • 2 つの基本原則
    • 1、ラベルとプレースホルダーを区別する
      • ラベルはその欄に入力するべき情報をユーザーに伝えるためのタイトル、または質問
      • これがラベルの唯一の役割
      • ラベルはラベルとして独立させ、入力欄の外側に配置し目立つ色で常に表示する
    • 2、もっともな理由がない限りプレースホルダーを使わない
      • ユーザーの視線が真っ先に引きつけられるのは空白の領域
      • 空きスペースを埋めようという考えからプレースホルダーを配置するべきはない
  • 役立つケース
    • 1、ぜひ入力してほしい欄
      • サイト内の積極的な回遊を促す検索ボックス
      • プロダクトの主要な目的を果たすために欠かせない入力欄
    • 2、回答を特定しづらそうな質問や、回答を敬遠される可能性のある質問に対する回答欄
      • 時間をかけて考える必要があるオープンクエスチョン
      • 回答することに抵抗感を抱きかねない質問

ボタン

  • ボタンは決心が行動に移されるかどうかの分岐点
    • そのためボタンのライティングには十分に時間をかけ、丁寧に言葉を選ぶ必要がある
    • ボタンに関する基本原則を抑えることも重要だが、とにかく A/B テストを始めとした様々な テスト が重要
  • ユーザーが決意を固めるための助け
    • どうやって手に入れるか、ではなく何を手に入れるか
    • 汎用的なボタン（ダウンロード、検索、送信、登録）は助け舟にならず、それまで入手してきた情報を思い出す必要がある
    • 価値 + レレバンス = コンバージョン
      • レレバンス：関連性、自分との結びつき
    • ユーザーが得るもの（価値）を伝えることでコンバージョンに繋げる
  • ライティングに力を入れるべきなのはコンバージョンや、その他の重要な行動に直結するボタン
  • 標準化され、ユーザーが使い慣れているようなボタンはそのままに
    • 続行、買い物かごに入れる、チャットに参加する、安全は支払い、編集、共有、まとめ、アップロード、保存、など
    • 普段と違う言葉があると、逆に不安を煽る
  • クリックトリガー
    • ボタンのすぐ近くに書かれる短いメッセージのことを クリックトリガー と呼ぶ
    • ボタンの上に書かれるメインのマイクロコピーと同様、CVR の向上に寄与する
    • クリックトリガーの目的は、ユーザーが次の局面に進むかどうかを決めるタイミングで、的確な言葉でそれを後押しすること
    • また、クリックという行動に付随する障壁を取り除き、ユーザーが進もうとする道を整備する働きもする
    • a11y の観点（スクリーンリーダーの読む順序）から、対象となるボタンより左にあることが望ましい
  • 会員登録ボタン
    • 会員登録をする気になった理由を思い出させる言葉を適切に使うのも効果的
    • 会員登録フォームの最後に設置する登録ボタンには、登録後どんな便益を受け取るか、何ができるようになるかを踏まえ興味や意欲を高める言葉を選ぶのも良し
    • 会員登録後に割引など特典があれば、ボタンに書くのはいい方法
  • キャンセルボタン
    • 何をキャンセルするボタンなのか、を明確にしないと混乱を招く
    • 以下に記載した任天堂の UI に対する話と近い印象を抱いた

また「人はななめ読みする」という習慣を利用して、メッセージなどでは左上と決定ボタンに「消去」などメッセージの主題を示す言葉を意識して置くようにしている。Nintendo Switch の本体機能で「はい」、「いいえ」の表示が出ないのは、「全部を読まないとメッセージの意味がわからない」という事態を防ぐためだそうだ。 【CEDEC 2018】明快で軽快！ Nintendo Switch の UI を触るだけで楽しい理由 - GAME Watch

待ち時間

  • ここでいう待ち時間とは、ページの読み込み、データの処理、検索、ファイルダウンロードなど、完了を待つ時間のこと
  • 動画や、時間の経過とともに変化するテキストやバーがあると、ユーザーの知覚上の時間は短くなる
    • 読むもの、見るもの、変化を追えるものなど、注意を向けられるものがあると時間が経つのを早く感じる
  • システムがどんな処理を実行中かを伝える

マイクロコピーとユーザビリティ

わかりやすさと実効性をもたらすマイクロコピーについてのパートです。ユーザビリティを向上させ、障壁をできる限り取り除いてユーザーが期待するプロセスを手早く簡単に完了できるように、どのようにマイクロコピーを活用するべきか、といったものです。

基本原則

  • 必要なときだけ、正確に、簡潔に、シンプルな言葉を使ってメッセージを届ける
    • 法律用語を操るような無表情な定型的なライティングでなく、必要な局面でできるだけ少ない言葉で助言する
  • 簡潔に書くことは必須だが、気にするべきは単に文量ではなく ユーザーが実際に援助を必要としているか どうか
    • ユーザーに口出しをしすぎないつもりで重要な説明を省略するようなことは NG
  • フォーム画面にマイクロコピーを表示する 4 通りの方法
    • 1、静的表示
      • 利点：ユーザーが見落とす心配がない
      • 欠点：フォームがやや見づらくなる可能性がある
      • ケース：操作方法の理解を促すことが必要不可欠であり、その内容が見落とされる心配がないようにしたい場合
    • 2、オンデマンド表示（アイコンからのツールチップなど）
      • 利点：いつでも簡単に情報を入手でき、そのフォームを利用し慣れているユーザーにとっては読まずに済む
      • 欠点：重要な情報を受け取り損ねるリスクがある。避けたほうが良い情報は 1 にフォールバックする
      • ケース：
        • 表示するべき情報や指示が多く、画面がごちゃごちゃしそうなとき
        • ユーザーに基礎知識や背景説明を提供したいとき
        • 繰り返し行われる行動
    • 3、自動表示（フォーカスなど）
      • 利点：必要なときにはいつでも読め、それ以外のときはフォーム内の文字を減らすことができる
      • 欠点：その情報を必要としなくなった再訪ユーザーが何度でも繰り返し表示される
      • ケース：
        • 情報や指示が多い場合
        • 1 回限りの行動
        • ユーザーがプロセスを実行している場合、サポート担当者がすぐ近くに待機しているような印象を与えたい場合
        • 重要でありながら不定期に行うだけの行動
    • 4、プレースホルダー
      • 利点：見落とされることない
      • 欠点：文字が消えるとその情報を見ようとしても見れない
      • ケース：
        • 短い指示を伝えるとき
        • プレースホルダーが表示されなくなっても、もう一度その情報を見る必要がない場合
        • 書き出しの一文をユーザーに提供したいとき
        • 入力欄に正しく記入できるよう、短い文例を提示したいとき
  • マイクロコピーが必要な箇所の見つけ方
    • ユーザーとインターフェースとの間に噛み合わせが悪い要素が生じそうな箇所にマイクロコピーが必要
    • 活用すべきリソース
      • ユーザビリティテスト
      • 顧客サポート担当者からの吸い上げ
      • モニタリングと解析ツール（ヒートマップ分析ツール）

知識のギャップを埋める

  • すべてのデジタルプロセスは、大小はあれど理解しきれず不安を抱かせる
    • 製作者の立場にいれば全体像が見えているが、ユーザーから見れば目の前の 1〜2 ステップがせいぜいなため
  • マイクロコピーはそうした不安や疑問に対して、すぐに答えを差し出すことができ、信頼感を与えることができる
  • 知識の呪い
    • すでにある程度の知識を持っている人は、その知識を持たない人の視点から見れない
    • 作り手と使い手のギャップ
  • 多くのユーザーが直面する疑問の例
    • 「これは何？」
      • 社内でしか使わない用語、ユーザーにとって馴染みがない、初めて知るような用語を「これは何？」と問いかける
      • それぞれの用語をよりシンプルな言葉で言い換えられるか検証する
      • シンプルに言い換えることができない場合はマイクロコピーを追加して説明する
    • 「どんな機能？」
      • 何が実行され、されないのか、どう機能するかわかりにくい場合にマイクロコピーを入れる
      • おすすめの機能、活用してほしいものは中立的で実用本位な説明だけに留めず、興味を掻き立てるような行動喚起メッセージが ○
    • 「その情報はどこに？」
      • 特殊な情報（運転免許区分、種類、公共料金のお客様番号など）の提供を依頼するフォームでは、入力欄の近くに説明文をいれる
      • どこを探せばその情報が見つかるかを伝えたい
      • ダッシュやスラッシュなどの記号を含む場合は、それをそのまま入力するのか、そうでないのか、要領を伝える
    • 「どう使えばいい？」
      • ドラッグ、タイプ、クリック、選択などの操作上の指示をどの程度必要とするかはユーザビリティテストが一番の方法
  • 説明の必要がない箇所
    • ユーザーがすでに何をすればよいかわかっているもの
      • 入力欄、ボタン、プルダウンメニュー、感嘆符や疑問符のアイコン、リンク、アスタリスク、ラジオボタン、チェックボックス
    • 「あたなのメールアドレスを入力してください」と書かずとも伝わるケースがほとんど
    • 例としてプルダウンメニューのプレースホルダーに「○○ を選ぶ」というケースが紹介されていた
      • これは不要であり、気にしていないと個人的にやりがちだと感じた
  • 説明の必要がある箇所
    • プロダクトがニーズに合わせて独自のインターフェースを開発した場合
    • インターフェースが比較的新しいタイプのものである場合

不安や懸念を軽減する

  • ユーザーは多くの場合インターネットを活用する上で常に警戒し疑いを持つ
  • 信頼は努力の上に成り立つため、心情面と実用面かの双方からユーザーの立場にたち作る必要がある
  • ユーザーの不安や懸念を呼び起こす例と克服する手段
    • 1、メールアドレスを教えること
      • メールが大量に送られてくるのではないか
        • メルマガの配信頻度を伝える
        • 購読の中止はワンクリックであることを伝える
      • メールアドレス情報が第三者に提供され、そこからスパムがひっきりなしに届くのではないか
        • 第三者への提供がないことを伝える
    • 2、特別な個人情報を提供すること
      • 入力必須項目である場合、なぜ詳しい情報を必要とするかを説明し、個人情報を保護することを伝える
      • 任意項目である場合、何に役立ち、どのような利益をもたらすかを説明する
    • 3、ソーシャルメディアのアカウントを利用する会員登録
      • 以下の約束を伝える
        • 彼らの名前で投稿することはない
        • 彼らの情報を第三者にわたすことはない
    • 4、決済のセキュリティ
      • クレジットカード情報が安全に守られているか
        • 決済の周辺 UI に対して事前にすくい上げ、解消する必要がある
        • 暗号化されていることを伝える
    • 5、無料トライアル
      • 期間が終了したら課金されるのではないか
        • 決済情報を必要とするしないに関わらず、決済がどのようなタイミングで行われるかをはっきりと伝える
    • 6、入力値や設定の内容
      • 変更できるのか、後からでもいいのか
        • この仕組について伝える
    • 7、ダウンロードまたはインストール
      • 余計なものまでインストールされるのではないか
        • そうじゃないことをはっきりと伝える

エラーやトラブルを防止する

エラーメッセージについてはすでに触れていますが、事前に防止する策についてです。本書では 5 つの予防策が紹介されています。フォームの UX に関するコンテンツは様々読んだこともあり、あまり新しい発見はなかったかなと感じたため、項目のみ列挙しています。

  1. 入力必須項目
  2. 記号や特定の書式
  3. サイズや範囲、長さの制限
  4. パスワード
  5. 実世界で発生する問題

複雑なシステムのためのマイクロコピー

  • 複雑なシステムとは
    • 互いに関連し合う多くのコンポーネントで構成されるシステム
    • ユーザーは機能的なニーズ、専門的なニーズに応じて利用する
    • 操作方法が線形でなく、多様なタスクを完了するために何度も繰り返しシステムにアクセスする
  • 複雑なシステムの種類
    • エキスパートシステム
    • イントラシステム
    • 一般ユーザー向けの機能的なシステム
  • マイクロコピーの方向性
    • 専門用語や技術用語を簡単な言葉に言い換えるのが鉄則だったが、複雑なシステムを対象とした場合は専門用語を使うことが必要
    • ユーザーが普段から仕事の現場で使い慣れている用語を使い、ユーザビリティを担保する
    • その分野のためのエキスパート向けに提供されている、専門性を証明する
  • 専門性に優れていること
    • 格調高く仰々しいものではなく、目指すべきはシンプルで正確な言葉
    • これまでの話であった通り、シンプルで、正確で、実用的で、アクセシブルな言葉を使う
    • それが理解の手助けとなり、利用するユーザーの専門性のレベルに左右されずに利用できることに繋がる
  • 経験豊富な上級者向けシステムには特有の問題がある
    • 旧来のボイス&トーンを変更したくても難しい、というもの
    • とはいえ、遅かれ早かれシステムを進化させたいなら、どこかの時点で着手する必要がある
    • 付随的な要素は時代とともに変わっても、多くの場合専門用語は変わらない
    • マイクロコピーの変更は、総合的なボイス&トーンのスタイルガイドを完成させたうえで、残すもの、変えるものを決めておく

  1. スタンフォード大学教授クリフォード・ナス、コリーナ・イェンの共著『お世辞を言う機会はお好き？』（邦訳、福村出版） ↩

  2. メール、チャット、ソーシャルメディアなど ↩