2013年07月29日 21:38Fujii

複数人でUIデザインを行うときの心がけ

IMG_3765

複数人でUIデザインを行う

以前にもUIの構造を共有することは難しいと書きましたが、やらなければいけないときもあります。

徹底的に話す

泥臭いですが、UIの構造を把握することも大事ですが、複数人が関わることを考えると、まずは徹底的に話すことが大事です。

そのアプリケーションの世界観や、ナビゲーションの構造、レイアウトのルール、各要素の役割、それぞれの表現方法を理解すると、その後の共同作業がスムーズになります。

UIは試行錯誤の結果なので、最終結果だけ把握しても実はあまり意味がありません。

というのも、その後に共同作業をするときに、結果だけ知っているだけだと、試行錯誤したこととと同じことを、再度試行錯誤するということが起こります。

これを防ぐために徹底的に思考プロセスまで共有するために話しあうことができると、その後の無駄を減らすことができます。

合流者のあつかい

コアメンバーで徹底的に話し合うのが理想ですが、誰かがプロジェクトに合流する場合もやはりあります。

ここで問題となるのは、試行錯誤の情報についてギャップがうまれます。

なので、これを埋めなければ、合流者のアイデアは意味がないものになりがちです。

すでに試行錯誤済みのアイデアであったり、トレードオフの結果切り捨てた部分の指摘であったりすると、それに対するコアメンバーの対応はアイデアや的確な指摘をもらうというよりも、レクチャーに近いものになります。

この辺りは合流度合いが強ければ徹底的に話すことが必要になりますし、合流度合いが低ければ、思いつきの話として頂戴して、取捨選択するかのどちらかになると思います。

徹底的に話す環境

大事なのは小さいことを聞ける環境にすることです。

まず、疑問自体が試行錯誤のスタートであるため、小さなことでもやりとりをすることが大事です。

ちょっとよくわからないけどききにくいという環境は質の低下がおこります。

あとで、わかっていたけどとなるのです。

環境づくりとは、わからないことに対してマイナスのことを返さないなどすると少しづつ整ってきます。

建前が多いとコミュニケーションは鈍くなりますので、試行錯誤していればそれを伝え、何も考えていなければ何もそこは考えていないということを共有する関係であることも大事です。

好みの把握

細部のデザインで特に重要ですが、互いの好みの把握があります。

意思決定という意味では、最終的に船頭は1人でなくてはなりませんが、それ以前に互いに前提としているUIデザインの考え方などを把握すると、あらかじめギャップがある部分のあたりがつけられるので便利です。

よく好みではダメだとか言いますが、好みがあるということを把握しあうことは大事です。仮にどちらかが船頭だとしても、手伝う方に回った側は楽になります。

よくないのは世界観がない船頭です。

また、デザインにはすべて理由がある、好みではないと言いますが、あれは嘘です。

正確には、理由があるというのを言語化することだけだと考えているとうまくいかないということかもしれませんが。

そもそもどのように言語化するのかは、最終的には感覚が理由になっているはずです。

理想は

理想は、常日頃から徹底的に話し合いや意見交換をして、また、仕事を通じて好みや傾向を把握しあっている関係ということになりそうですね。

2013年07月14日 19:27Fujii

GUIを維持するのは信じる心

IMG_3698

想像の産物であるGUI

世の中には画面ごとに異なる人が作ったソフトウェアもあります。

こういったソフトウェアは表現されていることは崩壊していて、ユーザーは表現されている内容がなかなか理解できなかったり、混乱したりします。

GUIとは映画やマンガ、アニメーションなどと同じで想像の産物です。

現実には存在しないけれど、ひとつの世界がそこにあたかもあるように見せるのです。

想像の産物なので、それを維持するのは人間の思考によってでしか行えません。

思考が混乱していればUIの表現は崩れます。

人間の思考の中で、最もよく使われるのが言葉と視覚的なイメージとしての絵です。

人間の思考ツールとしての言葉や絵の特徴や、人間がどのように視覚的な表現を行うのかなど考えてみたいと思います。

言葉と絵の情報量の違い

言葉と絵には隔たりがあります。

例えば、外国の本を読んでいる時に、「食卓の皿」と書いてあったときに、実際にどんな皿なのかわからないことがあります。

日本の皿とは違うだろうし、なんて考えてしまいます。

しかし、これが絵だとどうでしょう?

絵の場合は外国の皿がどんなものかわかります。

極端にいうと、言葉というのはそれを詳しく知らなくても使えてしまいます。

「食卓の皿」と言ってしまえば、その食卓がどんなであるか、食卓の上はどんなになっているか、などなどは言わなくてもいいのです。

絵にする場合は、どういったものを食卓と呼んでいて、皿はどのようなものなのか?を決めなければなりません。

これは、絵にするときに情報が追加されるということです。

お皿の模様、机の上にならぶ食器などがどうであるかが追加されるのです。

ほかにも「群衆が思い思いのことをやっている」と言うのは簡単ですが、絵で描く時には、実際に一人一人が何をやっているのかを描く必要があります。

なので、その絵を再度言葉にすると情報量はかなり増えると思います。

