GUIの操作について考えた

GUIについて考えながらWindowsを触っていたらふと気が付いたことがあったのでメモ。

ボタン

これね。昔からあるGUIの部品。押したらなにかが起こる。

いや、ボタンに限ったことじゃなくて、Web見ていてリンクをクリックしたりするのとかいろんな場面で考えられることなんだけど。

押したら何かが起こる。押したら。

「押したら」って何?

GUIって現実世界を画面上に表現してそれを操作していると思っている。でも違うよね。

Windowsのボタンって、Mouse Up(マウスのボタンを離す)でトリガーされるアプリがほとんどじゃね。押してないじゃん。押してから離してるじゃん。だから、ボタンを「離したら」何かが起こるって言葉の方が正しくね。

一方、現実世界の物理的ボタンって、一般的にボタンを押した瞬間に反応するやつが多い。キーボードは押した瞬間に反応する。

パソコンやスマホに慣れていない人の操作を見ていると、押してるよね。絶対押してる。物理的ボタンをイメージしてる。

逆にパソコンやスマホに慣れている人は、意識してなのか無意識になのか知らないけど、離したら反応するってのを理解して操作してる。キーボードは押した瞬間なのに、マウスやタッチスクリーンは離した瞬間。

だから、パソコンやスマホの操作に慣れている人が、慣れていない人に使い方を説明するときに、「マウスをちょんってして」とか「指でちょんってして」みたいな説明になる。これって「離す」って動作を無意識に説明しているんだと思う。ボタンは押してない。

その点、スマホのフリックはこのような齟齬はないので、みんなできる。

これって、結構重要な要素だと思うんだけどなぁ。あんまり言われてない気がするなぁ。

いや、確かに中には押した瞬間に反応するようなアプリもあるけど、一般的じゃないんだよね。

ここから、ソフトウエアエンジニアの視点でのメモ。記憶をたよりに書いているので、正確なことはそのへんを当たってください。

マウスの場合、厳密には、Mouse Down(マウスのボタンを押す)とMouse Up(マウスのボタンを離す)が「押したら」に含まれる。

すなわち、

  • 画面上の(マウスカーソルの示す)とある場所で、Mouse Down(マウスのボタンを押す)が発生
  • 画面上の(マウスカーソルの示す)とある場所で、Mouse Up (マウスのボタンを離す)が発生

ここで、マウスカーソルの位置が一定の範囲内であれば、クリックされたと判定される。クリックされたと判定されるためには、マウスを離す動作をトリガーにしていることが一般的。

また、マウスカーソルの位置が一定の範囲を超えるとドラッグ動作と判定される。

離したときに反応する動作は、マウスでドラッグをするがゆえに生み出された。マウスを押した瞬間は、これからマウスボタンを離してクリックになるのか、マウスを動かしてドラッグするのか区別できないから。マウスボタンが離れるまで判定を遅らせているともいえる。

ボタンの場合、もうちょっと話がややこしくて、Windowsのアプリの場合、

  • 画面上の(マウスカーソルの示す)とある場所で、Mouse Down(マウスのボタンを押す)が発生
    • これにより、ボタンが押し込まれた絵に変化する。これはボタンが選択されたともいえる。
    • ボタンが押し込まれた状態でマウスカーソルが移動してボタンの外に出た場合、ボタンは元に戻る。
    • 一旦ボタンの外に出たマウスカーソルが移動してボタンの中に戻ってきた場合、ボタンは再び押し込まれた絵に変化する。
      • Mouse Up (マウスのボタンを離す)が発生
      • 現在マウスカーソルがボタンの中、すなわちボタンが押し込まれた状態で表示されている場合、ボタンがクリックされたと判定

となる。(ボタン押してる最中にマウス動かすなよ)

あ、最近のWindowsはボタンが立体的に表現されていないので、押し込まれた絵って言ってもよくわからんけど。

Webの中のボタンだとちょっと動作が違う。マウスカーソルが移動すると、ドラッグの判定がなされてしまい、ボタンは押し込まれた絵のままのことが多い。

厳密にいうとアプリで全部コントロールしようと思えば全部コントロールできるので、アプリ依存。ただ、大体基本機能のまま。Webならブラウザ依存、アプリならOS(Shell?)依存。昔の(今も?)UnixのX11はMouse Down(マウスのボタンを押す)でボタンが反応してた気がする。

昔のWindowsはちょっと動作が違ったと思う。(記憶があいまい。)マウスがボタンの外に出てもボタンは戻らず、マウスを離すとクリックされたと判定されることが多かったと思う。

面白いのはダブルクリック。マウスのクリックはMouse Up (マウスのボタンを離す)で判定されることが一般的なくせに、ダブルクリックは、2個目のMouse Down(マウスのボタンを押す)で判定するやつが多い。いや、このへん、だいぶアプリ依存。違うやつもいっぱい。アプリの中でくらい統一してほしいけど。。。

スマホのタッチスクリーンも大体同じ。ただ、3Dタッチとか感覚タッチとかあって、もっとややこしい。

マウスでは、ボタンが2個以上のときもあるし、タッチスクリーンは、2本以上の指で操作できることがほとんどなので、もっともっと実際はややこしい。アプリで禁止してることが多いけど、タッチスクリーンならボタン2個同時押しとかできちゃう。

1本目の指Down、2本目の指Down、2本目の指Up、1本目の指Upなんて流れを処理したら頭爆発できる。3本指でちょんちょんってダブルタップは実はなかなか高度です。

GUIをデザインするのはめんどくさいです。

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください