UIの改悪がUXを改善させる場合 - A Successful Failure
2013年01月20日 UIの改悪がUXを改善させる場合 Tweet Good UI≠Good UX UIとUXについてはその理解について多くの議論がなされてきた。たとえば、Googleの及川氏は「写真が語るUXとUIの違い」というエントリにおいてコーンフレークの例を元にUIとUXについて説明したが、その後、ERATOの渡邊氏が「1分でわかるUIとUXをわかりやすく説明する写真とお話」というエントリにおいて、ATMを例によりわかりやすい説明を挙げている（次の写真は当該エントリからの引用）。 この例ではたとえUIが素晴らしくても、そのATMは時間がかかるため、長い待ち時間ができ、結果としてUXが損なわれる場合を示している。 しかしながら、実際にはATMの劣悪なUIが悪いUXの原因となっている可能性があり、本当にこのATMのUIは素晴らしいのかという疑問が残る。つまり「Good UI ≠ Go
キャンセルのキャンセル問題から考えるダイアログデザイン｜Goodpatch Blog グッドパッチブログ
この文脈では、「編集内容のキャンセル」という処理を続行しても良いかをユーザーに確認しています。続行に同意したい多くのユーザーは直感的に同じ表記の「キャンセル」を押したくなるでしょう。しかしそれでは編集のキャンセルが実行されません。 このキャンセルボタンが意味するのは、「『編集内容をキャンセルする』のキャンセル」なのです。つまり、ユーザーが望み通りに編集内容を破棄するためには、反対側のOKボタンを選ぶべきなのです。このような「キャンセルのキャンセル」は二重否定で意味がややこしくなるので避けなければなりません。 ここで「キャンセルのキャンセル」にならなければ良いということで、次のようにボタン名を変えてみました。 これでもう迷うことは無くなりましたか……？ 私はこの修正は誤りだと判断します。「はい」「いいえ」は結果を予想しにくい表現なので、ダイアログのアクションボタンに用いることはあまり適切では
優れたUXを実現するための人間中心デザインとは？ - UXploration
当記事は、2015年2月5日に無料動画のオンライン学習サイト - schoo WEB-campus（スクー）にて開催した授業「優れたUXを実現するための人間中心デザインとは？」のフォローアップになります。 当日の授業の内容は schoo の下記ウェブサイトよりご覧いただけます（会員登録が必要です）。 はじめに 当企画は schoo と弊社コンセントとの合同企画で「社会に求められる価値あるデザイナーとは？」というテーマのもと、著者含むコンセントのアートディレクターの佐藤とサービスデザイナーの大崎の3名でそれぞれの立場から1人づつ授業を開催してきました。 デザイン領域の拡張に伴うデザイナーとしての役割とは？ 佐藤 通洋 先生 - 無料動画学習｜schoo（スクー） サービスデザイン時代のデザイナーのあり方とは？ 大崎 優 先生 - 無料動画学習｜schoo（スクー） 最終回となる今回は、以下の
Web forms design guidelines: an eyetracking study | cxpartners
Forms can be found on almost every website; from contact or feedback forms in small websites to bank details in commerce websites, from registration to communication, from banking to searching. What we wanted to do, and why we wanted to do it At cxpartners, we have designed and tested numerous new and existing forms for websites from different companies. We use a set of golden rules that we use as
アイトラッキングから検証した、使いやすいフォームの10のポイント
Google Mail、Hotmail、Yahoo! Mail、eBayの各サインアップのフォームを使用して、22～33才までの平均27才のユーザー8人を被験者にしたアイトラッキングから検証した、使いやすいフォームの10のポイントをcxpartnersから紹介します。 Web forms design guidelines an eyetracking study 以下、10のガイドラインからポイントのピックアップです。 1. Vertical, not horizontal 水平ではなく、垂直に フォームのレイアウトは、水平方向の配置やそれが混在したものではなく、単純に垂直方向に配置したものが効果的です。 可能であれば、各ラベルも垂直方向に揃えて配置してください。 2. Left-aligned labels are clearer (anecdotally) ラベルは左寄せにすると、よ
Apple vs. Microsoft - A Website Usability Study
Today we're going to compare the websites of two monumental companies: Apple and Microsoft. The two giants pride themselves for producing cutting edge consumer and business products, and are leading the developments in software and hardware. But what about their websites? How do they both compare, and more important, which one is better and more usable? Well, in this article we'll take a look at b
使い易いユーザーインタフェースとは何かを勉強しています。そこで、質問です。使い易いユーザーインタフェースを持ったウェブサイトやソフトウェアを教えてくださ.. - 人力検索はてな
使い易いユーザーインタフェースとは何かを勉強しています。 そこで、質問です。 - 使い易いユーザーインタフェースを持ったウェブサイトやソフトウェアを教えてください - また、それが使い易いと感じた理由を教えてください 条件は以下、 - 一般的なパソコンのディスプレイ、マウス、キーボードで触れるインタフェース - あなたが実際に体験したインタフェース よろしくお願いいたします。
プレゼンにも最適、ページ内のユーザーの視線をシミュレートする -Feng GUI heatmap | コリス
Feng GUI heatmapは、独自のアルゴリズムに基づいて、ユーザーの視線がどのようにページ内で移動するかとその頻度を表示するヒートマップを作成するサービスです。 Feng GUI heatmap Feng GUI heatmapは、実際のユーザーの視線やマウスの動き・クリックを検出するものではなく、独自のアルゴリズムに基づいてヒートマップを作成します。そのため、サーバーのログなどは必要ありません。 フラッシュの場合は、キャプチャした画像（960x640）をアップロードすると生成されます。 ヒートマップを作成するには、３つの方法があります。 オンラインで Firefoxのエクステンションで ViewFinder website heatmap 1.0 ブックマークレットで Feng GUI heatmapは独自のアルゴリズムでヒートマップを作成するので、実際にアップロードされていない
ビジターを顧客にするサイトデザイン | Moz - SEOとインバウンドマーケティングの実践情報
オンラインの、切実だけど思うように行かない話を取り上げる。サイトにやってきた人々が、サイトでどんな行動を選択するのか？ うまく計画を立てられれば、その答えは「サイト側が望むもの」になる。 サイトにビジターが集まったとする。ビジターはサイトのいろんなページを思い思いに見て回っている。さてどうするか。アクション（行動）の道筋を明確にする必要がある。ここでいうアクションの筋道とは、手取り足取り情報を案内し、ショッピングカートや登録プラン、ダウンロードなどへとビジターを導く緻密で手の込んだ視覚による刺激のことだ。 顧客とトラフィックに関する僕の記事（日本語版記事）からの続きで、今回は、ビジターがたどる明確なアクションの道筋を作るために、ページをどうデザインするかという問題に取り組む。 サイトでのビジターの行動に影響する要因として、どんなものが考えられるだろうか。 サイズ――文字サイズ、ページサイズ
ユーザーの動き。｜CSS HappyLife
ボクたちみたいな、ウェブサイトを閲覧するのが当たり前の人間からすると、全く気づかない事に気づかされたりしたので、自分用メモ。 2008年2月14日の22：47頃に追記 ボクのただのメモ書きをもうちょっとちゃんと以下のエントリーで書いてもらってるので、あわせてご覧になって頂くと、良いかと思います。 Webアクセシビリティについての覚書 - ねんがんのWebユーザビリティテストに参加した ロゴクリック＝トップページに戻るという認識は殆ど無い。 トップページに戻る場合は、ブラウザの「戻る」ボタン。 サイドバーのバナーは、認知すらされない傾向が強い。 そもそもバナーとして押せるものではなく、デザイン上の飾りとして見られる場合も。 リストのマークとかのマーク部分をクリックしよーとする人が居る。 それにより、クリックできないと諦めるケースも。 プルダウン（ドロップダウン）型メニューは、近くのボタンを押
観的なインタフェースをめざして
現在使われている計算機のほとんどは ウィンドウやマウスを使った グラフィカルユーザインタフェース(GUI)で操作を行なうようになっているが、 GUIが一般に普及する前は キーボードを使った コマンドラインユーザインタフェース(CUI)で計算機に指示を与えたり 結果を表示させたりするのが普通であった。 CUIに比べるとGUIは圧倒的に操作が直観的になることが多いため、 GUIを持たない計算機は現在ほとんど考えられなくなっているといえる。 家電製品などあらゆる機器で計算機やネットワークの機能が利用されるように なりつつあるが、これらの世界では現在でもCUI的なインタフェースが利用されていることが多い。 たとえば テレビのチャンネルを変えるために リモコンの数字キーでチャンネル番号と決定ボタンを押すという方式はCUI的な操作といえるだろう。 ビデオの録画予約にしても電子レンジにしても 直観的でな
自由記述欄の入力率を上げるには (ユーザビリティ実践メモ)
問い合わせや会員登録フォームなどで、ユーザが自由に入力できるテキストボックス（自由記述欄）を用意しているサイトは少なくありません。 問い合わせの内容 商品見積り依頼の内容 転職サイトの職務内容 テキストボックスはユーザにとって自由度の高いインタフェースですが、ユーザビリティテストを観察すると、選択式の項目に比べ入力率が大きく落ちる傾向にあります。 ユーザが入力をスキップするのは、（必ずしも項目に無関心だからではなく）何を入れていいかわからず迷ってしまうことが大きな要因です。 そこで、テキストボックス周辺に、「入力例を見る」といったリンクを配置し、記入例やサンプルの文面を提示するのが良い対策の一つとなります。 なお、記入例やサンプルの文面は、具体的なケースに分けて記載すると良いでしょう。 例えば、中古車サイトの「カーセンサー.net」では、在庫確認・見積り依頼のフォームで、様々な想
ユーザビリティ設計メソッド一覧
週末にも関わらず、今日も自宅でお仕事（ホワイトカラーエグゼンプション実践中ですが何か？）。なのでコレといった記事も書けないのですが、先日のビジュアライゼーション周期表と同じ感覚の「ユーザビリティ設計メソッド一覧表」とでも呼ぶべきものがあったのでちょっとご紹介： ■ UsabilityNet: Methods table ユーザビリティとユーザー中心設計を促進することを目的として、EUからの資金援助を受け設立されたプロジェクト"UsabilityNet"の1コンテンツ。優れたユーザビリティを設計するのに役立つメソッドがテーブル形式で一覧されています： テーブルは「企画立案と実行性確認（Planning & Feasibility）」「要件定義（Requirements）」「デザイン（Design）」「実施（Implementation）」「テストと計測（Test & Measure）」「公開
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Cond Nast Portfolio Magazine - Top News - Business & News Blogs - Business Strategy
COULD：Webデザインに関する 15 の調査結果
Methods table | UsabilityNet
A Periodic Table of Visualization Methods
対話の原則
人間環境整合論 第9回 コンピュータ利用におけるエルゴノミクス
人間環境整合論第9回コンピュータ利用におけるエルゴノミクス