ネコメシCEOブログ

ネコメシCEOのブログです。主にツルカメの話題を書きたいと思います(謎)

PVなどの広告収入に縛られているブロガーを「B畜」と呼びましょう

社畜と家畜の共通点を鑑みるに、ようするに、いわゆるサラリーマンってのは何らかの主観的プラットフォームに縛られている人だということ(にしたい)って感じなんでしょうか。

なお社畜というのは、家畜のような会社員を指した皮肉を語源としているわけですので、そもそも共通点っていうか同じものっていうか。もちろん、家畜という言葉それ自体には侮蔑的な意味とかなくて、これを人に向けて言うとそういう意味を伴っていて、社畜はそれの会社員版ということです。

ちなみに僕は社畜力わりと高いです。かつてWebEXPでインタビューして頂いた時の記事でも「社畜な性格もあいまって」などと公言していますが、まあ言いなりになって、ていう感じではないから、滅私奉公力とかの表現のほうが良かったのかもしれませんね。

と、まあ特にオチなく終わります(タイトルオチ)。

 

直感的なUIとは予想した通りの結果が得られるもののこと

UIデザインの参考に!斬新で美しいUIをもったiPhoneアプリまとめ

という記事では、紹介しているアプリのことごとくに、「ボタンが無くてシンプル」「直感的で使いやすい」などと書いてあるが、ClearのUIみたいなのを「誰でも直感的に操作できる」などと評価する理由がさっぱり理解できない。

こういうUIは基本的にどれも玄人向けで、操作がジェスチャの塊になってしまっているものは、それが使いこなせる俺カッケー感が高くて自己顕示欲を満たしやすい。"そのように操作できるUIデザイン"が気持ちいいのではなく、"そのように操作している自分"が気持ちいいの間違いなんじゃないだろうか。

 

ボタンが一切なくてシンプルだと気持ちがいいUIになるだって? そんなわけがあるはずない。現実世界はボタンが一切なくてシンプルなUIで溢れているし、そのおかげで毎日いろんな場面でいらいらさせられている。たかが1個のレバーを上げ下げするというだけの超シンプルな水道栓ひとつとっても、上にやったら水が出るのか下にやったらいいのか傍目に判断できない。やってみないことにはわからない。押すか引くかさえすれば開くドアだって、やってみないことにはわからないものはたくさんある(その挙句、正解は横に引くだったりすることだってある)。本当に、シンプルで気持ちいい、直感的で使いやすいだなんて、思ったことがあるのかい?

 

良いUIデザインっていうのは得てして直感的なUIデザインなんだけど、それはボタンが無いとかジェスチャで操作できるとかっていうことじゃない。

では直感的なUIとは何か。人が遭遇してきたさまざまな物理現象に対する基本的な感覚と、生きて行くうえで体験するさまざまな出来事を通じた経験値の蓄積から結果が予想できて、そして実際に予想通りの挙動をするUIのことだ。もちろんソフトウェアのUIでは、そうしたものをメタファとして用いていて、それがうまく機能していれば習得しやすいし、予想どおりの結果がきちんと得られれば使いやすいということになる。

 

また、良いUIとはユーザビリティの高いUIともいえる。ユーザビリティはISO 9241-11で定義された概念だが、ユーザビリティエンジニアリング原論がいうところのユーザビリティのほうがユーティリティを含んでいない分、UIデザインに特化した指標として扱いやすいように思う(アプリデザインとして担う事項などと切り分けしやすい)。

 

学習しやすさ(Learnability)
システムは、ユーザがそれをすぐ使い始められるよう、簡単に学習できるようにしなければならない
効率性(Efficiency)
一度学習すれば、あとは高い生産性を上げられるよう、効率的に使用できるものでなければならない
記憶しやすさ(Memorability)
ユーザがしばらくつかわなくても、また使うときにすぐ使えるよう覚えやすくしなければならない
エラー(Errors)
エラーの発生率を低くし、エラーが起こっても回復できるようにし、かつ致命的なエラーは起こってはならない
主観的満足度(Satisfaction)
ユーザが個人的に満足できるよう、また好きになるよう、楽しく利用できなければならない

「ユーザビリティエンジニアリング原論」における定義より)

 

ジェスチャ系の操作を強いるのは、主観的満足度においてはポジティブ要因になりうるかもしれないが、どちらかといえば付加価値としての操作になるだろう。ジェスチャ操作をしなくとも効率的に使用できるほうが良い。

