インターフェースの最近のブログ記事

百聞は一見に如かず、っていうことで動画はりました。

Firefox のアドオンです。

Juice - The intelligent add-on for Firefox

タグ

Browser

Experience

日本人はだいたい必要のないものを、あった方が良いという消極的な理由で、溜め込んだり、付け足したりするのが好きだ。

コンピュータにしても、日本メーカーのものを買うと、バージョンの古いアプリケーションがたくさんついてくる。そしてそれは往々にして、生涯使われることはない。

必要なものは、必要な時に、必要なだけ、必要とするひとだけが必要なものでしかない。

お得感をだそうとしているのかもしれないけれど、ぼくには貧乏性なだけのようにしかみえない。

先日も知人のコンピュータを買うのに付き合い、セットアップする際にハードディスクを圧迫する無用なものを全て削除するのに、ひどく時間をくった。

それはそれとして、最近、なぜかホームページで流行りの文字サイズ変更ボタン。

なぜ付けているのだろうか? もちろんあったほうがいいからに相違ない。確かに、あったほうが良い。ならいっそ、ビデオの予約と日焼け対策もしてくれるともっと役に立つ。

不要という理由はいくつでも上げられる。

1. 大きな文字を必要としているユーザーはデフォルトの文字が既にブラウザの設定で大きい
2. 弱視のユーザーにはもっと大きなサイズが必要
3. ブラウザのUIとして実装されている
4. JavaScript以外での代替手段がない
5. 結局大きくなるのは文字だけで、画像は大きくならない（画像に埋め込まれている文字は小さいまま）

必要だという場合は、たいがい、リテラシーの低いユーザーのためだという。

それならブラウザにそういう機能があるというのを知らせなければ、他のサイトでは役に立たないので、むしろ不親切だといえる。

どうしてもつけたいのであれば代替スタイルシートのほうがスマートだと思う。

別に反対はしないけれど、どうも解決策としての美しさがないと個人的に思うので、賛成したくない。というか、あまりめったやたらとつけないで、ブラウザの基本的な使い方を教育していくほうが、長い目でみれば有効だと思う。

WebアクセシビリティJIS規格完全ガイド障害者や高齢者に配慮したウェブデザインの指針として、2004年6月に策定されたウェブコンテンツJIS。自治体・公共機関・企業のサイトが実現すべきバリアフリーなコンテンツの作り方について、アクセシビリティの概念から、JIS規格の具体的な内容、実践的な取り組みまで徹底解説。¥ 3,990

タグ

Accessibility

Think

リアルとWebでは探し方が違う。

リアルでは自分自身がインターフェースになりえる。

リアルでは

• 臭い
• 触わりごこち
• 味
• 音
• 形
• 角度
• 絵
• 文字

など、環境下にある要素の全てを対象にできる。

持ち上げれるものであれば裏返すことも可能で、開けることも、たたき壊すこともできる。

かたやWebでは、ほぼ何もできないに等しい。

せいぜい、

• 形
• 絵
• 文字

くらい。

小さなマウスと薄っぺらいキーボード、モニタ上にあるものはほぼ動かせず、できることといえばCommand(Ctrl)+F(Found)で文字列を検索するくらいしかないのだけれど、文字列の多くは（重要度の高いものほど）むやみ画像化されているため、探し当てることはできない。

Webでの"探す"の入り口は検索エンジンが多勢を占める。検索エンジンはまず文字列で検索するため、ユーザーは当然"文字"を探す。

検索をかけたキーワードと一致した文字列を探し、一致した文字列の文脈を探り、より自分も求める情報に近いページを選び、訪れる。

訪れた先のページでは再度、検索結果の文字列を探し、見つかれば周辺の文脈を探り、意に添っていれば、さらに広範囲でのサイト内での情報探索を始める。意に添わなければ検索結果に戻り、違うページをまた探す。

重要なのは情報であるし、その情報がどのように整理され、どのように見えるかになる。

最初に見つけるのは部分である以上、その部分をみつけるための見やすさが必要になる。

