街中にあるデザインから考えた
先日、デザインに関して個人的に新しい発見がありました。
予定があって銀座の伊東屋 (G. Itoya、都内最大級の文房具屋) へ行ったときのお話です。
G. Itoyaは地下1Fから12Fまでフロアがありますが、僕の目的は大抵7Fで切り絵用の紙を購入することです。
目的階までの移動手段は
- 階段
- エスカレーター
- エレベーター (各階停止)
- エレベーター (8Fまで直通)
の4通りで、7Fまで行くには④の直通エレベーターで8Fまで行き、そこから階段で7Fに降りるのが、一番早いです。
いつも通り、8Fまで直通のエレベーターを待っていたのですが、この日はなかなか1Fに降りてきませんでした。
「今、エレベーターは何階にいるのかな?」を確認しようとしたら、驚いたことがあります。
この8Fまで直通のエレベーターには、最低限の上下ボタンと上下ランプしかなく、いま停車している階が確認できないということです。
これまでは1F⇔8Fの行き来がスムーズで、ほとんど待つことなくエレベーターに乗れていた分、エレベーター前で数分待たされると、「このエレベーター、ちゃんと動いてるのだろうか?」という不安が広がりました。
このとき僕がふと感じたのは、エレベーターが今どこにいるのか? 動いているのか? という位置的な情報が無いだけで、不安を覚えるということです。
もしこのエレベーターに「今どこの階を移動しています」という情報があったら、こんなに不安を感じることはなかったでしょう。
最近流行のミニマムなデザインは、確かにとてもおしゃれです。
でも情報を必要以上に削ると、ある種の不安を覚えることもあることを学びました。
特に「自分はいま、どこにいるのか?」などの位置情報は、デザイン上とても重要だと気づきました。
ウェブデザインにおける【現在地表示】
少し観察してみると、工業デザインだけでなく、スマホなどのデザインにおいても「位置情報」は重要な要素となっていることに気づきます。
例えばiPhoneのホーム画面の下には、丸いアイコンがあります。黒丸が自分の現在地を示しています。
このアイコンがあるおかげで、「自分は中央にいる。右にスライドすればカメラが起動し、左側にもスライドできる」という現在地を教えてくれています。
iPhoneのホーム画面だけでなく、ウェブサイト上でも似たような丸いアイコンを見たことがある方も多いのではないでしょうか?
あれらはだいたい「自分が全ページの中で、どこにいるか」という情報を教えてくれる要素です。
- 今、何ページ目か?
- あと何ページで最終ページか?
などの要素を、色のついた●だけで表現したのはすごい発想です。
さらに、このように情報が可視化されることで「ウェブサイト上で、自分はどこにいるか」という位置情報がはっきりすると、ちょっと安心感を覚えます。
自分がどこにいるか把握できないことが、不安を生み出すことを実感しました。
ウェブサイトにおける位置情報の重要性
僕は自分でウェブサイトを作っていますが、僕のウェブサイトでは左上に「今あなたが滞在している記事は、どこの階層 (カテゴリー) に属すか」という情報があります。
記事の左上のこの部分です。これもウェブデザインにおける位置情報の明確化の一つです。
このカテゴリー情報の表示は、「ウェブサイトを訪問してくれる人にとってわかりやすいので、設置を推奨します」とGoogleが提言しています。
ちなみにこのカテゴリーリスト、名前を「パンくずリスト (breadcrumb list)」と言います。
言葉の由来が気になって調べたところ、グリム童話のヘンゼルとグレーテルに由来するそうです。
パンくずリストとは、閲覧しているページが、ホームページ全体のどの階層、どの位置にあるのかが提示されているリンクのことです。
童話「ヘンゼルとグレーテル」の中で森で迷子にならないように、主人公がパンくずを置いていった話が由来です。 パンくずリストは ユーザビリティを向上させることに加え、 SEOの役割としても重要です。
[引用] ferret | パンくずリストとは〜SEOに有効な理由と関係性を解説
まとめ
人を不安にさせないために、デザインにおいて位置情報は重要
ミニマムデザインのエレベーターを見ていて、そんなことを思いました。
コメントを残す