UXライターやデザイナーが道路標識から学べること

Jonathan Deesing

JonathanはUXライター、ポッドキャスター、ゲームデザイナーである。

この記事はThe UX Boothからの翻訳転載です。配信元または著者の許可を得て配信しています。

What UX Writers and Designers Can Learn from Street Signs

あなたは今、馴染みのない高速道路を走っていて、目的地に着くためにどの出口で降りるべきか探しているとします。目を細めて見ると、前方に慣れ親しんだ大きな緑の看板が目に入ってきました。これで出口がわかります! しかし、あなたは時速110キロの速度で走行していて、周囲にはあなたの気を散らせるものがあふれています。トラックや運転の荒い車も走行しているため、標識を見て必要な情報を探り出すことができるのは一瞬だけです。

標識はその一瞬でも分かる優れたものでなければいけません。

短い言葉や記号だけで多くの意味を伝えるということは新しい発想ではありません。道路標識は数十年もの間、UXライティングと同じ基本原則に基づいてきました。行動喚起(CTA)、邪魔にならない案内、万人に理解できる記号であることは、ソフトウェア開発と同じくらいに道路標識でも重要です。道路標識を最適化する規律はおよそ100年前に定められ、現代にも根強く残っています。たとえば、アメリカ合衆国の運輸省は標識のガイドライン、ルール、解釈が記載された分厚い法令集を保持しており、これは起こり得るほとんどすべての運転状況をカバーしています。つまりUXライターは、ただの金属板ではないこれらの道路標識からたくさんのことが学べるのです。

さまざまな道路標識

記号(もしくはアイコン)は道路標識の意図をドライバーに伝える重要な役割を担います。運転手は直進方向の矢印から分岐する別の矢印を見ると、標識に「出口車線」と記載がなくても、それが出口車線を意味することを直感的に理解できます。赤い丸に斜線が「禁止」を表すことはどの言語でも共通しているのではないでしょうか。このような記号は理解しやすいですが、合流車線のようなは直感的にわかりにくいため、全国で標準化することで効力を発揮しています。

「出口車線」、「Uターン禁止」、「合流車線」の道路標識

標識の意図を示唆する標準化された色も、道路標識が情報を素早く伝達するための効果的なツールです。高速道路の走行中、青い標識がガソリンスタンドや食事がとれる場所を示すことは本能的に理解できます。また、オレンジの標識によって前方の道路工事に注意すべきであることも理解できます。そして、黒と白はおそらく速度制限やUターン禁止などといった道路法に関する標識でしょう。

「サービス」、「道路工事」、「速度制限」それぞれ異なる色の標識

もしくは、道路標識が情報を伝達するもっとも賢い方法は「何気ないヒント」を含むことかもしれません。たとえば、出口車線の名前を示すサインは常に出口と同じ側に設置されているため、どちら側に出口があるのかを暗に知ることができます(豆知識:車のガソリン記号の横にある小さな矢印は、車のどちら側にガソリンの注入口があるかを示しています)。これと似たように、オブジェクトマーカーはどちら側の車線に寄って走行すべきかを斜線の向きで示し、車を障害物から遠ざけています。両者とも非常に見やすく、ただの記号を超えて運転手に必要な情報を伝えています。

高速道路の右側に設置されている出口車線の標識、縁石と逆方向に斜線を示すオブジェクトマーカー、ガソリン注入口の位置を示す矢印

そして、他のどれよりも優れている道路標識は、シンプルなデザインの「一時停止」標識でしょう。これは今まで説明した要素すべてが採用されています。赤色の背景に白い太文字で書かれており、白い縁取りをすることでどの景色でも目立つように工夫されています。道路標識の中で唯一八角形のカタチをしたこの標識は、運転手の目に飛び込んできます。単に目立つだけではなく、運転手の注意を引くデザインが全体的に施されているのです。

