5種類の買い物客のためのECサイトのデザイン
ECサイトの買い物客には主に5つのタイプがある。それぞれ異なる、サイト訪問時の動機や行動パターンを知ることで、デザイナーは各ユーザーのニーズをサポートしつつ、サイト全体のユーザビリティを向上させる決断を下せるようになる。 Designing for 5 Types of E-Commerce Shoppers by Amy Schade on March 2, 2014 日本語版2014年4月2日公開 ECサイトの買い物客というのはさまざまだ。特定の商品を目当てにサイトを訪問する人もいれば、買うものを決めようとしている段階の人もいるし、暇つぶしに来る人もいる。したがって、ECサイトサイトのあらゆる要素、つまり、商品の画像から説明、登録、精算に至るまで、すべてがサイトの成功には重要だ。しかし、買い物客のタイプによってサイトで利用される要素は異なっている。 それぞれのユーザータイプの特定は、デ
Facebookが新デザインを捨てた理由
結局あんまり変わらないなーと思ってた方、こんな事情なんです。 去年、Facebookはデザインをリニューアルして、上の画像みたいに写真を大きくきれいに見せるようになった、はずでした。でもFacebookはこのデザインを一部のユーザーに使わせただけで、最終的には従来に近い見せ方に戻しています。 起業家のダスティン・カーティスさんは、このリニューアルデザインが世に出なかった理由は広告収入に結びつかなかったからだとする記事を書いていました。でもFacebookのプロダクトデザイナー、ジュリー・ズオさん曰くカーティスさんの主張は間違っているそうです。本当の理由は、ユーザーが使っている古いモニタにあった、とのこと。 わかったのは、私（または今これを読んでいるあなたも）のモニタは27インチの超高解像度のシャープなものかもしれませんが、多くの人のモニタはそうじゃないってことです。世界全体では、アップルと
カルーセル | Accessible & Usable
公開日 : 2014年3月16日 カテゴリー : アクセシビリティ / ユーザビリティ Web サイトのユーザーインターフェース (UI) に「カルーセル (carousel)」と呼ばれるものがあります。文字通り訳すと「回転木馬」という意味ですが、情報 (画像だったり、画像＋テキストだったり) をパネル状に横に並べて、Web ページの幅を超えて隠れている情報も「くるくる」と手繰り寄せて表示できる、という UI です。 Amazon の「この商品を買った人はこんな商品も買っています」が有名な例です。 Amazon (amazon.co.jp) における「この商品を買った人はこんな商品も買っています」のカルーセル また最近では、Web ページのメインビジュアルにカルーセルを採用している例もよく見られます。タッチジェスチャとの親和性が高い (左右方向へのフリックやスワイプで容易にパネルを切り替え
13人のスタートアップ起業家が教えるUXデザインのベストプラクティス - SEO Japan｜アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
無料で資料をダウンロード SEOサービスのご案内 専門のコンサルタントが貴社サイトのご要望・課題整理から施策の立案を行い、検索エンジンからの流入数向上を支援いたします。 無料ダウンロードする ＞＞ 最適なUX（User Experience）、ユーザー体験を提供することはスタートアップにとってサービスの普及できるかどうかの死活問題。今回はThe Next Webが今をトキメク夢と才能に溢れる若き起業家たちに、自身の経験から「スタートアップにとって」最も重要と思われるUXのアドバイスを提供してもらった記事を。 — SEO Japan UXを改善してユーザーを最優先に扱うことについては色々な話があるが、最高のユーザー体験に本当に必要なものは何なのだろう？私は、13人の優秀な起業家たちにそれぞれのお気に入りのベストプラクティスを共有するよう頼んだ。特に、体験よりもFlashに焦点を合わせる傾向の
Webサイトに変なスクロール使うのをやめろ
最近変なスクロールを使ってるサイトを見る。 これとか http://www.apple.com/iphone-5s/ これとか http://heteml.jp/ 他にも色々。 Javascriptがなんか頑張ってんだろうけどさ、 正直鬱陶しいよ。 やけに重いし、使いづらいし。 Chromeだとヌルヌル動くって？ みんなChrome使ってる思ってたらアカンでほんま。 追記： この変なスクロールはパララックスと言うそうです。 「この変なスクロール＝パララックス」ではないそうです。 また、「この変なスクロール＝パララックスのひとつ」と言う訳でもないみたいです。 ごめんね、もうこの追記消したい気分。
iPhoneの電卓で2500÷50を計算してみた結果ｗｗｗｗｗｗ : IT速報
1: 以下、名無しにかわりましてVIPがお送りします 2014/01/21 19:22:59 ID:BZs7VpX50 1 は？ 2: 以下、名無しにかわりましてVIPがお送りします 2014/01/21 19:23:33 ID:H/oStVp60 嘘乙 5: 以下、名無しにかわりましてVIPがお送りします 2014/01/21 19:24:03 ID:tOB/+Dr70 まじだった 6: 以下、名無しにかわりましてVIPがお送りします 2014/01/21 19:24:04 ID:0qu1mSub0 まじたった 7: 以下、名無しにかわりましてVIPがお送りします 2014/01/21 19:24:07 ID:iqcWhVXK0 すげぇ 51: 以下、名無しにかわりましてVIPがお送りします 2014/01/21 19:35:16 ID:3mMcECnQ0 スクショはよ 65: 以下、名
iOS上の万能テキストエディタ "Write" にMac版が登場
iPhone上で論文や本だって執筆する…。ちょっと前なら「そんな無茶な」と言われていたことが、アプリや周辺サービスの充実で当たり前にできるようになってきました。 その一つの鍵となったのがDropbox やiCloudとの連携です。ユーザーの側でまったく意識することなく文書が同期される仕組みがあるおかげで、iPhoneで編集した文章をパソコンで清書ということが楽にできるようになったわけです。 もうひとつの鍵は、しだいにサポートされるようになったリッチテキストの扱いです。いまではEvernoteでもリッチテキストを扱えますし、Markdown書法経由で楽にリッチテキストを書くアプリも増えました。 そのなかでも群を抜いた高機能とUIの美しさを誇るアプリが Write です。Markdownの扱い、DropboxやiCloudとの連携、他サービスへの共有方法の数の多さなど、総合力が高い一方でこれま
「右カラム無視」への対策
Webユーザーは、情報過負荷へ適応するため、重要でなさそう、あるいは広告のように見えるエリアから注意をそらすように自分たちを訓練してきた。しかし、サイドバーは適切にデザインすれば、コンテンツを発見しやすくし、ユーザビリティをうまく向上させることができる。 Fight Against “Right-Rail Blindness” by Hoa Loranger on October 12, 2013 日本語版2013年12月17日公開 残念なことだが、Webサイトクリエイターが右カラム（Webページの右レールとも呼ばれる）を広告の掲載によく使うので、ユーザーはこのエリアをチェックしないように自分たちを訓練してこざるをえなかった。これは右カラムはやめるべきということだろうか。いや、そんなことはない。 ページの右側で消費されるピクセルは利用可能な量のうちの20％程度だが、ピクセルとはコンピュータ
タブレットのユーザビリティ
タブレットのユーザビリティを脅かす最大の脅威は、フラットデザインと不適切に縮尺を変更されたデザインである。そしてその後には貧弱なジェスチャーとワークフローが続く。 Tablet Usability by Jakob Nielsen on August 5, 2013 日本語版2013年8月22日公開 これまでタブレットユーザーを対象にしたユーザビリティ調査を6回実施してきた。良い知らせは、タブレットのユーザビリティがまぁまぁ信頼できるものであり、初期の、奇抜なiPadアプリのまとまりの頃に比べると、大幅に改善されてきていることである。あれはユーザーをすっかり当惑させることが多かった。 テストしてきたのは数世代にわたる大小のiPadと、（Kindle Fireを含む）Androidタブレットの多数のモデル、（Microsoft Surfaceを含む）いくつかのWindowsタブレットである。
全日本＜label＞要素マークアップ検定
19. Matteo Penzo氏のEyeTracking検証結果では http://www.uxmatters.com/mt/archives/2006/07/label-placement-in-forms.php 1. Left-Aligned Labels(左寄せ) 2. Right-Aligned Labels(右寄せ) 3.Top-Aligned Labels(上寄せ) ✕ ⃝ ◎ → 項目が少ないならこっち → 項目が多い時に有効 → 一番ストレスが大きい → ストレスが最小、ログイン画面 → スクロールが必要な場合とか → 使っちゃダメ 20. 人間工学的観点では、視点の動きが重要 - Path To Completion - 視点の導線は一本に。 http://www.slideshare.net/lorielue/form-design-best-practices-t
UIが速すぎる場合
ユーザーは、変化が速すぎるものを見落とすことがある。また、気がついているときでも、画面上の変化する要素を、限られた時間内に理解するのはさらに難しい。 When the UI Is Too Fast by Jakob Nielsen on July 8, 2013 日本語版2013年7月22日公開 応答時間関連のユーザビリティ上の問題の99％がユーザーインタフェースが遅すぎることが原因であることを考えると、コンピュータが速すぎるという数少ない事例について書くというのは危険なことかもしれない。結局のところ、 コンピュータは遅すぎることが多い。そして、 応答時間が速いとユーザビリティは向上する。急速に人間の記憶は劣化するので、遅いコンピュータを待っている間、人は自分がしていたことの一部を忘れてしまう可能性があるからである。 その上、若いユーザーが忍耐力に欠けることはよく知られているが、年配のユー
アプリ内ブラウザの「戻る」機能 | Accessible & Usable
公開日 : 2013年7月18日 (2013年7月19日 更新) カテゴリー : ユーザビリティ スマートフォンのネイティブアプリケーション (いわゆる「アプリ」) の中には、ブラウザ機能が備わっているものがあります。たとえば Twitter アプリ、Facebook アプリ、RSS リーダーのアプリ、メールクライアントのアプリ、などでは、コンテンツに Web ページへのリンクが表示されていると、それをタップすることで、アプリ内で Web ページを表示することができます。 アプリ内のブラウザ機能でいくつかの Web ページを遷移しているとき、画面左上にあるアイコン (「戻る」ボタンっぽいもの) をタップしたら、直前に見ていた Web ページではなく、Web ページを開く前のコンテンツに一気に引き戻された...という経験は、ありませんか？ よくよく見たら、ブラウザの「戻る」ボタン (直前に見
新規のタスクと日常的なタスクのユーザビリティ
ウェブサイト上の反復型の行動はうまくいくことが多い。だが、ユーザーが何か新しいことを行おうとすると、往々にして失敗するのだ。 Usability for Novel vs. Routine Tasks by Jakob Nielsen on May 12, 2013 日本語版2013年5月27日公開 あなたはもしかして、自分の持つユーザーエクスペリエンスと、最近私が報告した以下のようなユーザビリティに関する調査結果にずれを感じているのではないだろうか： イントラネットでの従業員の平均成功率は74％だった。つまり、測定したタスクのうちの4分の1が失敗に終わっている。 ティーンエイジャーはテクノロジーの達人とされているが、その平均成功率は71％だった。したがって、彼らは企業関係のユーザー以上によく失敗していることになる。 eコマースのユーザーが最初の検索キーワードで欲しいものを見つけられた確率
» スマートフォンサイトのユーザビリティを下げるアンチパターン | Webnoborder
モバイルデザインパターン― ユーザーインタフェースのためのパターン集を読んで、スマートフォンサイトのアンチパターンも作りたいと思ったのがキッカケで作ってみました。 独断と偏見で評価しています。 反応エリアを探させるアコーディオン 「お金からモバイルデザインパターン― ユーザーインタフェースのためのパターン集を読んで、スマートフォンサイトのアンチパターンも作りたいと思ったのがキッカケで作ってみました。 独断と偏見で評価しています。 反応エリアを探させるアコーディオン 「お金から探す」周辺のリストがアコーディオンになっていますが、テキストの部分をタップしても何も動作しません。 プラスアイコンの部分をタップしないと反応しないのです。 このようにタップ領域がユーザの意識と違う場所に設定されているのは、ユーザビリティに問題があるといえるので改善が必要でしょう。 参考サイト スマートフォンサイトにお
インタフェースデザインの実践教室
インタフェースデザインの実践的な解説書。使いやすいUIで優れたUXを提供するために必須な「リサーチ」「デザイン」「インプリメンテーション」という3つのフェーズを、初心者にもわかるようていねいに解説します。テクニックの章では、ストーリーボードやペーパープロトタイピング、ユーザビリティテストなど、優れたユーザビリティを実現するためのアプローチについて学びます。アイデアの章では、テキストの書き方、どのくらいリアルなデザインであるべきか、アニメーションを使うタイミングなどについて学びます。調査・設計・実装・検証・改善というワークフローに沿ってデザインすれば、ユーザビリティは驚くほど向上します。 翻訳者によるサポートページ。 サンプルPDF ● 「前付、1章と8章（I部）、23章（II部）、33章（III部）」（38MB） 賞賛の声 はじめに I部 リサーチ 1章 ユーザーリサーチ 2章 ジョブシャ
直感的なUIとは予想した通りの結果が得られるもののこと - ネコメシCEOブログ
UIデザインの参考に！斬新で美しいUIをもったiPhoneアプリまとめ という記事では、紹介しているアプリのことごとくに、「ボタンが無くてシンプル」「直感的で使いやすい」などと書いてあるが、ClearのUIみたいなのを「誰でも直感的に操作できる」などと評価する理由がさっぱり理解できない。 こういうUIは基本的にどれも玄人向けで、操作がジェスチャの塊になってしまっているものは、それが使いこなせる俺カッケー感が高くて自己顕示欲を満たしやすい。"そのように操作できるUIデザイン"が気持ちいいのではなく、"そのように操作している自分"が気持ちいいの間違いなんじゃないだろうか。 ボタンが一切なくてシンプルだと気持ちがいいUIになるだって？ そんなわけがあるはずない。現実世界はボタンが一切なくてシンプルなUIで溢れているし、そのおかげで毎日いろんな場面でいらいらさせられている。たかが1個のレバーを上げ
なぜAmazonのメガドロップダウンメニューはスムーズに操作できるのかという秘密
日本のAmazonでも採用されているメガドロップダウンメニューについて、なぜAmazonのメニューはユーザーが使いやすくできているのかという秘密が明らかになりました。ユーザビリティを改善することが至上命題のネットショッピング系サイトにとっては非常に有益な知識となっています。 Breaking down Amazon’s mega dropdown - Ben Kamens http://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown まずこれがAmazonの左上にあるカテゴリーを一覧化したメガドロップダウンメニュー。日本のAmazonにも同様のメニューが採用されており、マウスカーソルを上に持っていくと実にスムーズに動きます。 通常のメニューの場合、以下のようにして少し遅れてサブメニューが開くようになっています。 な
「お客様の声」を読んでもらうコツ (ユーザビリティ実践メモ)
5月28日の記事では「お客様の声」を掲載する場合は、インターネットの媒体特性を理解して掲載内容を吟味する必要がある、という考え方をご紹介しました。 詳細はこちら 「お客様の声」掲載時の注意点 今回は続編として、「お客様の声」をユーザに読んでもらうための具体的な方法を取り上げたいと思います。 ユーザは、自分と近い立場の「声」を探して読む傾向があります。お客様の属性情報を見てユーザが「自分に近いかどうか」を判断できるようにしましょう。 記載する属性は、BtoBサイトなら業種、部署、担当業務、会社規模が重要です。BtoCサイトでは、年齢、性別を基本とし、それぞれの業界特性に応じた要素を付け加えましょう。金融なら年収・貯蓄額、人材なら職種・スキル・・・などが挙げられます。 ■Tips2：「声」の筋立ては、商品・サービスの利用効果が分かるようにする 時系列に、 商品・サービスを使用する前(何らかの課
UXの前にまずユーザビリティ - 猫飯は七里帰っても食え
2013-03-01 UXの前にまずユーザビリティ 1998年に「誰のためのデザイン」で有名なドナルド・ノーマンが、 「ユーザビリティではもはや説明できない！UXだ！」 みたいなこと（適当）を言ってから、早15年、日本でもいろんなところでUXUXと言われるようになりました。 1999年にはISO13407で「人間中心設計」が定義され、2010年にはそれがISO9241シリーズに統合され、UXについても定義されました。 2013年の今、出せば売れる時代は終わった。これからのものづくりにおいてはUXを考えることが重要だ、と世界中で言われています。 しかし、そもそもUXの原点となったはずである、ユーザビリティについてしっかりと理解している人はどれくらい居るのでしょうか？ ドナルド・ノーマンが、 「ユーザビリティではもはや説明できない！UXだ！」 みたいなこと（適当）を言ってから、もう15年です。
自動送りカルーセルとアコーディオンは、ユーザーをいらつかせ、可視性を下げる
ユーザーの目的の内容は、ページの先頭に98ポイントの文字で書かれていた。しかし、彼女はそれを見つけられなかった。そのパネルが静止しておらず、自動送りされていたからである。 Auto-Forwarding Carousels and Accordions Annoy Users and Reduce Visibility by Jakob Nielsen on January 19, 2013 日本語版2013年2月4日公開 先日、イギリスでユーザビリティ調査を実施したのだが、そこで、あるユーザーが「Siemensは洗濯機のキャンペーンをしているか」というタスクを行おうとしていた。 そのユーザーはさして苦労もせず、イギリスのSiemens Appliancesのこのホームページにはたどり着いた： Siemens Appliancesのホームページ どうだろう、そのユーザーは先ほどの課題に答え
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
