2016.6.20

「片付け」から理解する UI デザインプロセス

システムとユーザーをつなぐものである UI 。それをデザインする「UI デザイン」というのは一体どういうものだろうか。
洋服を作ったり、イラストを描いたりする「デザイン」と違って「 UI のデザイン」に馴染みがある人は少ないかもしれない。 しかし UI のデザインは、そんなに特別なことではない。実は誰もが似たようなことを身近に経験している。

UI デザインとは「本の片付け」のようなものだ。実際、UI デザインと「片付け」のプロセスは似ている。
…本当に!?
では本当かどうか「本の片付け」を通して UI デザインのプロセスを体験してみよう。

本棚の片付けと本の片付け

「本の片付け」というと、どのような作業を思い浮かべるだろうか。
まず、床に置かれた本をきちんと本棚に入れよう。大きさや色を揃えて美しく見えるように。入りきらないものが出てきたので新しい本棚を買わなければ。ああスッキリ…

ちょっと待った!
これは「本棚の片付け」であって「本の片付け」ではない。そもそも「片付け」には目的がある。それをふまえずに美しく整えても、おそらく1週間後には元に戻ってしまうだろう。散らかるには散らかるだけの理由があるのだ。

たとえば、この本がカフェに置かれているインテリアで、本棚を美しく見せることが目的であれば、それは「本棚の片付け」なので問題ない。この本を使って調べ物はしないから、探しやすいようにジャンル別に収納する必要はないし、本が増えていくこともないから、美しく本が並べられた本棚が乱れることも少ないだろう。

では、リビングの本棚にある本ならどうか。手の届きやすいリビングの本棚はついつい物をおいてしまいがちだ。買ってきた本はとりあえず置くし、雑誌も並べて置いている。とにかく量が多くて、入りきらないものは床置きしている。
あの本どこだっけ? 見つからない…

コラム 片付けとUIデザイン イラスト

ああ!リビングのソファーでリラックスして本が読みたい!
写真集や好きな画集を眺めたり、お気に入りの小説を読み返したり…
買って数日しか見ずに結局使ってない料理本をもっと活用して美味しい料理をつくりたい!

そう、それが目的。どんな UI にも目的がある。それがないと何もはじまらない。

モノの本質を知る

まずは本をすべて本棚から出してみよう。
よく使っている本はどれだろう。まだ読みかけの雑誌、小説。仕事でよく使う資料としての写真集。
使用頻度が高く、床置きされていたものだ。
使う頻度は少ないけれど、友人や両親が家に遊びに来た時に必ず見るのがアルバム。けっこうかさばるけど大切なものだ。反対に、どうでもいいのに本棚にあったのは、期限が過ぎたカタログ。
古いマンガ雑誌…特に意図したわけでもないのに、なぜか 2 つ前と 7 つ前の号だけある。どうしてだか分からないが、紙袋やレシートまで本の間に挟まっていた!

とにかく思いついた便利そうな機能を追加していこうとすると、アプリケーションの UI もだいたいこんな風になる。

コラム 片付けとUIデザイン イラスト

ここで最も注目すべきは、それ以外のもの。今は使ってないが、ゴミというわけでもないもの。いつか使うかもしれないととっておいたが、あったことさえ忘れているもの。
たとえば料理本。買った時はみるけれど、作ることなくとりあえず本棚に。
たとえば昔住んでいた街のガイドブック。内容も古い。
かつてはよく使っていたのに、月日が経つと必要がなくなるケースはよくある。そして、こういうモノがよく使うモノに混じっていると、どんどん散らかっていく。本棚も UI も。

ところで使用頻度の低いものと、使うかもしれないので置いてあるものは、どう違うのだろう。そんな時はモノの本質を考えてみると良い。
まず、本とは本来どういうものだろうか。本は読まれるためのものである。そこに書かれた思想を多くの人に広める目的で多くの本は出版される。

