80年代のAppleに学ぶUIの部品化とガイドライン ― ＠IT
インタラクションデザインパターン（1） 80年代のAppleに学ぶUIの部品化とガイドライン ソシオメディア 上野 学 2007/2/7 インタラクションデザインパターンのプロローグとして、その原則や秩序の歴史を見てみよう。20年前のAppleはどのように質の高いアプリケーション開発を目指していたか デザインが優れていれば、道具はより楽しいものになり、利用者はより生産的になるはずです。道具のデザインというものは大昔から私たち人間が取り組んできたことですが、近年急激にデジタルデバイスが多様化したことによって、インタラクティブな道具をデザインするための方法論は技術の進歩に追い付くことができなくなっています。利便性を高めるはずの新技術が使い方を複雑化する要因となり、利用者の混乱は増すばかりです。 最近私は携帯電話を買い替えたのですが、同じメーカーの3年前の機種と比べて、著しく使い勝手が悪くなって
第12回 Ajaxを利用したサイトで違和感を覚えることがある
「Ajax」という言葉は，2005年2月に情報アーキテクトであるJesse James Garrett氏が「Ajax: A New Approach to Web Applications」という記事の中で初めて使ったと言われています。それから2年近くが経って，すっかりこの言葉やそれが表すテクニックも一般的になった気がします。 今や，単にページの一部の書き換えや，ちょっとしたデータの送信にAjaxのテクニックを利用しているページは珍しくありません。サーバーとのデータのやり取りの多くに，JavaScriptを利用した非同期通信を行って，メールやカレンダー，ワープロなどのオフィス・ツールなど，まるでスタンドアロン・アプリケーションのような見た目を実現しているサイトも少なくありません。 筆者が，JavaScriptを使ってページの遷移をほとんど行わないインタフェースを初めて「意識的に」体験したの
Wedding Mapperの登録フォームがちょっと笑えますｗ | SiMPLE*SiMPLE
Wedding Mapperの登録フォームがちょっと笑えますｗ January 12, 2007 7:01 AM written by 8maki 百式でも紹介していたWeddingMapper。 このサイトでは結婚式用のマップをつくることができて、地図上に会場やら飛行場やらの場所を設置できます。 そこで、実際にマップを作る様子をレビューしようと思いたちました。 設置するにはアイコンをドラッグ＆ドロップしていくだけなので快適です。 ↓のようなマップにアイコンを置いていきます。 まずは結婚式場を設置・・・・・・・ん？なんとなく登録フォームが大きくなってるような・・・↓ そして次に飛行場も設置。いや、絶対大きくなってるから！↓ 最終的にこんなにでっかくなっちゃいました・・・↓ どうやら6個のオブジェクトを設置した時点で最大になるみたいです。 これでは操作に支障をきたすのでは？と、思いつつも新し
人力検索はてな - 入力フォームのデザインがすばらしいページを教えてください。 派手さや装飾ではなく、使いやすさ、見やすさなど機能美優先でお願いします。 海外のサイトでも結構で
入力フォームのデザインがすばらしいページを教えてください。 派手さや装飾ではなく、使いやすさ、見やすさなど機能美優先でお願いします。 海外のサイトでも結構です。
いらないときは隠すインターフェース | SiMPLE*SiMPLE
いらないときは隠すインターフェース January 11, 2007 8:00 AM written by watanabe シンプルさを追求するには、削れるものをそぎ落としていく作業と同時に、きちんと意味が伝わるような工夫が必要なのかなと思います。 そういう意味で、シンプルなスペルチェッカーspellifyは参考にできそうです。 ↑ 画面には、フォームしかありませんが・・・ ↑ フォームをクリックすると使い方の説明がすーっとあらわれ、フォームの外をクリックするとすーっと消えます。 あまり使い慣れていない画面ではどうかと思いますが、検索窓のようにある程度何をするかわかっているところで、こうした「隠れ説明」が必要なときだけ出てくるというのも悪くないですね（少なくともちょっとした驚きがありました）。 場所にもよるかと思いますが、「必要なときには表示して、いらないときには隠しておく」というインタ
Human Information Interface lab
ヒトと情報のインターフェイスを研究するポータルです。当labの研究員になりたいというブロガーの方を募集しています。 ご自分のブログでの研究結果を掲載したいという方は コチラ からお申込みください。 ご協力お願いします。もちろん、登録は無料です。
人はページ内のどの辺りをクリックする傾向があるのか
まったく何も描かれていない無地のものから、文字で「click here」と書かれているものまで、8枚の画像に対して好きなところをクリックすると、自分と他の実験者のクリック位置データが表示されます。結果表示はクリックされることが多い所ほど熱そうな色になっていくのですが、かなりハッキリとクリック位置の偏りが出ています。 詳細は以下から。 一枚目は無地です。手っ取り早く結果のデータだけ見たい人は右上のSkipをクリック。 New Click Survey ジョルジュ・ド・ラ・トゥールの名画「いかさま師」をつかったクリック実験もあります。 Click Survey 好きなところをクリックしていいといっても目標があるとそこに意識が向かってしまうようですね。
SpaceNavigator PE (SOLVALOU.NET)
このナゾのサムシングはいったいなんでせうか。 実は3Dアプリ用のインターフェイスらしいんですが、Google Earthに対応していて、これで地球をグリグリ操作できるらしいのです！ > 中央のキャップを指先で押したり、引いたり、傾けたり、ひねったりするだけで、 > 上空から地上までの接近や上昇、360°パノラマ展開、道路や飛行機の航路に沿った > 曲線的な移動などをスムーズに行うことができます。 SUGEEE！超ホシス！ これはお小遣いがたまったら即効ゲッツします。 ※今のところAmazonでしか売ってないみたいです（先行販売ぽい） SpaceNavigator PE (Personal Edition)メーカー: 3D Connexion価格: ￥ 9,980発売日: 2006/12/08売上ランキング： 73おすすめ度 posted with Socialtunes at 200
第9回 どうすればユーザー登録してもらえるか：ITpro
この連載では，エンジニアの視点から使いやすさを考えています。今回はユーザー登録画面などに代表される，フォームを使った入力画面について考えてみたいと思います。 なぜこのテーマを選んだかというと，フォームを介して利用者からデータを受け取って処理をして返すという一連の処理が，ウェブサイトのバックエンドの処理やデータ形式などによって変化しやすく，プログラマやエンジニアの作業がもっとも使いやすさと関係しやすい分野ではないかなあ，と思っているからです。こうした部分はエンジニアが使いやすさに寄与しやすい部分であり，もっと言えば，使いやすさを向上させるに当たって，エンジニアにしかできない事柄がたくさんある部分だってことになると思います。 今回は「ユーザー登録ページ」を例に，フォームにおける使い勝手を考えていきたいと思っています。その理由としてまずは，筆者が勤務する株式会社はてなにもユーザー登録画面があり，
JavaScriptでMacOS XのDock機能を実現する:phpspot開発日誌
Alexei@Nitobi Blog Archive Development Diary: Taming the Fisheye I thought it might be a good idea to document the development of one of our components from a user-interface perspective. We’re in the process of developing a host of new components now, which should be ready for release early this spring. One of these is a Fisheye Menu. JavaScriptでMacOS XのDock機能を実現する。 Dock機能というのは、次の画像のようにカーソルを合わせると画
目次：ITpro - 技術者視点のユーザビリティ考
使いやすいサイトを作るのは，デザイナーだけの問題ではありません。エンジニアとしてサイト構築にかかわっている筆者が，日ごろぶつかった問題をネタにじっくり考えていきます。 ・第33回 リピーター増加を阻む「面倒くささ」の壁 あるウェブサービスを初めて使った人が「しばらく使ってみよう」と思ってくれても，「面倒くささ」の壁に阻まれて次第にサービスの利用から遠ざかっていくことはよくあります。ブラウザを利用しないものを含む，さまざまなインタフェースを提供することで，その面倒くささを乗り越えられるのではないか，という仮説のもと，いくつかの例を紹介します。 ・第32回 リダイレクトの正しい使い方とは あるページ（URL）にアクセスすると，自動的にほかのページにジャンプするリダイレクトは，ウェブサイトを構築するうえで非常に重要な仕組みです。しかし，ユーザーの知らないうちにページの移動を行うため，ユーザーを戸
サイトの横幅を640ピクセルにする理由――統計と現状に基づく結論 [絵文録ことのは]2006/11/25
このブログの本文の横幅は、かなり狭い。それはなぜか。 結論から言えば、「ブラウザで見るときの実際の横幅」と「印刷可能な横幅」の二つの要素が大きな要因となっている。画面そのものはかなり広くても、実際に見るサイズ、そして印刷したときにはみ出ないサイズというのは案外小さい。 このことを実際の統計数値を交えて書いてみたいと思う。 ■画面の広さ 以前の旧デザインでは、横幅を指定せず、可変幅で表示していた。たとえばここなどを見てもらえばわかるが、ブラウザを小さくすればそれに応じてサイズが縮まる。したがって、どんな幅のブラウザでも（狭すぎると困るが）はみ出ることはないし、また、印刷するときにもきちんと印刷される。画面上で見るときの「横スクロール」というのは想像以上に鬱陶しい。 だから、可変幅というのは、ある意味、無難な正解といえる。 ■一行の長さは40字前後にしたい しかし、画面そのものがかなり大きくな
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Home « Patterns « VisibleArea.com
http://www.yasuhisa.com/could/entries/001071.php
Technologies for UI
http://www.yasuhisa.com/could/entries/001064.php
dontclick.it
リッチデバイス (3D connexion.com) | 100SHIKI
standardimage | design artdirection photography. is that it?
Phenomena Entertainment