文字列と背景色のコントラストはまず最低限確保するべきもので、視覚的美しさというのをただの見目と勘違いした、白地に薄いグレイで、その上文字がやたらと小さいサーフィスというのは、訪れた多くのユーザーを追い出すのに役立っている。

探すのは文字である以上、文字は構造的な意味でのレイアウトを損なわない程度に大きさを確保するべきで、多くの文字数のある文章は、画像化すると探すのが大変になる。

意味的な画像というのは、画像そのものがコンテンツである場合を除き、あくまで補助にとどめるべきで、画像だけを貼付けて、コンテンツ完成。というのは、文字列を探すという観点からは暴力に等しい。

意味の同じものは同じ形をしているべきで、意味の違うものは違う形をしているべきで、それはサイトの内外で一貫している必要がある。バナーをサイトの内外で使用するにしても、それが同じコンテンツへのナビゲーションであるというが常に、誰にでもわかるようにする必要がある。

もし、今日と明日で、ぼくが違う顔をしていたら、大多数のひとはそれがぼくだとは分からなくなる。同じ形にしなければならないというのは、人をイラつかせないため、信用を得るために必要になる。

直接手を触れられない、貧相なインターフェースを使わなければならない以上、考慮するべきことや、実装以前に考えるべきことはたくさんある。

別にサイトにどんな情報があるのか、全てが分かる必要はない。ただ、必要な情報が見つけられれば、とりあえずそれで満足できる。

そういった意味で、グローバルナビゲーションというのは、実はあまり意味がないように思う。もちろん、だからといって、何も考えず、ただ取り外してしまうというのは、あまりにもお粗末だけれども。

もちろん、特に意図がないのであれば、多くのサイトにあるのだから、グローバルナビゲーションがあった方がいい。ただ、グローバルナビゲーション以上のナビゲーションシステムのプランがあれば、別に固執する必要はない。

それと、ユーザー（ヒューマン）インタフェースと同様にマシンリーダブルというのも必要になってくる。

SEOというGoogle卿の教育によっていくらか改善されつつあるけれど、どうも、SEO云々よりもなぜそれが必要なのかをあまり誰も知ろうとしない。

ひとことでいうとWebだから、なのだけれど。とにかく、3兆ページを超えたというわれるWebのリソースを、どうやって探すのか、を底辺のぼくらからも考える必要は、あるように思う。

セマンティック HTML/XHTMLウェブ文書中に埋もれるデータをコンピュータ処理可能にし、「データのウェブ」を生み出すために、メタデータやRDFの基本から、マイクロフォーマット、GRDDL、RDFaといった構文、さらに記述のための語彙や利用のツールまでを取り上げて詳しく解説します。¥ 2,940

タグ

Design

Think

ホームのことをトップページという言い方がなんか当たり前になっていて、結構気になっている。

Yahoo!辞書によると

top

最上［最高］部, てっぺん, 頂上, 先端

というふうになっている。

そのWebサイトの情報が、単純なツリー構造になっている場合は"てっぺん"というのもあてはまるけれど（でもルートというと、むしろ一番下）、そうでないサイトというのは多々ある。また実際に情報をツリー構造にするのはむつかしい。情報はデータとは違い、単体ではなりたたないもので、常にコンテクストの中で意味をもつ。

カテゴリとはWebサイトというコンテクストの中で、情報を整理するために便宜的に設けられたものでしかないし、ホームの目的は情報の頂点をつくることではなくて、索引に近い。

言葉の中に意味的な整合性をもたせることで、ナビゲーションはより正確に近いかたちで機能する可能性を高める。なら、ホームとか、もしくはセントラルとかいったほうが良いと思う。

あと、"ページトップへ"というナビゲーションラベルとカブるので、スマートじゃなかったりもする（実際そのページ下部にある"ページトップへ"を押して ホームへ行こうとするひともいる）。

