ユーザーが間違えても間違えなくてもエラーは回避せよ ― ＠IT
Webアプリケーションのユーザーインターフェイス[8] ユーザーが間違えても間違えなくても エラーは回避せよ 「経験則その4：エラーの回避」 ソシオメディア 上野 学 2006/3/15 ユーザーは間違えるものとし選択を制限するか、ユーザーは間違えないものとしエラーメッセージの廃絶を目指すか。あなたの目指す方向性はどっちだ？（編集部） 前回の「すでに入り口にいるのに、ホームに導くボタンは親切か」では、経験則その3として「可視性とフィードバック」の話をしました。ユーザーが思いどおりにシステムをコントロールでき、そしてシステムの状態が常に分かるようになっていることが大切であるという話でした。しかしいくら操作性が良くても、何か作業をしている間に何度もエラーが発生してやり直しが多くなってしまうのではいけません。 エラーはタスクの進行が失敗したことを意味し、ユーザーとシステムの対話はそこで止まってし
すでに入り口にいるのに、ホームに導くボタンは親切か ― ＠IT
Webアプリケーションのユーザーインターフェイス[7] すでに入り口にいるのに、ホームに導くボタンは親切か 「可視性とフィードバック」 ソシオメディア 上野 学 2006/2/15 前回の「『戻る』で入力データが消えてしまうフォームはいらない」では、経験則その2として「寛容性とユーザーコントロール」の話をしました。システム側がユーザーを信頼し、ユーザーのコントロール下でユーザーの思いどおりの振る舞いをすることで、ユーザーとシステム（あるいはサービスの提供者）との間に信頼関係が生まれ、利用効率や生産性が高まっていきます。 そこで今回は、どうすればユーザーが思いどおりにシステムをコントロールできるのか、どうすればユーザーはシステムが自分の思いどおりに動いていると感じるのか、ということを考えたいと思います。これが経験則その3、「可視性とフィードバック」です。
あれこれポップアップ
ウェブページ (HTML) にて、マウスポインタの下にある任意の箇所（要素）の情報（属性値）あれこれをポップアップに出す、 JavaScript と CSS のセット。 Web サイトの製作運営者向けの一種の「素材」。 HTML に「あれこれポップアップ」の外部 JavaScript と 外部 CSSを適用するだけで、すぐ機能します。そのはず。 多くの典型的なブラウザでは、 title 属性に何か書いてある要素部分にマウスポインタをかざすと、その title 属性値がツールチップとしてポップアップしますよね。あれのゴージャス版と思ってもらえればよいです。典型ブラウザ本来のポップアップとの違いは、ポップアップするのが title 属性だけではない点。それと自分で言うのも何だけど、見てくれがカコイイ事（笑） 適用サイト利用者向け FAQ だうんろーど他 お持ち帰り用アーカイブをダウンロード 2
ポップアップメニューの作成
レイヤをある程度理解する事ができれば、いろいろ面白い事が行えるようになります。 この章では、Microsoftなど有名サイトでも良く使用されているレイヤを使ったメニューの作成に挑戦します。 最近では、ホームページ作成ソフトにポップアップメニューを簡単に付けられるものがありますが、 それらのソフトが生成するJavaScriptを再配布する事はできません。 また、メニュー作成法を理解していなければCGIに応用する事もできませんので、簡単なものは作成できる必要があります。 ダイナミックメニューを作る それではこの章のまとめにダイナミックなメニューを作ってみましょう。 <style TYPE=text/css> a:link {text-decoration:none;color:#405040 } a:visited {text-decoration:none;color:#405040 } a
UIEngineが生み出す新しい家電のコンテンツサービス
米MicrosoftのInternet Explorer（IE）3、4やWindows 98で主任設計者を務めた人物がいま描く未来は、PCやデジタル家電などの機器がすべてネットワークを通じて1つのコンテンツでつながる世界だ。 人気ブログ「Life is beautiful」の著者でもある中島聡氏は、1989年から2000年までの間、Microsoftでユーザーインターフェースの開発に携わってきた人物だ。2000年には、携帯電話やPDAなどさまざまな機器で1つのウェブアプリケーションが利用できるようにするためのソフトウェアを開発・提供するUIEvolutionを設立している。 これまで米国を中心に事業展開していたUIEvolutionだが、2004年3月にスクウェア・エニックスに買収され、2006年1月には日本法人「UIE株式会社（仮称）」を設立して国内でのビジネスを本格始動することになった
Infoperience - 「OK」ボタンの秘密
「OK」ボタンの秘密 デザイナーというものはいつも、混沌とした事物の断片を整理して、どこまで最終的に求められる方向性を保ったままそれらを秩序立てることができるのかという挑戦を強いられている。そのために、最終目的に合わせたひとつの法則を作り出し、細かな選択（この部分は青にするのかそれとも赤にするのかといったこと）を行う上での判断基準にするのである。しかしひとつのデザインに求められるのはひとつの機能だけではない。論理的に考えれば機能衝突を起こすような要望があるのが普通であり、また、デザインにはそれを解決するだけの力があるのだ。 例えば、上級者にとっての使い勝手を向上させるために新たなインターフェイス要素を導入することが決まったとする。これは既存のデザイン言語に合わせてきちんと設計された機能であり、デザイナーはそれをどうやって定着した画面要素に加えようかと悩むことになる。そして一貫性を保ったまま
「戻る」で入力データが消えてしまうフォームはいらない ― ＠IT
Webアプリケーションのユーザーインターフェイス[6] 「戻る」で入力データが消えてしまうフォームはいらない 「寛容性とユーザーコントロール」 ソシオメディア 上野 学 2005/12/22 前回「入力情報を預かる責任を果たせる画面デザインとは？」は、あらゆる経験則の土台となる価値観として、「ユーザーを尊重する」というユーザー中心の姿勢について述べました。今回からは、Webアプリケーションのユーザーインターフェイス（UI）・デザインを行ううえで有効な経験則を、少し具体的に考えていきたいと思います。 その前にまず、連載の第1回「ユーザーにとっては“ユーザーインターフェイス”こそが製品そのもの」で触れた HCI（Human-Computer Interaction）の分野でよく挙げられる、コンピュータを用いた対話型システムの設計原則を紹介しておきます。ここでいう「対話型システム」とは、ユーザー
色の組み合わせチェック - 読みやすい前景色と背景色
誰にも読みやすいコンテンツとするためには、文字色と背景色のコントラストをしっかり確保しなければなりません。これを客観的にチェックするため、色の明るさの差などを計算する仕組みを用意してみました。 色の組み合わせ検証 テストの手法 コントラストの計算 色覚偏位のシミュレーション 当サイトが独自に加えたコントラストの段階評価 コントラストと読みやすさの相関関係 色の組み合わせ検証 検証してみたい文字色と背景色の組み合わせを入力してみてください。色の指定には3桁もしくは6桁の16進数カラーコード、あるいは色名（CSS2の色名＋SVGの色名、計147色）およびrgb()の表現が使えます（初期値は、読みにくい例が入っています）。また、入力欄左ボックスから216色のパレットを呼び出して入力することもできます。文字色2、3は、複数の文字色の組み合わせを表示するためのオプションで、コントラストなどの計算は行
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
void GraphicWizardsLair( void ); // プログラマとしてスゴすぎると、その美学によって優れたインターフェース設計者に成りがたい実例
Phenomena Entertainment
OKボタンの位置はどこが適切?
http://www.interq.or.jp/japan/satoshi0/sample/popUpMenu/
BodyTalk: 伝えるWebレイアウトの配色
色の印象大事典