» スマートフォンサイトのユーザビリティを下げるアンチパターン | Webnoborder
モバイルデザインパターン― ユーザーインタフェースのためのパターン集を読んで、スマートフォンサイトのアンチパターンも作りたいと思ったのがキッカケで作ってみました。 独断と偏見で評価しています。 反応エリアを探させるアコーディオン 「お金からモバイルデザインパターン― ユーザーインタフェースのためのパターン集を読んで、スマートフォンサイトのアンチパターンも作りたいと思ったのがキッカケで作ってみました。 独断と偏見で評価しています。 反応エリアを探させるアコーディオン 「お金から探す」周辺のリストがアコーディオンになっていますが、テキストの部分をタップしても何も動作しません。 プラスアイコンの部分をタップしないと反応しないのです。 このようにタップ領域がユーザの意識と違う場所に設定されているのは、ユーザビリティに問題があるといえるので改善が必要でしょう。 参考サイト スマートフォンサイトにお
タブの正しい使い方
13のデザインガイドラインを守ってタブを使っているサイトにYahoo Financeがある。しかし、AJAXの使い過ぎや改善の余地が残るカスタマイゼーションのページなどを見る限り、ユーザビリティはまだ上げられる。 Tabs, Used Right by Jakob Nielsen on September 17, 2007 Web上でダイアログコントロールを正しく使っているユーザ・インターフェイスを見かけることは滅多にない。ラジオボタンやチェックボックスのように単純なものでさえ、正しく使われていないことが大半だ。ドロップダウンメニューに至ってはもっとひどい状態だし、Flashサイトを台無しにする自作のスクロールバーも後を絶たない。 最近リニューアルされたYahoo Financeのホームページでは、タブを正しく使っている。2箇所ほど抜粋してご覧に入れよう。 Yahoo Financeのホー
ソシオメディア | iPhone の当たり判定を検証した
スマートフォンやタブレットなどのモバイルデバイス向けにUIをデザインする際には、タッチ操作に適したコントロール表現を追求しなければいけません。 タッチ操作に適したコントロール表現とは、前回書いたジェスチャもありますが、それ以前に、ボタンやリンクなどのUI要素を指で押しやすい大きさにすることが大切です。 パソコン画面のマウスポインターと違って、タッチスクリーンにおいて指でボタンをタップする場合、指がそのボタンを覆い隠してしまうので、意図した場所に正しく触れているのか分かりにくく、またボタン自体の視覚的なフィードバックも確認しづらいという課題があります。 またマウスポインターではピクセルレベルで画面上の座標を指し示すことができますが、指先ではそのような細かい操作はできません。 ですからタッチデバイスでは、ボタンやリンクが細かく密集しているようなデザインは大きなストレスになります。 最低限の大き
ユーザーテストサービスのUIscope | UIscope
ユーザーがどのようにサービスを使っているのか。 利用シーンが最短1日で届く、 ユーザーテストサービス。 いますぐ無料で試してみる UIscope とは？ 「高品質なユーザーテストを 最も安く・早く・簡単に」 ユーザーがサービスを使っている様子を 動画形式でお届けする、 ユーザーテストサービスです。 ユーザーテストとは
なぜAmazonのメガドロップダウンメニューはスムーズに操作できるのかという秘密
日本のAmazonでも採用されているメガドロップダウンメニューについて、なぜAmazonのメニューはユーザーが使いやすくできているのかという秘密が明らかになりました。ユーザビリティを改善することが至上命題のネットショッピング系サイトにとっては非常に有益な知識となっています。 Breaking down Amazon’s mega dropdown - Ben Kamens http://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown まずこれがAmazonの左上にあるカテゴリーを一覧化したメガドロップダウンメニュー。日本のAmazonにも同様のメニューが採用されており、マウスカーソルを上に持っていくと実にスムーズに動きます。 通常のメニューの場合、以下のようにして少し遅れてサブメニューが開くようになっています。 な
Crazy Egg — Coming Soon…
Understand the customer journey with Snapshots, Heatmaps and Recordings Use our visual reports and individual session recordings to get to know your website visitors – where they're coming from, where they're navigating to, and where they're getting stuck – so you can make design changes with confidence. Start by analyzing your website Get direct feedback from your customers and website visitors I
なぜEtsyでは無限スクロールは失敗したのか
「ユーザーがページに滞在してコンテンツに関わる時間が長くなる」といわれる無限スクロールを採用したものの、うまくいかなかったというEtsyでの事例から、その教訓を読み解きます。 U-Site編集部 2013年1月25日 HCD新人部員のTです。 1年以上前の記事ですが、「Pinterestによってもたらされた、6つの重要なWebデザインとユーザビリティにおけるトレンド」という下記の記事を読んでいました。 該当記事：6 Important Web Design and Usability Trends Sparked By Pinterest – The Daily Egg ここで挙げられている項目の3つ目のトレンド、”Deliver Content in Flow”を見てみますと、「無限スクロールによって、ユーザーがページに滞在してコンテンツに関わる時間が長くなる」と書かれています。 Bec
COOKPADの「伏せ字にせず入力」ボタンは素晴らしい
@tokuhiromから教えてもらったのですが、COOKPADのスマートフォン向けWebサイトのログインページには、パスワードを「伏せ字にせず入力」するボタンがついているのですね。 さっそく見てみましょう。まずはログイン画面です。パスワード欄の下側に、「伏せ字にせず入力」ボタンが見えます。 「元に戻す」ボタンを押すと、伏せ字に戻ります。 僕はこれを知って興奮しました。なぜなら、拙著「体系的に学ぶ 安全なWebアプリケーションの作り方」には以下のように書いたからです（P337～P338）。 パスワード入力欄のマスク表示は、現在の常識的なガイドラインですが、実は筆者自身は疑問を持っています。パスワード入力欄をマスク表示にすると、記号や大文字・小文字交じりの安全なパスワードを入力しにくくなるので、利用者は簡単な（危険な）パスワードを好むようになり、かえって安全性を阻害するリスクの方が大きいのでは
パスワードを隠すのをやめよう
ユーザがパスワードを打ち込んでも、黒い点の列でしかフィードバックが返ってこないとき、ユーザビリティは損なわれている。パスワードを隠したからといって、セキュリティは強化されないことが多く、逆に、ログインの失敗によって、あなたのビジネスに悪影響を及ぼす。 Stop Password Masking by Jakob Nielsen on June 23, 2009 ユーザがパスワードを打ち込んでいるとき、ほとんどのパスワードをはっきりとテキストで示すべき時期が来ている。フィードバックを提供し、システムの状態を視覚化することは、常にもっとも基本的なユーザビリティの原則の１つである。ユーザが複雑な暗号を入力している間、どれも同じ形の黒い点を見せるというのは、間違いなくその原則に違反している。 ほとんどのウェブサイトは（そして多くのアプリケーションでも）ユーザがパスワードを入力している最中、パスワー
Engadget | Technology News & Reviews
The Polaris Dawn crew is back on Earth after a historic mission
ユーザビリティを向上させる25のデザインの基本概念 デザイン会社 ビートラックス: ブログ
ビジネスにおけるユーザーインターフェイス(UI) や、ユーザーエクスペリエンス(UX)の重要性が頻繁に語られる事が多い。 Webサイトやアプリから始まり、自動販売機、券売機、車のダッシュボート、テレビ、トイレ、エレベーターのボタン配置に至るまで、”ユーザビリティー”と表現される ”使いやすさ” の大切さが注目を浴びている。 そして、その使い易さを生み出す最初の入り口がインターフェイスである。 インターフェイスとは、ヒトとデバイスとの円滑なコミニュケーションを達成するための媒介役であり、操作性や使い易さを印象づける点ではソフトやデバイスの成功を最も左右する、唯一無二の存在である。 今さら聞けないUI（ユーザーインターフェース) の基本 最終的なインターフェイスの仕事は “ユーザーゴール + ビジネスゴールの達成”であり、どんなに良いプロダクトを作っても正しい方向にユーザーを導き、ビジネスとし
メンタルモデル
ユーザーがUIについて知っていると思っていることは、彼らがそれをどう利用するかに強い影響を及ぼす。メンタルモデルのずれというのはよくあることであり、特にデザインで何か新しいことをしようとするときには起こりがちである。 Mental Models by Jakob Nielsen 2010年10月18日 メンタルモデルはヒューマンコンピュータインタラクション (HCI) の最も重要なコンセプトの1つである。実際、我々もインタフェースデザインの原則での1日セミナーで、それがデザインとどう関連するか、かなりの時間をかけて扱うことにしている。 ここではユーザビリティ調査から得られた事例を何件か報告しようと思う。具体的な例を挙げることで、（「メンタルモデル」のような）抽象的なコンセプトの理解の助けになるのは偶然ではないからである。 そうはいっても、まずは少々の理屈について、我慢して読んでもらわなけれ
iPadならではの特徴的なユーザ行動について (ユーザビリティ実践メモ)
iPadのようなタブレット型のタッチＵＩ端末では、PCでは見られなかった特徴的なユーザ行動が見受けられます。今回は、弊社の調査で見られたiPadにおける特徴的なユーザ行動と、デザイン上のポイントについてご紹介します。 【ポイント１】 ユーザはスクロールが苦ではない 弊社のユーザ調査にて、iPadで画面が切り替わる度にスクロールしてみようと画面をドラッグするユーザがよく見受けられました。ユーザは画面をスクロールしたがる傾向があるようです。 確かにiPad上で画面をスクロールすると、指に吸い付くようにスムーズに画面が動くため、直感的で心地よい感じがします。iPad上での快適なインタラクションは、ユーザにとってポジティブなフィードバックを与え、スクロールも苦になりにくいと考えられます。 情報は極力たくさん並べよう 調査で用いたショッピング用のアプリでは、iPadの縦１画面内におさまるだけの商品し
手軽にモバイルWebサイトのユーザーテストを行うことのできる iOSアプリ「UX Recorder」がなかなか便利 | ツール・リソース | 15NOTE
2012年7月23日に Foraker Labs よりリリースされた「UX Recorder」を使ってみました。ユーザーのアクション（スワイプ、タップ、スクロール）と同時に表情を記録できるとあって、なかなか便利なアプリだったので共有したいと思います。「UX Recorder」で録画した動画を晒したりもしてみます。 「UX Recorder」はモバイルWebサイトのユーザーテストを行うためのアプリです。iOS向けのアプリとなっており、iPad版もあるようです。私はiPhone版を購入しました。販売価格は「$59.99」、日本円で5,250円となかなかいいお値段ですが、小規模なユーザーテストを頻繁に行う方にとっては、有効なアプリなのではないかと考えております。 「UX Recorder」で録画した動画をアップしました。こちらを見ていただければ、どのようなことができるのか、ご理解いただけると思い
A/Bテストの数理 - 第1回：人間の感覚のみでテスト結果を判定する事の難しさについて - - doryokujin's blog
データ解析の重要性が認識されつつある（?）最近でさえも，A/Bテストを始めとしたテスト（ = 統計的仮説検定：以後これをテストと呼ぶ）の重要性が注目される事は少なく，またテストの多くが正しく実施・解釈されていないという現状は今も昔も変わっていないように思われる。そこで，本シリーズではテストを正しく理解・実施・解釈してもらう事を目的として，テストのいろはをわかりやすく説明していきたいと思う。 スケジュール スケジュール 第1回 [読み物]：『人間の感覚のみでテスト結果を判定する事の難しさについて』：人間の感覚のみでは正しくテストの判定を行うのは困難である事を説明し，テストになぜ統計的手法が必要かを感じてもらう。 第2回 [読み物]：『「何をテストすべきか」意義のある仮説を立てるためのヒント』：何をテストするか，つまり改善可能性のある効果的な仮説を見いだす事は，テストの実施方法うんぬんより本質
人と機械の新しい関係を作るUIを求めて---ユーザビリティテスト、実世界GUI、デザイン思考
ユーザーインタフェース（UI）をテーマにしたイベント「Android Usability Seminar 2012」（主催、日経BP ITpro Android Application Award 2012事務局）が2012年1月28日、都内で開催された。Suica改札機を手がけた山中俊治氏、携帯電話やiPhoneの日本語入力システムを開発した増井俊之氏、医療など様々な領域で「デザイン思考（Design Thinking）」に基づくプロジェクトに関わっている奥出直人氏ら著名な講師が、実プロジェクトに基づきUIの本質的な問題についての議論を展開した。 ユーザビリティ調査が作るUI、Appleの常識外れなデザイン 山中俊治氏 山中俊治氏はLEADING EDGE DESIGN代表として様々なプロダクトデザインにかかわるとともに、慶應義塾大学大学院で教授として教鞭もとっている。東京大学工学部の在
エンジニアのための UX 入門
はじめまして，Aiming 東京開発G の珍田 (kchinda a.k.a. @ckazu) です． 普段は Rails を用いた Webサイト開発や， Rails + JS でのブラウザゲームの開発などをしています． 今回は，弊社 Aiming で週に一度行っている，エンジニア勉強会での発表内容を紹介します． この発表は，開発エンジニアにデザインや UX の根本的な考え方を知ってもらい，また，エンジニアにもそういう視点が必要だと感じてもらおうという趣旨で行いました． h2. エンジニアが UX を知る目的 ソフトウェアの開発エンジニアにとって， *デザイン* や *UX* （User Experience: ユーザ体験）の知識はどれだけ重要でしょうか． ものづくりにユーザの視点は欠かせません． より使いやすいモノを作るためには，ユーザにとっての使いやすさを追求するべきです． 私たちにと
Chrome 6開発版、ページボタンとツールボタンを統合 | エンタープライズ | マイコミジャーナル
Google Chrome runs web pages and applications with lightning speed. Chrome 6開発版にユニファイメニュー機能がマージされた。Chromeのアドレスバーの右側には2つのボタンが用意されている。ページに関するメニュー項目をまとめたページボタンと、ウィンドウやタブそのほかオプション設定などのメニュー項目をまとめたツールボタンだ。Chromeの登場当初、従来のブラウザのようなメニューを提供せず、この2つのボタンにメニューをまとめたことはシンプルにして扱いやすいと好評を得た。 Chrome ページボタン Chrome ツールボタン しかし、FirefoxやOperaのデザイナ、デベロッパはこの新しいUIを研究し、実はどっちのボタンにどのメニューが用意されているのかが分かりにくく、何度もボタンを押して内容を調べることになるという
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Clicktale Is Now Contentsquare - Explore Our Combined Platform
ケータイ公式サイト&ダウンロードサイトのユーザビリティ6つのポイント（第4回） | モバイルサイト構築のユーザビリティいろは