情報デザイン原論-「ものごと」を形にするテンプレート大量かつ無秩序に存在する情報を人間にとって利用しやすい形に整理し，提示する。これが情報デザインの目的であり，本書はその教科書的な書籍である。研究者やデザイナ，建築家など10人を超える著者が各々の専門分野について執筆したものを，一冊にまとめている。理論だけでなく実践やテクニックについての記述が豊富で，理解しやすい。全体としてやや雑多な印象は否めないが，それが逆に，情報をデザインすることがいかに幅広い場面で必要であるかを物語っている。¥ 3,990

タグ

Label

インターフェースデザインというと、グラフィックユーザーインターフェース(以下GUI)をつくることだと誤解されがちだけれども、GUIというのはデザインの結果であってデザインそのものではないし、視覚化されないデザインの結果というのもある。

つまり、インターフェースデザインとは概念地図の設計で、知覚と概念化プロセスに対するアプローチのことをいうのだと思う。

人間は記憶する際スキームというのをつかっているらしく、このスキームというのは有機的な構造をもっていて、例えば"飛ぶ"というスキームには"鳥"や"飛行機"が内包されている。

もしこれが単純な階層構造モデルであった場合、"鳥"は生き物、"飛行機"は機械、なので、"飛ぶ"という同じカテゴリに入れるためには、また別個それぞれの概念を作り出す必要があり、無限にちかい重複した概念が脳を圧迫することになってしまう。

つまり意味で概念を分け、違う属性をもった概念の中にある同じ属性を紐づける意味的な構造化モデルを利用していることになる。

GUIの場合は世界ほど複雑ではないにせよ、単純なスキームを事前に考え、それらに基づいた一貫性をもったグラフィックスを使用し、記憶の仕組みに近い形での視覚情報を提供することで、学習効率の高い操作手段を提供する必要がある（ハイパーリンクを示す色が周辺の色に合わせた形で複数色あるインターフェースをたまに見かけるけれど、これは学習を阻害し、法則を崩壊させるため、スキームの設計がされていない悪い例）。

視覚化されないインターフェースデザインとは、遷移やデータの構造化モデルの設計、プログラムなどがある。

インターフェースの遷移は決して直線的にはならないし、時間という観念もあやふやなため、制限(ある機能を使っている間は別のある機能はつかえないなど)やエラーなども含まれる。そのため、機能、用途、目的、言語による制限など、インターフェースを取り巻くあらゆる情報を必要とし、広汎な学術的知識が必要であるため、ひどく単純な目的を除き、一人では不可能に近い。

データの構造化モデルの設計の場合、どういった目的での構造化か、ということが重要になる。あらゆるインターフェースに最適な構造というのは醜悪なほど複雑で、目的が単純であっても恐ろしく複雑な手続きを踏まなくてはならなくなるため、現実的ではなくなってしまう。

プログラムもインターフェースであることにかわりないため、これの設計もインターフェースデザインになる。

コンピュータが理解するのはマシン語で、プログラムはマシン語と自然言語を仲介するインターフェースと考えてみると、視覚化されないインターフェースデザインの結果というのが分かり易いような気がする。

プログラムはある構文に基づいた一定の文字を入力すると、ある結果が返ってくるというような、ベースは単純な設計であるけれど、言語学に精通していなければそもそも構文設計が不可能。

結局のところ、ひとくちにインターフェースデザインといっても様々なものがある。ということがいいたいだけだったりする。

それぞれのインターフェースデザインに求められる知識も技術も全くといっていいほど(重複するところもあるけれど)違うので、GUIの設計=インターフェースデザインと思うのは間違いでもないけど正しくはない。

Ajax時代のインターフェースをデザインインタラクティブなウェブサイト、デスクトップアプリケーションなどをデザインするための具体的かつ実践的なノウハウを「パターン」として体系化。入門書として、またリファレンスとして、すぐに使える一冊。 ¥ 3,990

ユーザビリティの第一人者、ヤコブ・ニールセンの考えをまとめたユーザビリティガイドラインというのを発見しました。

今ではこのヤコブ・ニールセンの考えは比較的一般的になってはいますが、まだまだ目的と手段の逆転したデザインというのもみかけます。

