9
2月
2016
IAと家の片づけは似てると思う
Posted On 2016年2月9日  By UXチーム 小林 真二

UXチームの小林です。

数年前に「断捨離」という言葉が流行りました。いらないものを捨てて、モノに対する執着をなくそうという考え方です。それ以来、空前の「片づけブーム」だそうです。部屋の片づけや収納のコツをプロが教える「片づけ本」も人気です。我が家にも「片づけ本」がありますが、それをたまたま見ていたとき、意外なことに気付きました。

「家の片づけって、WebサイトのIA業務に似てるかも…」

「片づけ本」に書かれている内容は、「家」を「Webサイト」、「モノ」を「情報」に置き換えると、まるでIAの指南書のようで、普段IA業務をしている自分も共感する箇所がたくさんありました。そこで今回は、家の「片づけ本」が教えてくれたWebサイトのIAの原則をまとめてみたいと思います。例え話なので、苦しいこじつけもありますが、そこは大目に見てください。

※IA=Information Architecture:
情報アーキテクチャ。情報を分かりやすく伝え、「受け手が情報を探しやすくする」ための表現技術。

1.モノの置き場所を決める。コロコロ変えない

家の中でモノの置き場所が決まっていないと、次に使いたい時にどこにあるのか分からず、いつも探しものをすることになってしまいます。家を片付けるコツは、モノの置き場所(定位置)を決めて、コロコロ変えないことだそうです。

Webサイトも同じです。たとえばサイト共通のナビゲーションは、どの画面でも同じ場所に置くべきです。毎回同じ場所にあれば、ユーザーは「ここに、このボタンがある」と学習でき、次に使いたいときも迷わず見つけることができます。

IA原則 : 共通のナビゲーションは同じ場所に置く

 

2.動線に沿って収納場所を考える

モノを使う場所としまう場所が離れていると、取りに行くのも面倒。しまいに行くのも面倒。しだいにモノが置きっぱなしになります。これを防ぐ最も良い方法は、使う場所のすぐ近くに収納場所を作ることだそうです。玄関で使うモノは玄関にしまう、リビングで使うモノはリビングでしまうという具合に。自分や家族が「どこで何をするか」という動線を考えて、モノの収納場所を決めることが大切です。

Webサイトも同じです。ユーザーの動線を理解し、「どんな画面を遷移するか」「どこでどんな情報を求めるか」を考えながら、情報や機能の置き場所を決めます。ユーザーの動線を知るには、アクセスログを見る、ユーザーにヒアリングする、ユーザーテストで実際の操作を観察するなどの方法があります。

IA原則 : ユーザーの動線を元に、情報配置を考える

 

3.片づける前に一度すべてのモノを外に出す

モノが大量に詰め込まれた収納庫や引き出しを片づけるときは、まず中のモノをすべて外に出して、モノの全量を知ることが大切だそうです。目に見える状態にすれば、持っていることを忘れていたモノ、いらないモノ、別の場所に移したほうがいいモノにも気づけるからです。

Webサイトも同じです。リニューアルをする時は、まず現状サイトにあるコンテンツの全量を把握し、「見える化」することが大切です。そのために、サイト内のページを一覧にした「ファイルリスト」や、ページの階層構造や導線をツリー図などで示す「サイトストラクチャ(サイトマップとも言う)」を作ることが有効です。

IA原則 : リニューアル前に、情報の全量を見える化する

 

4.いるモノといらないモノを分ける

片づけで大事なことは、いるモノといらないモノを分け、いらないモノは捨てることです。家が片付かない人は、この「モノを捨てる」ことが苦手だそうです。「もったいないから」「いつか使うと思うから」「思い出だから」といった理由をつけては、モノを捨てずにとっておくので、収納スペースがどんどん圧迫されていきます。

