Home mail me! RSS

ウィンドウのボタンの話。

各OSのユーザー・インターフェイス(UI)の操作性の比較
ウィンドウのボタン篇。
(今更ですが・・・)

WindowShade Xの記事で
Mac – OS9では、タイトルバーをダブル・クリックすると、位置はそのままウィンドウが開いた状態からタイトルバーだけの状態にできるという機能について書いていて思い出した。

大前提として、圧倒的多数のユーザーが
・右利き
・左→右書きの言語を使用
ということでお読みくださいませ。


Mac – OS9以前

【配 置】◎
【見た目】○

(※OS9以前では、実際の機能としては「しまう」ではなく「たたむ」が正しいですが、ここでは便宜上「しまう」で統一します)
Mac - OS9以前

拡大・しまうがマウスを動かしやすい右上にある。

画面(文字)は左→右へと流れるものなので、余白は右にできるし、スクロールバーも右にあるため、カーソルもウィンドウ内の右半分にあることが多い。=右上の方が移動距離が短く動かしやすい。

その隣り合った、拡大・しまうボタンもそれぞれ何をするボタンなのか、機能がアイコン「□ =」として明示されている。

さらに、2つのうち、より頻繁に使うしまうボタンが右端にある。

拡大(縮小)するにはウィンドウ右下隅をドラッグする方法もあり、その方が拡大(縮小)という操作イメージに近いため、ボタンよりも使いやすい。また、実際の作業中に何度もウィンドウのサイズ変更を繰り返すことはあまりないと思われるので、使う頻度は圧倒的に、拡大 < しまう。

一方、閉じるボタンはその反対の左端にある。

この、閉じる・しまうの2つの配置が私がスバラシイと思う一番の理由である。

まず一つ目は、よく使うボタンである閉じるは左、しまうは右、の2つだけを覚えればよいという点。しかも両端なので覚えやすく、端だから押し間違いも起こりにくい(特に拡大としまう。閉じるは間違えようがない)。それがより直感的な操作につながる。

二つ目は、閉じるボタン(=データの保存・破棄に関わる)をクリックする際に、しまうに移動するよりも距離が長い分1クッションが生まれ、しっかりボタンを確認してからクリックすることができるので、一旦しまっておこうとしたのに間違えて閉じてしまった!というような操作ミスも防げるという点(意識されるような間ではないが、これは結構重要じゃないかと)。

色味はいまひとつかな。タイトルバーの横線がちょっと暑苦しいし。
でも当時としてはこんなもんだよな。


Mac – OSX

【配 置】×
【見た目】×

Mac - OSX

左上にすべてのボタンを配置してあり、どのボタンを押すにしてもカーソルの移動距離が長くて面倒。

ボタンのサイズが小さく、クリック範囲もきっかり円形なので、クリックしづらく操作ミスも引き起こしやすい。

また、マウスオーバーしないとアイコン「× − +」が表示されないため、一見して何のボタンだか分からないし、マウスオーバーしてみれば今度はカーソルの下にアイコンがほとんど隠れてしまう。

OS9時代とはしまう・拡大の順番が逆になっている。
 OS9:閉じる〜〜〜〜〜拡大・しまう
 OSX:閉じる・しまう・拡大
 Win :〜〜〜〜〜しまう・拡大・閉じる
Windowsと同じ順番になったんだけど、
これって乗り換えユーザーを意識していたりするのかしら?

ボタンの背景色をそれぞれ変えているのはよい。
しかし閉じるはかろうじて分かっても残り2つの差異は分かりづらい。
 赤: 閉じるボタン
 青: スクロールバー
その中間だから単純に黄色・緑ってだけなんじゃないかと思えてくる。あれ?ということは閉じる以外は同じでいいってことか?デザインのアクセントにはなっているけれど、操作性には関わってないんだな、黄色と緑の2色は。
うーん・・・誉めポイントがなくなってしまった。

背景とアイコンの色の差(明度or彩度)ももっと付けないと、せっかくのアイコンも目立たたない。

そのため、毎回のボタン操作で
 1. まずカーソルを移動しつつボタンを確認し、
 2. マウスオーバーしてそこでも確認し、
  (ここが結構なストレスになる。特にしまう・拡大)
 3. ようやくクリック、
と1〜2クッションずつ遅れてしまう。