ユーザビリティにせよ、技術にせよ、知識は必ず古くなるため、常にアップデートを心がけたいものです。

ヤコブ・ニールセンの考えをまとめたユーザビリティガイドライン - NPO法人しゃらく

ヤコブ・ニールセンのAlertbox -そのデザイン、間違ってますウェブサイトのデザインでは、きれいな画像や人目を引くFlashをどう活用するかなど、表面的な問題が先行しがちである。しかし、見目麗しいウェブページであっても使いやすいものでなければ、ユーザは容易にサイトから離れてしまう。ウェブのデザインでは、ウェブがいかに使いやすいか、すなわち「ユーザビリティ」が考えられているかどうかがユーザを集めるための重要なポイントとなる。¥ 2,730

タグ

Usability

山口情報芸術センターで開催されている、ミニマムインターフェース展というのに行ってきました。

ミニマムインターフェース展というのは、複数のデザイナーとアーティストが“インターフェース”という共通のテーマでつくった作品の展覧会です。

なんかアーティストの考えるインターフェースと、デザイナーの考えるインターフェースというのは概念が違うらしく、これのどこがインターフェースなんだろう? という作品もありました。

インターフェースのもともとの意味は界面や境界地点という意味らしいので、いわゆるヒューマンインターフェース、プログラムインターフェースといった、デザイナー寄りの考えは、実はその概念の一部でしかないのだと気づかされました。

Webのインターフェースをやっていると、コンピュータインタラクションデザインを起点に考え、マウス、キーボードといった限られた枠の中でのデザインが行われますが、あるプロダクトデザインチームの作品では、見事にそれを裏切られ、境界を作るためにデザインをするのではなく、境界をなくすためにデザインはするもんだな、とか思いました。

次のMacOSやWindows7ではタッチパネルインターフェースがOSのインターフェースとして組み込まれるということですが、今後はヴォイスインターフェース、視点移動・瞬きによるインターフェースなど、コンピュータを操作する手段は拡充されだろうから、コンピュータインタラクションデザインも、同時に進化、発展させる必要があります。

そういった意味でも、これはできないからこの考えはここで止めて、できる事の中で考える、といったデザインをやってるのは危険なような気がします。できるできないはさておき、この考え方を発展させていったらどうなるのか、というのを一応結論まで考え、じゃあこれに近い手段を今できる中で再現するにはどういった方法があるのか、という思考方法へシフトしなければ、いつのまにか過去の方法論にとらわれ、時代遅れのものをつくってるだけの人になってしまう恐れもあります。

とりあえず、近くの人は無料で見れるので、一回行ってみたほうがいろいろ考える事もあると思う。

ネタばれするとおもしろくなくなるだろうから、あえて感傷的な表現をすれば、“アトムとビットを光が繋ぐ” そんなインターフェースと出会えます。

情報デザイン原論-「ものごと」を形にするテンプレート大量かつ無秩序に存在する情報を人間にとって利用しやすい形に整理し，提示する。これが情報デザインの目的であり，本書はその教科書的な書籍である。研究者やデザイナ，建築家など10人を超える著者が各々の専門分野について執筆したものを，一冊にまとめている。理論だけでなく実践やテクニックについての記述が豊富で，理解しやすい。全体としてやや雑多な印象は否めないが，それが逆に，情報をデザインすることがいかに幅広い場面で必要であるかを物語っている。

技術的知識がなくてもサイトの更新が簡単にできる。というのがむかしむかしよく聞いた売り文句だったけれど、最近はWebサイトで提供される情報量の増加、情報構造の複雑化に伴い、むしろ、サイトの情報管理、といった本来の意味での利用がよくきかれるようになった感じがする。

インターフェースの一貫性や、意味的なHTMLといったことでも、CMSはやっぱり便利で、極端なはなし、人間がマークアップするよりも確実で、セマンティクスグラフィック(ボタンや見出しなど、意味レベルで視覚化された情報[勝手につくってみた])などのクオリティからいっても、重要度を増してきてると思う。

