「Safariの日付を選ぶ仕組み」がカスタマーサポートに寄せられる苦情の3分の1を生み出していたという報告
Appleが開発するウェブブラウザのSafariは、iPhoneやiPad、Macなどで使用されている標準的なブラウザです。ところが、効果的な高血圧薬を推奨する遺伝子検査のスタートアップ・Geneticureの創設者であるロバート・トーマス氏が、「Safariの日付を選ぶ仕組み」によって高齢のユーザーが戸惑ってしまい、Geneticureのカスタマーサポートに寄せられる苦情の3分の1を生み出していたと報告しています。 Safari's date-picker is the cause of 1/3 of our customer support issues · GitHub https://gist.github.com/RobertAKARobin/850a408e04d5414e67d308a2b5847378 Geneticureは遺伝子検査テクノロジーを用いることで、「そのユーザ
第8回 「気持ちいいUI」の追求に熱心になりすぎて、空回りしてませんか？ | gihyo.jp
前回は、気持ちいいUIを構築する方法を開発者の視点から捉え、「開発者が“面倒くさくて”やらなかったことが、利用者の“面倒くささ”の蓄積につながるのではないか」、そしてユーザーの面倒くささを解消してあげる方法の1つとして「ユーザーが何もしなくて良い状態を作る」ことがよいのではないか、という意見を提示しました。今回はその考察をさらに発展させ、技術者がついついやってしまいがちな「やりすぎ」について考えてみたいと思います。 チュニジアで痛感したGoogleマップの出来の良さ 筆者は8月末にチュニジアに行って来ました。チュニジアはアフリカ大陸の地中海沿岸に位置しており、アフリカの中では比較的発展を遂げている国です。フランス人などのリゾート地としても有名です。今回は家族を連れて、チュニジア人の元同僚を訪ねての旅だったのですが、筆者は基本リモートで仕事をしているため、仕事を完全にストップさ
成果が出るサイトにするために改善すべき10のポイントを紹介 | LISKUL
「サイトを作成したが、思っていたよりも成果が出ていない」「どこからサイトを改善すればいいかわからない」とお悩みの担当者の方が多いのではないしょうか。 成果の出るサイトにしたい場合、まずは段階を踏んで改善をしていく必要があります。 今回はサイト改善で成果を出すためのポイント10選と、活用するべきツールを紹介します。 サイトを改善するためのポイント10選今回は貴社のサイトの成果を改善するためのポイントとして、視覚的なポイントと思考的なポイントに分けて、10のチェックポイントをご共有します。 以下の資料では、2万件以上のデータベースから最短30秒でサイト改善案を手に入れられるツールについてまとめています。無料ですので、ぜひダウンロードしてご覧ください。 サイトのコンバージョン率を改善するためのノウハウを、自動提案してくれるツール「dejam」 1. Webサイトの構成は、一般的なパターンか結論か
ECサイトにおける考えるべきユーザビリティ9ヶ条 ｜https://wp.yat-net.com/name
ECサイト、ネットショップにおいて考えておくべきユーザビリティを9つピックアップしました。もちろんこれが全てではありませんし、サイト設計の上ではもっともっと細かく考えることはたくさんあります。今回はコンバージョンを下げない、直帰率を下げないために施策する場合に何をするか？を簡潔にまとめています。他のネットショップを運営されている方がどういう事をされているかも凄く気になりますね。 1.ロゴはHOMEへ ロゴをクリックすればトップページへ行くという認識を持たないユーザーは沢山います。トップページへ行くためのボタンは別途用意し、そういったユーザーへのフォローも施策しておく事が大切です。 リンク時における色を変更し統一することでユーザビリティは確保ます。しかし、ブラウザのデフォルトである青色に下線と言ったルールを採用することで、より多くのユーザーに対してそれがリンクであると言うことを認知してもらい
なぜAmazonのメガドロップダウンメニューはスムーズに操作できるのかという秘密
日本のAmazonでも採用されているメガドロップダウンメニューについて、なぜAmazonのメニューはユーザーが使いやすくできているのかという秘密が明らかになりました。ユーザビリティを改善することが至上命題のネットショッピング系サイトにとっては非常に有益な知識となっています。 Breaking down Amazon’s mega dropdown - Ben Kamens http://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown まずこれがAmazonの左上にあるカテゴリーを一覧化したメガドロップダウンメニュー。日本のAmazonにも同様のメニューが採用されており、マウスカーソルを上に持っていくと実にスムーズに動きます。 通常のメニューの場合、以下のようにして少し遅れてサブメニューが開くようになっています。 な
「左上の魔術師」理論
Web業界のデザイン手法として、密かに流行し始めている「左上の魔術師」理論。 サイトとしての「見栄え」よりも、ユーザーの「目の動き」に着目したWebデザイン手法として注目を浴びています。 今回は、まず始めにWebサイトのデザイン別にユーザーの「目の動き」を解説します。 そして、実際にミリオン単位でユーザーを獲得しているサイトを考察することで、「左上の魔術師」理論を解説したいと思います。 1.カラム別Webサイトデザイン 2.昔はたくさんあったWebサイトデザイン 3.ページ単体を見に来たときのユーザーの目の動き 4.サイト全体を見たくなったユーザーの目の動き 5.ミリオン単位でユーザーを獲得しているサイトのデザイン 6.左上の魔術師とは 1.カラム別Webサイトデザイン 現在のWebサイトの多くは、「1カラム型」、「2カラム型」、「3カラム型」のどれかで構成されています。 このうち「2カラ
第39回 名前の効用 | WIRED VISION
第39回 名前の効用 2010年1月13日 （これまでの増井俊之の「界面潮流」はこちら） 人間社会では、様々なものを識別するのに「名前」が利用されています。名前の無い人はいませんし、およそ人間が利用したり表現したりするものには名前がついており、様々なものを指定したり区別したりするのに利用されています。 ふだんの生活で名前はあまりにも当然のものとして利用されているため、計算機の利用やコミュニケーションにおいてもなんらかの名前を使うのが当然だと考えられていました。 通信相手を指定するには電話番号やメールアドレスのような名前が使われますし、データやWebページを指定するにはファイル名やURLのような名前が使われます。計算機の名前/プリンタの名前/アプリケーションの名前/...など、計算機で利用されるあらゆる対象は名前で区別されます。しかし、これらを扱うのに本当に名前が必要なのか、実は疑問です。
写真・画像の具体的な情報は、ユーザに与える影響が大きい (ユーザビリティ実践メモ)
最近は特にECサイトなど、画像を豊富に掲載して、見ていて楽しい魅力的なサイトが増えてきています。 しかしサイトの魅力を増す画像も、使い方を誤るとユーザをミスリードしてしまうことがあります。 今回は画像活用時の注意点をご紹介します。 ユーザはウェブサイトを閲覧する際、目につくものを拾い読みする傾向が強く、特に注目されやすいのが「写真」と「見出しのキーワード」です。 そのため、アイキャッチ画像とキーワードをあわせて配置するレイアウトは、一般的に非常に効果的です。 しかし、画像の与えるイメージは非常に具体的であるため、ユーザは画像の印象に強く引きづられてしまいます。 実際に弊社の調査で、照明やインテリアを探していたユーザが下図右のレイアウトを見て、読み飛ばしてしまうケースがありました。 上のケースの場合、単純に画像を削除してリンクを目立たせることでも、十分にユーザの誤解を避けることが可能でした。
入力フォームでの「郵便番号」の意外な盲点 (ユーザビリティ実践メモ)
登録や申し込みページの入力フォームにおいて、郵便番号を入力すると住所欄が自動入力される機能は、ユーザの入力負荷を軽減する便利な機能です。実はこの機能、正しく郵便番号を入力してもある条件下ではエラーとなってしまうことがあることをご存知でしょうか。今回は入力フォームでの「郵便番号」の意外な盲点についてご紹介します。 ただ、「会社」で用いられている郵便番号は一般的な郵便番号と異なる場合があります。 郵便番号は、特定の企業（１日の配達量が一定量を超えるような事業所）に対して「大口事業所個別番号」という事業者向けの郵便番号を割り当てており、該当する企業はこの割り当てられた郵便番号を使用しています。 しかし、郵便番号から「住所を自動入力する機能」が参照している郵便番号は必ずしもこの「大口事業所個別番号」に対応しているわけではありません。入力された郵便番号が対応していない「大口事業所個別番号」であった場
テキスト選択後のアクションをポップアップしてくれユーザビリティ向上に使える「Search And Share」:phpspot開発日誌
テキスト選択後のアクションをポップアップしてくれユーザビリティ向上に使える「Search And Share」 2009年12月25日- テキスト選択後のアクションをポップアップしてくれユーザビリティ向上に使える「Search And Share」。 ページ内のテキストを選択するとポップアップメニューが出てクリックで任意のページを開くなどのアクションが設定できます。 動作を説明すると、まず、ページ内のテキストを選択します。 すると、ポップアップが現れて、コピーの他、各種検索サイトに誘導させることができます。 拡大すると以下のような感じです。 ブラウザのコンテキストメニュー拡張みたいですが、これならどんなブラウザでも同じものを見せられます。サイトの内容によっては大きくユーザビリティを上げられそうです。 で、クリックすると、ここからが面白くて、ページの上部からIFRAMEが現れてアニメーション
select ボックスを超便利にしてくれユーザビリティ向上に使える「jQselectable」:phpspot開発日誌
select ボックスを超便利にしてくれユーザビリティ向上に使える「jQselectable」がGoogle Codeに公開されています。 jQというだけあって当然ながらjQueryプラグインの形式です。 適用前の普通のSelect ボックスが便利に変化します 都道府県の縦に長かったものが横方向に超分かりやすく表示 日付も次のように超分かりやすいセレクトに。縦に長いのとはもうオサラバできそうです。 更に、コールバック関数によってクリックした後の動作も定義できるっぽいです。 はじめから日本対象という点でも使いやすいですね。 実装も、jQueryプラグインなので超使いやすいです。 次のように初期化するだけのようです。 $(".simpleBox").jQselectable({ set: "fadeIn", setDuration: "fast", opacity: .9 }); 以下のエント
[JS]集中して、フォームのテキストを入力できるスクリプト -fullTextArea
テキストエリアにテキストを入力する際、集中してできるようにするスクリプトをwheresrhysから紹介します。
EFO(エントリーフォームの最適化)のまとめ | ユージック
EFO(エントリーフォームの最適化)のまとめ 2009年8月7日 フォームのユーザービリティーの改善がコンバージョンレートの向上に一役買っているようです。 WEBサイトの最終的な受け皿であるお問い合わせフォームやショッピングカートといったフォームは他のコンテンツに比べて制作の際にないがしろにされがちですが、アクセス解析を見るとサイト内でもかなり上位の閲覧数のあるページとなります。 コンテンツできっちり情報を伝えて、アクションをおこしてもらってもフォームの操作性ひとつで機会損失につながることだってあります。 そこで最近ではEFO(エントリーフォームの最適化)としてフォームの改善対策が注目をあびています。 致命的な改善すべき項目 1.入力の訂正をする際に以前に入力した内容が消えないようにする せっかく入力したのに書き直しやエラー訂正の時に入力した内容が消えているとモチベーションがいっきに落ちる
違う、我々が欲しいのは電源をONにした瞬間起動するマシンだ。
”とある外国人向けのページ”が面白かった。「超訳」ですが…。 面白いなぁと思ったのは、エントリの内容もさることながら、むしろ罵倒表現のバラエティについてです。念の為。 最新のインテル「Core 2 Duo」プロセッサ、メモリ2GB、最新のマイクロソフトOS「Windows Vista」を搭載したPCを購入した。10万円以上かけて購入したこの新しいPCは、快適なウェブブラウジング環境を手に入れようと、大金をはたいて購入したものだ。だが、買ってきてセットアップしてみて、私の心はズタボロに切り裂かれることになった。 何よりも驚かなくてはいけなかったのは、その起動時間の遅さだ。Intel社が会社を挙げ、大金を注ぎ込んでできあがったデュアルコアCPUを搭載しているのに、Windowsの起動までに1分以上かかる。一体これはどういうジョークなのだろうか？一流のアメリカンジョークだというのだろうか。 なぜ
既存のデザインのクオリティをアップする8つのポイント
デザインが単調な感じのときには、使用している色を鮮やかにしてみます。 変更した色をベースに、カラースキームを設計します。 Color Scheme Designer 3 2. モノクロは慎重に ブラックやホワイトなどモノクロをテーマにした素晴らしいデザインのウェブサイトは多数あります。モノクロは単色で構成されたものですが、一色加えることでデザインが容易になることがあります。 ポイントはその一色のみにこだわらずに、他の色も充分に検討することです。 3. グリッド レイアウトの活用
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
IDEA * IDEA
selectボックスをシンプルなプルダウンに拡張するjQuery.selectable.js :: 5509
はてなブログ | 無料ブログを作成しよう
ソシオメディア | UIデザインパターン