OS9からOSXへの移行に伴って、フォントをはじめとしたグラフィック全般がアンチエイリアス対応となり、UIも光の効果が入ったいわゆる“アクア仕様”になったため、きれいではあるけれども視認性は大幅に低下した。やはり直感的な操作ができないのは大きなマイナス要因。
ていうかUIを改悪してどーすんのさ!バカ!


ボタンのイライラ度を最高潮に高めてくれるのがiTunesウィンドウを畳んだとき。
iTunesウィンドウを畳んだとき。
これひどい!ボタン縦並びって!
だったらボリュームを縦にするとか削っちゃうとかでいいんじゃないの?
もうAppleさんてば斬新すぎてついていけないっすよ。
って使うたび思う。

とはいえ、これでもよくなった方であるらしい。

「OS Xは危うくOS 8そっくりになるところだった」: Gizmodo Japan
http://www.gizmodo.jp/2008/04/……xos_8.html

へー。

デスクトップ全体のデザインはOSXの方がすぐれていると思うけど、ことウィンドウの操作性に関してはOS8の方が使いやすかったと思うんだが…。あんまり覚えてないけどOS8⇔OS9の違いってそんなにあったっけ?この記事だと、UIのグラフィック部分のことを言いたいんだか、操作性のことを言いたいんだか、論旨がぶれてる気がするんだけど(原文読めってことか)。


Windows – XP

【配 置】△
【見た目】○

Windows - XP

右端に閉じるボタンがあるのはやはり気になるが、各アイコン「_ □ ×」も形や大きさにめりはりがあるので目立ってわかりやすく、閉じるが赤い背景なのも操作ミスを防ぐのに役立っている。また、タイトルバーに高さがあるので、その分ボタンが大きくクリックしやすい(この2点で配置のマイナスを補えていると思う)。

ただ、しまう・拡大の背景色はタイトルバーの色ともう少し差を付けるべき。
ボタンの間隔ももう少し空いてるといいかな。

それから、この強烈な青はうっとおしい。すごく邪魔。なので普段はシルバーに設定して使っています。

個人的な感想ですが、私はキーボード・ショートカットのヘビー・ユーザーで、以前、Mac OS9(メイン)とWindows XPを平行して使っていました。

Windows上でよく使っていた秀丸ではウィンドウを閉じるショートカット(Mac:Command+W/Win:Control+W)がデフォルトでは動作しないので、閉じるボタンを頻繁に使っていたところ、Macと同じ調子で何枚ものウィンドウ間を行ったり来たりしている時などに操作ミス頻発でした。右端にあるので。

特に流れ作業をしてる時やコードを書いてる時とかにいきおいでポチっと。落ち着いて作業している時にはそれほど不便を感じなかった気がしますが・・・。



Windows – Vista

【配 置】○
【見た目】○

使ったことないので下記のページを参考にしました。
http://www.istartedsomething.c……enture-ui/
Windows - Vista(Aero Glass)

おそらく↑このAero Glassというセットがデフォルトと思われるのですが、おお、見やすくなったじゃないの!きれいよあんた。ガチャガチャしたかんじがなくなって統一感が出たし、ボタンがボタンとしてパキっと立ったし(というかタブに近い)、閉じるボタンが赤でちょっと大きめというのもいいですね。

日本語「メイリオ」フォントは見たことないけど、きれいになったと聞いたわよ。MS(P)ゴシックは最悪だったもの。

ただ、タイトルバーの半透明は、背景によっては非常に見づらくなる可能性があるのでいただけない。せめて最前面のウィンドウは不透明にすべきじゃないかと。透明じゃないVista Standardセットを使うのがよさげです。



まとめ

歴代OSの比較画像を発見↓。こちらはデスクトップ全体としてのイメージを比較。

WindowsとMacのデスクトップ10年の変化を一気に見る
: Gizmodo Japan
http://www.gizmodo.jp/2007/11/……c10_1.html


どっちが好きか(言い換えればかっこいいか)って聞かれれば、間違いなくMacです。今も昔も。でもボタンの使い勝手が“悪くなった”ってことだけは、どうしても許せないのですよ。いまだに。

トータルとしてのセンスの善さで差をつけたと思っているのはわかるけど、
(→Apple)
UIは視認性&操作性の方が大事です。

中〜上級者はキーボード・ショートカットを駆使して乗り越えられる部分なのかもしれないけど、大多数のそうじゃないユーザーにとっては、ね。
そこが売りの一つだろ!
(→→Apple)

次のOSはがんばれ!
(→→→Apple)

今度は何だ?Pumaか?Cheetahか?

Share

コメントする