だいたいにおいてアプリ個別のUI習熟コストが高すぎるものは、なんというか人生の時間を無駄に消費させるものだと思っている。

 

"実行"と"キャンセル"、この2つのボタンしか無いインターフェースを想像してみよう。"実行"をタップするとそれが「決定」されて実行される。"キャンセル"をタップするとそれが「決定」されてキャンセルされる。これほどシンプルで直感的なインターフェースがほかにあるだろうか。必要最小限の表示要素、これがシンプルの根源だ。

ちなみにこの手の、ボタンのタップは常に「決定」であるというような一貫した操作で本来わかりやすいはずなのに駄目なUIになってしまう場合ももちろん多々あるが、それはたいがいは、「ラベルが悪い(または無い。かつアイコンが悪い)」「選択肢が多すぎる」「コンテクストが理解できない」といったことに起因する。操作感云々ではなく、その操作が"そこ"に有るということ自体が不快なのだ。

 

予想した通りの挙動が実際に行われるということこそがUIに求められるデザインであるし、その結果、高いUXが得られるためには良いコンテンツこそが必要となる。

 

僕はClearをあまり良いものだとは思わないけれども(むしろ覚えゲーだと思っている)、たとえば良いものだとしよう。何であれ良いと考える人は必ずいるのでそれは問題ない。しかしそれは、ClearのUIが良いからというよりも、そもそも日々あなたが抱えるたくさんのタスクそれら自体が、あなたにとって価値のある仕事だったり、魅力のあるコンテンツだからなんだ。そのうえで、ClearのUI表現が主観的満足度を満たしてくれたんだと思う。

だってつまらないタスクばかり並んでいたら、そもそもそのアプリ自体、立ち上げたくさえならないでしょ。

 

予想した通りの挙動っていうのは、文化的な背景であるとか、知識や年齢とかも影響を受けるので、"それ"を誰に届けたいのか?というコンセプトデザインがまず最初に必要だ。それからUXデザインをして、最後にUIデザインをする。デザイン成果物の最表層であるUIだけを取り上げて参考にするよりも、なぜ人は"それ"を満足して使っているのかを考えてみよう。そんなに人は「天気を並べて見たいと思っているのか?」とかね。

longdesc属性に関するどうでもいい話

HTML5向けにHTML Image Description Extensionとして、いわゆるHTML4.01でいうところのimg要素のlongdesc属性のドラフトが出ていました。

という話がGoogleグループのhtml5jに投稿されていて、Firefoxしか実装してなかっただの、Operaは10.10からサポートしていただの、IE8もlongdescをツールチップで表示するだの(IE6から導入されたと書いてあるけど、IE6ではDOM的にアクセスできたっていうくらいの実装だった気がする)ということですが、たぶん、まっとうな実装でかつ最初の実装はMozillaではないか?と思います。

ということで、そんな感じで検索してみますと、やはりそうでした。Mozilla 0.9.7からの新機能ですね。Netscape 6.1が初出だという情報も見かけましたが、本当かなあ。Netscapeって6.2でもMozilla 0.9.4ベースだったような(まあlongdescを実装したブランチだったという可能性がゼロとはいえないけれども)。

 

しかしまあ、それにしても、なぜ今longdescなのか?という印象があります。longdescを推すということは、別のリソースで説明したいという欲求なんですかね。でもlongdesc用のページをもう一個書くとか超面倒くさいんですけど(まあ別にプレーンテキストとかでもいいんだけど)。なんというかリソースのメンテナンス的な意味では同一リソース内に書いてあったほうが良いんじゃないかという気がしていて、aria-describedbyのほうが実質的には使いやすい気がするんですけども。「Long descriptions are often too lengthy and detailed to be included on the main page.」だといっても、とりあえず書いておいて、表示上は隠しておくとかどうにでもなるんじゃなかろうかと思いますし。

 

ところでHTML5: Techniques for providing useful text alternativesってかなり気合入ってますね。知らなんだ。図表のaltに結構長い文章を入れているようで、僕もaltに長い文章入れてもいいじゃん派なので賛同できます。ちなみにこうしたaltの書き方的な解説文としては拙著「altはつけるだけじゃなくて」という記事もありますのでついでに紹介しておきます。