リビングの本棚に置かれた本はどういう状態だろうか。それを制作した人の意図通りに存在しているだろうか。
それはすぐ使える状態にあるだろうか。
少なくとも本棚の片隅で手にとられることなく積まれている状態の料理本は著者の本意ではないだろう。 そもそもその本は、何のため所有しているのだろう。

UI デザインでも、その利用シーンやサービスの変化にともなって、今までの UI を見直す必要が出てくるときがある。そんな時はそのアプリケーションのあるべき姿を考え、今本当に必要なものが何なのか検討すべきだ。

モノの本質を知ることは「片付け」の第一歩だ。

とにかく分類、そして分類

どういった本 ( とそれ以外のもの ) があるか大体わかったら、目的に合わせて分類していく。
まずは不要なものを取り除く。期限が過ぎたカタログに代表されるようなゴミを捨てる。使ってなくて、今後も必要なさそうなものについても。

よく使っているもの、時々使うものは使用頻度別にさらに分類してみる。料理本は現在使っていないが、もっと活用したいので毎日に使うものに分類した。使ってないけど、思い出があって捨てれれないものもあるだろう。それは使用頻度が一番低いものとして分類する。

ちなみに、あらかじめ分類体系を定めておき、それに合わせてもの分類していく方法は割付方式と言い、図書館の本の分類に使用されている日本十進分類法などが代表的で、ショッピングアプリ等で販売商品のカテゴリ分けをする際にもよく使われる。

使用頻度別の分類で使う頻度は明確になった。では、それらをより使いやすくし、目的を達成するためには、どのように本棚に入れたら良いだろうか。
使用頻度に合わせて、頻度の高いものは取り出しやすい腰の位置に次によく使うものは下段に。低いものは上段に。…といいたいところだが、まだ本棚には入れない。

コラム 片付けとUIデザイン イラスト

その前に、これらの本は一体どのような場所で使用するのだろうか。「片付いた状態」の維持には利用シーンが重要になってくる。使うシーンを考慮しなければ、どんなにキレイに本棚に本を収めても、1 週間後には残念、元通りだ。本の使用目的を考え、それぞれの利用場所別に分類した。

ここから、仕事用、料理用、くつろぎ用、持ち出し用、思い出用といった具合に本をグルーピングし、利用シーンと動線に拝領して収納場所を決めていく。
用途別にアイコンを描いて、本棚にラベリングをしてもいいかもしれない。どこにあるか見つけやすいし、使ったものを戻す場所も分かりやすい。

コラム 片付けとUIデザイン イラスト

そして本は捨てないかぎりどんどん増えていくものだ。適正量を決めたうえで、くつろぎ用の本は最新号を買ったら古いものは捨てる、などのルールも設定する必要がある。iPhone のタブバーに入るメニューの数だって決まっているからね!

課題になっていた料理本については、それを使用する場所、すなわちキッチンに収納スペースを作ることにした。わざわざリビングから本をもってきて、料理が終わったら戻すのは面倒だからだ。

さあ「本の片付け」が完了した。 しかしまだ終わりではない。
実際に運用してみて、不具合がないか確認しなければならない。 片付けてすぐは問題がなかったとしても、この先料理が得意な恋人ができて、料理本がいらなくなるかもしれないし、これから新しい趣味をはじめるかもしれない。
そうしたら新しい目的にあわせて、本の片付け方も変える必要がある。

片づけと創造と

UI デザインと「片づけ」はよく似ている。 そもそも「片付け」とは、その対象と人をつなぐインターフェイスのデザインにほかならない。

異なるのは、UI デザインの方が物理的制約が少ないため、比較的自由な発想で問題解決にあたれる点だ。
極端な話、それが UI なしで実現できるならば、UI をデザインしないこともありえる。そういう意味では UI デザインの方がより創造性が必要だ。

「片付け」のような緻密な分析と創造による問題解決。UIデザインとは、その目的を実現するために、現状を分析していく作業の中でもともと隠れていた数式を発見するようなものだ。そこが苦労するところであり、たいへん面白いところでもある。

関連コラム