いいね系ボタンにみるonとoff の表示について思うこと

2011/10/14

寒くなってきたので、もうすぐこたつが欲しくなりそうです。
てなわけで、うちの(ちょっと古い)こたつの話します。
追記(2011/10/16):記事の内容を最後に資料としてupしてます。

こたつのスイッチ

うちのこたつのスイッチって、電源切れてるときは「切」が見えてて、電源入れると「入」が表示されるんですね。

で、なんかいつも分かりにくいと思ってました。
ぱっとスイッチを見たときに「入」が見えたら、『今電源が切れててこのスイッチを切り替えたらスイッチがる』って意味にも捉えれるので。

つまり、スイッチの表示が、本来は現在の状態を表しているんですが、このスイッチを切り替えた場合の行動の意味、とも考えられると。状態なのか行動なのか、という違いがある訳です。

で、なぜこんな解釈をするかと考えると、日本語に起因するのかなと。

  • 状態:電源が入っている
  • 行動:電源を入れる

どちらも「入」と表現できる。これが僕が分かりにくい理由だと思うんです。

例えば英語だと「入/切」じゃなくて「on/off」になると思うのですが、on/offって状態の表現になりますので、分かりやすいよなと。スイッチの切り替えが、「行動」じゃなくて「状態の切り替え」というのが明確になる。
(もちろん日本語でも「入っている/切れている」って表現すりゃ分かるのですが、デザイン上文字の長さの問題があります。)

ちょっとだけwebの話

いいね!ボタンとか+1ボタンとかよく見かけるじゃないですか。最近。
表示しているボタンて、状態の表示、だと思うんですよ。onかoffか。つまり押したら、状態が切り替わる。
でもボタンだけあってあれだけのサイズで、それを表現するのって難しいですよね。

+1ボタンなんかはちょっと分かりにくいなと思ってて、この見た目だと押したら「+1される行動」を表してるようにも見えます。
で、さらに実際押してみたら、青くなる。これが「on」なのかというは押したから分かるのですが、あらためてそのページ訪れてそのボタンをぱっと見ても分かりにくいですよね。。。
ただ、マウスオーバーすると、クリックしたらどうなるかという行動内容に関する説明が表示されますね。さすがgoogleです。

言いたいこと

あうゆうボタンて、要件としてやはりあれぐらいのサイズである必要はあると思います。
なので、いかにその中で「on/off」を的確に表現するか、というのは難しいですが、しっかり考えるべきじゃないかと思うわけです。

追記(2011/10/16):cakephpmatsuriでこれに関して発表しました。(資料

ちなみに資料内の「3G」というのは発表番号のことで、投票が行われてたので資料内でアピールしてますw

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です