しかし、一時停止標識のような優秀な標識ばかりではなく、読みづらい道路標識も存在しています。運転手の誰もがきっと、複雑すぎる「駐車標識」を読み取るのに時間をかけたことがあるのではないでしょうか。ときどき、下から上に読むように意図された路面標識の各単語の間隔が狭すぎて、「止まれ、前方(Ahead Stop)」や「禁止、携帯(Texting No)」などと読めてしまうことがあります。こういった標識は記号で表すには複雑すぎ、結局テキストで補足が必要となってしまい本来の標識の目的を失ってしまいます。標識を見る運転手は、停車して文字を読み直すような余裕はありません。

複雑な駐車標識、無意味な「自転車優先」、そして「止まれ、前方」

道にある知恵を働かせましょう

道路標識から学べるUXの最大のレッスンは「スキャナビリティ(可読性)」の重要性です。ソフトウェアやWebユーザーは判断をするときに時速70キロで走行したりしていませんが、同じように全体をざっと見て情報を読み取ります。ユーザーは目的を達成するために役立つ目印を探しているので、どのような目印を採用するかがユーザーの満足度を左右する鍵となります。Webサイトや商品のワークフロー次第でユーザーが負担を感じることを念頭に置き、簡潔ではっきりとしたデザインとコピーを心がけ、ユーザーに安心感を与えるよう努めましょう。

以下に示すのはコンサートチケットの転売サイトの例です。画面上には手数料と税金が含まれていない料金が表記されていますが、よく見ると最終的に支払う金額は内訳も記載せず画面の下部分に小さく表記されています。ユーザーがこれに気づいたら、不明瞭な支払金額について販売店に問い合わせるでしょう。オンライン購入をしようが途中でやめようが、人々は自分が行っていることに自信を持ちたいと思っています。

恐ろしいオンライン支払の画面

高速道路の出口案内標識のように、ページ上への情報の配置自体がユーザーを誘導する役目を果たします。Backcountry.comはホームページ上の目立つ場所に検索ボックスを配置していますが、そのすぐ右横にチャットボタンを置くことで、オンラインチャットサポートの存在をアピールしています。この結果、Backcountryは商品の問い合わせをしたい顧客に、効率的にチャットサポートを提供することが可能になります。

Backcountry.comのシンプルなトップナビゲーション

約100年前、自動車がまだ比較的新しい技術だったころ、道路の全国的な共有化に伴い、道路標識の基準を制定する必要性が認識されました。基準を適用することは、確かにUXのイノベーションを妨げてしまいますが、ユーザーを無理に変えようとするよりも、維持すべき基準がいくつかあります。

1967年9月3日、スウェーデンで左側通行から右側通行へ変更した日の写真

ユーザーを誘導するためのデザインは、例として挙げた「自転車優先」標識のように不明瞭にならないように気をつけましょう。アイコンや記号を使用してユーザーを誘導する場合には、補足テキストやツールチップが必要ないと感じるほど直感的であるかを確認しましょう。Microsoft OutlookなどのMicrosoftのプロダクトには不明瞭な記号がよくあります。Outlookカレンダーのトップナビにはさまざまなアイコンが並んでいますが、アイコンの下にあるテキストを読まないと意味を正確に理解できません。補足テキストがないと、もはや点字と同じかもしれません。記号の目的は一体何なのかという疑問が招かれるかもしれません。

Outlookのアイコン

標識で導いてください

道路標識が完璧なUXとはかけ離れている理由はいくつかあります。レベルの低い看板以上に、道路標識はインターフェースをアップデートができないことです。アップデートを試みようものなら、問題を解決するどころか問題をさらに増やしてしまうでしょう。それだけではなく、ほとんどの人にとって道路標識とは10代のときに学校で1回簡単に覚えるだけであり、さらに経験から言うと、学校が行う運転教育はすべての標識をカバーしきれていません。

しかし今後あなたが道に迷ったとき、はっきりした標識に出会ったらそのときの感覚を覚えておいてください。まさにこれがユーザーがあなたのプロダクトを使用するたびに望むことなのです。


Welcome to UX MILK

UX MILKはより良いサービスやプロダクトを作りたい人のためのメディアです。

このサイトについて