Webサイトも同じです。ユーザーのニーズや目的から、いる情報といらない情報を分け、いらない情報は潔く捨てることも必要です。例えばアクセスがここ数年で全くないページ、賞味期限の切れた情報、ほとんど使われない機能などは捨てる候補となります。不要な情報がなく、価値のある情報だけがすっきりと整理されたサイトは、情報を探しやすく、ユーザーの満足度や企業への信頼度も高まるはずです。

IA原則 : ユーザー視点で、情報の取捨選択をする

 

5.優先順位をつけて収納する

めったに使わないモノが収納スペースのど真ん中を占領していると、よく使うモノをしまうことができず、モノを置きっぱなしにしがちです。収納スペースを有効に使うには、モノに優先順位を付ける必要があります。よく使うものは取り出しやすい場所に置く、めったに使わないものは高いところや奥に置く、といったルールを決めます。

Webサイトも同じです。情報に優先順位を付け、多くのユーザーが見たい情報や利用したい機能は、すぐ見つけられる場所に置くべきです。逆に一部のユーザーしか見ない情報や利用しない機能は、最初は隠しておき、ユーザーの操作に応じて、必要なタイミングで表示するといった方法も検討すべきです。

IA原則 : 情報に優先順位を付けて、掲載場所を決める

 

6.カテゴリーに分けて収納する

好き勝手にモノが詰め込まれた収納場所は、モノを探すときに一苦労します。そんな時は、カテゴリーごとに収納場所を分け、分かりやすいラベルを貼るのが有効です。そうすれば、自分だけでなく家族も、必要なモノをすぐに見つけることができます。

Webサイトも同じです。コンテンツや情報がたくさんあるときは、ひとまとめにせずに、カテゴリーに分けて配置や格納先を検討すべきです。またそのカテゴリーには分かりやすいラベルをつけて、その中にどんな情報があるのかをユーザーが予想できるようにします。

IA原則 : 情報をカテゴリーに分け、分かりやすいラベルをつける

 

7.床にモノを置かない

片づけられない人の家は、たいてい床がモノで埋まっています。「とりあえず床に置く」という行為を繰り返した結果、ある日気づくと床が見えなくなっています。モノを紛失したり、掃除ができずにホコリがたまるなど、健康にもよくありません。床はモノを置く場所ではありません。

Webサイトも同じです。新しいページができたとき、とりあえずトップページにリンクを置いていませんか。格納場所に困ったhtmlファイルを、とりあえずルートフォルダの直下に置いていませんか。これが積み重なると、トップページは情報過多で情報を探しづらくなり、ルートフォルダの中はファイルで溢れて、運用に支障をきたします。Webサイトのコンテンツやファイルは、内容にあわせて最適な場所に置くべきです。

IA原則 : トップページやルート直下になんでも置かない

 

8.収納グッズに頼らない

モノが増えるたびに、新しい収納グッズを買う方も多いでしょう。100円ショップに行けば、たくさんの収納グッズが安く手に入ります。収納グッズを買えば、何となく片付く気がしてしまいますが、グッズ自体が収納スペースを圧迫することもあり、決して万能ではありません。

Webサイトも同じです。たくさんの情報を表示できるからと言って、安易にカルーセル(※1)やアコーディオン(※2)を用いるべきではありません。これらのUIは、初期状態で隠れている情報にユーザーが気づかないことも多いです。
カルーセルの1枚目の画像と2枚目以降の画像では、クリック率がまったく異なる、といったリサーチ結果もあります。便利なUIに飛びつく前に、本当にそれだけの量のコンテンツが必要かを、ユーザーの視点で問い直すことが大切です。

IA原則 : 安易にカルーセルやアコーディオンに頼らない

 
※1 画像などのコンテンツを横にスライドさせる表示方法
※2 タイトル部分をクリックすると、コンテンツを開閉できる表示方法
 

9.まず玄関を片付ける

散らかっている家は、高い確率で、玄関にもモノがあふれているそうです。「玄関は家の顔」。玄関から受ける印象は、その家全体の印象にもつながります。玄関が散らかっていたら、その家に上がる気にもなりません。「片づけ本」の著者である広沢かつみさんの言葉を借りれば、「家をきれいにするなら、まずは玄関から」です。

