舞台映像演出の手法とインターフェースデザイン
http://d.hatena.ne.jp/rikuo/20081128
はてブがリニューアルして、ブックマーク追加の画面がわかりにくい、という話。
- 追加ボタンと「コメント」と表示されているサブタイトルを混同してしまう。
- 同じ画面に表示されている「タイトル」というサブタイトルは実際にボタンとして機能するため、より混同しやすい。
2に関しては、はてなのインターフェースデザインミスだと思うけど、1に関して僕はすぐに理解できなかった。
左から右への流れ
舞台演出の話で、主役は舞台の下手*1から登場し、主役に対峙するような重要なキャラクターは上手*2から登場するのがセオリー、という話を聞いたことがある。
ただ、これは絶対的な舞台演出のセオリーではないらしく、実際主役が上手から出てくる芝居を見たことがあるし、そもそも円形舞台では上下の関係がすごく曖昧だったりする。
この手法は映像にもあてはまるらしく、富野由悠季御大は著書「映像の原則」においても、カット割りやカメラアングルに関して応用できると述べている。
映像の原則―ビギナーからプロまでのコンテ主義 (キネ旬ムック)
- 作者: 富野由悠季
- 出版社/メーカー: キネマ旬報社
- 発売日: 2002/02
- メディア: ムック
- 購入: 14人 クリック: 235回
- この商品を含むブログ (53件) を見る
ところで、なんでみんなはそこを押そうとするの？
はてブの話に戻る。僕はこのインターフェースの間違いに気づいていなかった。以前から使っているユーザーとしては追加ボタンの存在を知っているし、そもそもEnterキーを押せばすぐに登録できる。
とはいえ、リニューアルしたデザインに新鮮味を感じたユーザーや新規参入のユーザーなら、インターフェースに対する不慣れからくる今回のことは十分にあり得る話だとは思う。
しかし、ボタン的な何かではあるものの、入力エリアの左にあるものを人は何故わざわざ押そうとするのか。
本来こういう実行ボタン的なものは入力エリアの右か下に配置されているものである。それは入力エリアが横書きで、左から右にテキストを入力するからであり、句点やピリオドが文章の最右端に存在するのであれば、入力を確定させるボタンも最右端にあって然るべきだ。横書きで改行をすれば下に行が送られるのであり、そういう意味に置いてはボタンが下に来ても当然なはず。一応はてブ追加画面の「追加する」ボタンは下に置いているが、入力エリアに対して左寄せになっているので、Googleのトップページのようにセンタリングしたほうが良かったのかもしれない。
右か下にあるべきなのが正しいかどうかは別としても、そういう既成事実が出来てしまった以上、ネットに明るいユーザーであれば自然にそういうことは理解できるだろうと僕は想像するのだけど、それは思い過ごしなのか？
何が一番の悪因なのか
この現象の原因として「タイトル」「コメント」のデザインがボタン的であるとか、「タイトル」「コメント」のデザインのほうがコントラストが強いといった声がある。いわゆる「艶やかなものはボタン」というユーザーの思い込みである。
たしかに艶やかなボタンというのはAppleがAquaデザインをリリースしてからというもの、世界中のデザイナーたちによって引用しつくされた感がある。引用だけでなく、あの立体感、透明感、反射感をPhotoshopやIllustratorのグラデーション機能を駆使して新たな質感を作り出していくという、21世紀初頭のデザイン流行さえ生み出した。
しかし、だからといってそれらのすべてがボタンである、という思い込みはユーザーの妄信である。ボタンインターフェースには
- ブラウザによって用意されているもの
- サイト側がハイパーリンクとして画像で用意しているもの
に分かれていて、特に前者はブラウザやバージョンによってデフォルトのデザインがまちまちであることを知っている必要がある。たまたまSafariのそれやAquaデザインが、ひいてはそれを好む昨今のデザイン流行が似ていた、というだけなのだ。
僕の印象
どれがボタンでありボタンでないのか、今回に限らず、インターフェースの混乱をまねいているのはサイト制作側だという意見がある。たしかに、ユーザーに使ってもらうためのものを作っておいて使いにくいものを提供するのはプロとして失格だろう。しかし、ブラウザによってボタンの形状が異なる、というまだまだ未熟なこの業界の現状はユーザーも知っておくべきである。なまじ、はてなを使うようなユーザーがそれを見落とすのは個人的には中々信じがたい。
はてながどれぐらいの期間あのインターフェースについて煮詰めたのかは知らない。しかし、少なくともデザインしている側は視線の誘導やバランス、使い勝手といったものを、使う側の数十倍気にかけてやっている。左から右というセオリーもそうだが、そういう様々な制作マインドのもとに、デザインが決定されている。そして僕の経験上、そのマインドのほとんどは100点は取れなくとも80~90点のレベルで正しいデザインと言って良い。*3
しかし、そこまで気を使ったとしても、一部一定数のユーザーは、今回のような誤理解をしてしまう。ある程度しかたのないことだとは思うけど、同じデザイン系の仕事をしている者にとって、自らの理解が浅いままに、その程度のことで揚げ足を取られてしまうのは悲しいな、と思うのだ。