「ウォーリーを探せ」という本がありますが、この本の見開きを言葉で詳しく説明しようとすると、ものすごい言葉を紡がなくてはいけないとおもうんですね。

結果として言葉としてのテンポを失うくらい量が多くなってしまうかもしれません。

なぜ話がすれ違うか?にもつながる

たまに一つの言葉に対して、互いに定義が異なっていて、話がすれ違うことがあります。

その言葉からイメージしていることが言葉で説明しにくい場合はすれ違い続けます。「ウォーリーを探せ」を言葉で伝えようとしても難しく、つまりこれだと見せたほうがいいわけです。

しかしここでひとつ問題なのは、「つまりこれだ」を持ってない場合です。

言葉というのはそれを詳しく知らなくても使えてしまいますので、「つまりこれだ」がないこともあります。

そういうときは言葉は力を失います。

「つまりこれだ」がわからないときに言葉が生まれる

「つまりこれだ」がない場合に、言葉は力を失いますが、実は、「つまりこれだ」がないときに新しい言葉が生まれるのかもしれません。

本来、言葉が生まれるときには対となる「つまりこれだ」があります。

これに慣れていると言葉になったものは「つまりこれだ」が必ずあるように思えてくるのです。

これは、錯覚で足の速い人が赤い服を着ていることが多かったとしても、赤い服を着ている人が足が速いわけではないのと似ています。

それでも、「つまりこれだ」があるように思いたいので、言葉をつくるのです。

「つまりこれだ」があるように思いたい

以前、離島に遊びに行った時に、海岸に温泉があるというのを聞いて夜中にてけてけと向かいました。階段を降りようとした時に、都会では味わえない闇がそこにありました。

例えではなく、明かりが全くない闇です。

手元の明かりで照らしても闇が深くすーっと光が吸い込まれてしまうあの感じです。

これはヤバイと怖くなり引き返しました。

そのときに、「こういう環境なら昔話がうまれるかもしれない」と思ったのでした。

得体のしれない怖さに名前をつけて、「つまりこれだ」があると思いたくなる。

名前をつけると「つまりこれだ」があるはずだけれど、実際にはないのです。しかし、なければいけないので、今度は作るのです。

その結果、得体のしれない怖さに、姿形や、性格、振る舞いがつけられ言い伝えに登場するのかなと。

UIでの表現を崩壊せずに成り立たせるために

いろんな話になりましたが、UIでも似たようなことがあります。

複数人で何かを作るときには「つまりこれだ」というのが共通認識としてあればあるほど、要素の扱いは簡単になります。

例えば「つまりボタンである」とわかるほうが扱いは簡単です。

表現の方法は見た目からでもいいし、一定のルールからでもいいですが、目に見えにくいルールは、見た目から「つまりこれだ」と判断するのが難しくなります。

UIの表現が冗長にならないようにするために、表現レイヤーの数を減らすときに注意しなければいけないのは、「つまりこれだ」というのが弱まらないようにすることです。

例えば、作り手のなかで「つまりこれはボタンである」という共通認識が弱まってしまうと、自然にボタンのように扱われなくなったりして崩れていきます。

信じるものは救われるではないですが、皆がこれはこういうものだと思わなくなれば崩れていくのです。

表現を維持するのは皆の信じる心なのです。

なので、表現レイヤーを減らしたときなど、そういった共通認識を深める機会を設けたり、UIデザイナーがそういったことを一元管理するなどが必要になります。

2013年07月01日 09:59Fujii

カラフルなUIにする前に

IMG_3677

色という表現レイヤーでの区別

色で何かを区別しようとする時に注意することがあります。

ほかの表現レイヤーと同じように色によって区別できる数も限界があります。

その理由は、ぱっと見で区別できる色の種類はそんなに多くないからです。

抑えておかないとどうなるか?

これを抑えておかないと、区別しなければいけない項目が多くなったとき破綻してはじめて気づくことになります。

やがてしかたなく微妙な差しかない色を使うことになり、区別できない項目が産まれます。

極端にいうと信号機に青とは意味が異なる微妙な明るい青が混ざってしまうようなものです。

こうなってくると、その二つが隣り合わせにならない限り区別できなくなります。

つまり、区別するための表現レイヤーとして機能しなくなってしまいます。

区別できなくなり単にカラフルになるだけではありません。

最初は色による区別を行っていた場合は、さらに弊害もあります。

中途半端に法則があるからです。

破綻した場合でも色が似ていればユーザはなにか意味合いが似ているものなのかなと予想しますので、単に色数がないという理由で選んだ少し似ている色同士に関連があるようにみえてくる現象も起きます。

このことにより混乱が生じます。

対策

破綻しそうなくらい種類が多い場合は色という表現レイヤーで区別しないほうが良いでしょう。

そもそもUIでは肯定的なことを示す色や、否定的なことを示す色が必要なことが多いため、そういった基本的なもの以外に意味を表すために使える色は、さらにすくなくなります。

また、カラフルにしたいという理由で色を多く使うのであれば、意味のある色が埋もれてしまい機能しなくなります。なので、色という表現レイヤーで何かを区別したり、意味を伝えることはできなくなることを押さえた上でやるほうがいいでしょう。