サイトのディレクトリ構造の視覚化や、各セマンティクスグラフィックのパーツを選択できる機能、ページレベルでの情報構造の最低限のレベルでの整合性の検証、アカウント別の権限設定など、なんか求められる機能が変わってるっぽい。

むしろCMSを実際に使ってる企業からもWebサイトのインターフェースデザインの重点どこに置くのかとかも分かってきて、デザインの重要性とか品質とかの見方が変わってくればいいな、とかも思う。

OSインターフェースはやっぱどのOSも洗練されてるんで、その辺気づきづらかったりするんで。妙チクリンなインタフェースがいっぱいでて「ウワッこれないわ!」って気づいていくプロセスも実は大事なのかも知れない。デザイナーって科学的知識とか哲学的知識とかスゲー必要な職業なのに、それに比べて一部超企業以外ではナイガシロにされてる感がなきにしもあらず。

本格的CMSサイトを構築するためのMT4.xスーパーテクニックMovable Typeを「ブログの構築ツール」だと思い込んでいませんか? Movable Typeは、企業サイトで利用されるCMS(コンテンツマネジメントシステム)を構築するツールとしても力を発揮します。本書では、CMSとしての企業サイトをMovable Typeで構築するための最先端のプロのノウハウを100の法則として解説しています¥ 2,625

タグ

CMS

まあ別にiPhoneが欲しいという気持ちは全く湧かんのじゃけんど、BlackBerryやらE30HTやらもでてくるし、もういいかげん見てるだけじゃのうて制作もしてみらんといかんのじゃなかろうかとおもっちゅうところですたい。

WiiやらはNTTさんが押しちゅうけんど、個人的はあんまりWiiからの接続はシェアが伸びんのじゃなかろうかと踏んじょる。

でも、WiiでんAppleTVでもよかけん、それば内蔵して、TVの起動=ゼロ時間のネットワークへの接続という仕組みが一般化したら（まあ今でネットワークには繋がるんじゃけど）、もはやパソコンやらをいちいち起動ばするまぬけはおらんくなるじゃなかろうか。

パソコンがデバイスとしてのシェアを失えば、当然わしらもそれらへの対応ばせまられるいうこっちゃし、その意味でスマートフォンへの早い段階での対応っちゅうんは生死が分けかねんのじゃなかろうか。

ケータイは実際情報量が少なかろうし、情報取得のインタフェースとしては使い勝手も良いとはいえんきに。

じゃっどん（だけど）、やっぱタッチパネルインターフェースがもっと洗練ばされて、パソコンと同じ情報に苦もなくアクセスできるようになってみんしゃい。したらば、もうパソコン（にのみ最適化された）向けのホームページなんぞ誰も欲しがらんぞな、もし。

じゃけん、わしゃE30HTば買おうかと思うちょるたい。いくら（価格）かわからんけんどのぅ。

なんとなく今回は九州弁と四国弁で書いてみたけど、なんかすごい読みづらいっぽい。

あとメディアクエリーの最終草案が公開されたそうです。まあ時代はマルチデバイスましぐらたい。

なんか誰かがいっていました。名前は忘れたけど。

Firefox4のはなしです。

なんかWebブラウザの概念を拡張するらしく、おもしろ機能がいっぱいあるそうです。

モジラ：「Firefox 4」に向けた目標はPCとの統合とウェブサービスとの連携強化(CNET Japan)

タグ

Browser

表現の多様性ということを考えれば、3D化の方向に向かっていくような気がする。

ただテキストをメインにした場合には3D化することには意味はないし、だとしたらどこまで3Dにして、どこからを２Dにするのかといったことを考えなければならない。

しかしそう考えるとこれからのWebデザイナーは三次元のインターフェースデザインスキルも求められるようになるわけで、大変だなぁなんて思う。

まあいつになるのかはわからないし、いまいち具体的なイメージがかたまらないけど、きっと3D 化していくんだろうなぁ、なんてことを漠然と思った。

そのうち、もっと考えがまとまったらちゃんと書き留めておきたいと思う。