IEも8からやっと、altをツールチップで表示しなくなったのは良いことですね(ツールチップで表示されてしまうと、長いaltを入れるのに躊躇したり、いちいちtitle=""を併記するみたいな鬱陶しいことが必要だったりしていたので)。ただIEはある程度の長さでツールチップを改行してくれてたのでまだマシで、かつてのNetscape Navigator(いわゆるヨスケ)なぞ、ツールチップが一切改行されなかったうえにtitle=""併記も効かなかったので色々しんどかったという遠い記憶があります。

 

あの頃は良かったなあ。

徹夜しても、翌日ふつうに働けて。

 

正しいHTMLを書く目的はただ一つ

[HTML]セマンティックで正しいコードを書く目的 ― 二人の主を戴く技術者 - WEBCRE8.jp

という記事がFacebookのフィードに流れてきたので読んでみました。
1がいきなり理由(目的)じゃないですし、2と5は同じことを言ってますし(SEOに強いなんて事実はもはや有って無きに等しいのが実態ですが、いずれにしても機械が読んで嬉しいかという話ですので)、3と6はただのエゴですし、4の標準化っていうのはセマンティック云々の文脈でいうならばruleの話ではなくstandardの話をすべきではないでしょうか。カタチの想像もできないような未来を夢見る暇があるのなら、まずWebガバナンスからどうにかする努力をしたほうが何倍も有益でしょう。

 

2013/3/22 09:56追記:「セマンティックで正しいコードを書く6つの目的」のような構成であると読み取ってしまって(理由の箇条書きだと思って)上述のような指摘になりましたが、単なる段落番号だったようです。従いまして、1はそもそも理由ではなく序論的な位置づけでした。失礼いたしました。

 

そもそもセマンティックを誤解してませんか?
メタ情報とかRDFとかオントロジとかLODとか、ただの一言も出て来ないでセマンティックがどうのこうのなんて、有り得ません。 

こんなことでは、マークアップエンジニアの脱タンポポは難しいと改めて感じる次第であります。

というか、この記事がいうところの「セマンティックで正しいコード」というのは、おそらくは「文法上(仕様書上)正しいHTML」っていうくらいの意味合いなのだろうとも思います。

 

それでは、なぜ正しいHTMLを書くのか?

その答えは、ただ一つ。

それがインターネットにアクセシビリティをもたらすからです。

 

2013/3/22 04:41追記:コメントでも指摘がありましたので補足いたします。ここでいうアクセシビリティは「アクセシビリティ」という自然言語を指しています。たとえば「情報への接近容易性」といった意味合いであり、WCAGなど狭義の(あるいは固有名詞的な)アクセシビリティに限定していません。(限定しませんが、もちろん含みます。広義のアクセシビリティの実装系のひとつとして、狭義のアクセシビリティがあるわけですので)

 

ちなみに、「どうでもいいと思っている人たち」に対しては、もっともらしい理由をいくら並べても、腑に落ちるような納得をしてもらうことは難しいでしょう。HTMLに限った話ではありません。デザインでも同じことです。

しかし、たとえば説得できたとして、そうすると、どうなるのでしょう。相手が納得するしないに関わらず、正しいマークアップをすればいいのではないでしょうか。

正しいマークアップをするとコストが高くなる? その高いほうのコストが正当な価格ですから、最初からそれを要求すれば良いのです。

まあ、経緯がわかりませんので、推測で話を進めてもアレですから、もしよかったら、なぜ説得したいのかについてどなたか(もちろん著者さまご自身も)教えてください。

どうしていいのかわからなくなるUI

そろそろ利用者のほとんどがこのフォームに出くわした頃であろうと思うが、Evernoteのパスワード変更のフォームがヤバかった。

f:id:securecat:20130311170631p:plain

これ。
なんぼなんでも、いくらやっつけだったとしてもこれはひどい。

「新しいパスワードを選択」っていうラベルも意味がわからないが、「リセット」「ログアウト」ってボタンはさすがに不親切すぎではないか。実行側を緑にしておけばいいってもんではなかろう。

 加えて「クリア」とか「キャンセル」とか一緒に並んでたら傑作だったなあ。

ちなみにパスワードリセットに関するサポート FAQを見ると、僕が遭遇したフォーム(3月7日に遭遇)とは違うもので説明がなされている。さすがにアレだったから差し替えたのかもしれない。とりあえず「新しいパスワードを選択」が見出しに昇格しているなあと思った。