Webサイトも同じです。「Webサイトの顔」といえばトップページ。昨今は下層ページに直接流入するケースが増えたとはいえ、トップページが重要な入口ページであることは今も変わりません。散らかったトップページを見たら、ユーザーは「ここには見たい情報がなさそう」と思って、帰ってしまうかもしれません。それを判断する時間は、ページ来訪後のわずか3秒と言われています。サイト全体を一挙に整理するのが難しい場合は、まずトップページから始めてみてはいかがでしょうか。

IA原則 : まずトップページを整理する

 

10.部屋が散らかっていると、気が散る

部屋が散らかって様々なモノが目に入ると、ついつい気が散って、本来やるべき仕事や勉強がはかどりません。学生時代、散らかった家では勉強に集中できないので、図書館の自習室に通った人も多いのでは。何かに集中したければ、余計なモノが視界に入らない環境を作るのが必要です。

Webサイトも同じです。例えば、入力フォームやECサイトのお支払い画面では、ユーザーは操作のミスをしたくありませんし、目の前の作業に集中したいはずです。そのような画面では、ユーザーの気を散らす余計なリンクやボタンは置くべきではありません。誤ってクリックして別のページに移動してしまい、それまでの作業が台無しになる、そんな非情な体験も未然に防げます。

IA原則 : 操作に集中したい画面には、余計なリンクを置かない

 

おわりに

今回は、家の「片づけ本」をヒントに、WebサイトのIAの原則をまとめてみました。

記事を書くにあたり、3冊ほど「片づけ本」を読みました。どの本にも共通していたのは、「家が片付いていると、気分がスッキリとして、前向きな気持ちになれ、豊かな人生が送れる…」というメッセージでした。片づけは、そこに住む人が快適で心地よい生活を送るための大事な手段なんですね。

WebサイトのIAも同じかもしれません。
情報を整理して分かりやく伝えることで、ユーザーは必要な情報を見つけやすくなり、無用なストレスからも解放されます。欲しい情報がすぐに見つかり、理解もしやすければ、その後の意思決定や生活行動も素早く行えるはずです。つまり優れたIAは、情報メディアを利用するユーザーの体験(UX)、ひいてはその周辺にある日々の生活の効率を高め、快適なものにするといっても過言ではないでしょう。

「私たちの生活を、快適で豊かにする手段であること」

それこそが、片づけとIAの隠れた(でも一番大切な)共通点なのかもしれませんね。ちょっと大袈裟かな…。

 

【参考文献】

  • 玄関から始める片づいた暮らし (青春文庫) 広沢かつみ 著 青春出版社 2014/12/10
  • 散らかし屋さんが片づけたくなる部屋のつくり方 (正しく暮らすシリーズ) 金内 朋子 著 ワニブックス  2015/9/30
  • OURHOME ~子どもと一緒にすっきり暮らす~ (美人開花シリーズ)  Emi 著 ワニブックス   2013/11/22
  • 人生がときめく片づけの魔法 近藤麻理恵 著 サンマーク出版 2010/12/27

 

デジタルマーケティングプロデュース事業部
ソリューションデザイングループ UXチーム
UXデザイナー 小林 真二( 記事一覧 )


2005年にネットイヤーグループに入社。インフォメーションアーキテクト/UXデザイナーとして、コーポレートサイト、ECサイト、グローバルサイトなどの情報設計、UX設計、UI設計を数多く手がける。

 


UXチームについて

クライアントビジネスの課題の本質や、誰も気づかなかった課題を、ユーザーの行動データやインタビュー、経験知から導出・発見。その課題解決に向けて、ユーザー心理・行動に沿った最適なシナリオを描き、それを具現化するコンテンツや機能、ソリューションを設計(デザイン)していくチームです。経験者絶賛募集中!

関連リンク


関連記事




  • 前の記事
  • トップ
  • 次の記事