タグ

webとusabilityに関するkuwaのブックマーク (18)

  • 自動送りカルーセルとアコーディオンは、ユーザーをいらつかせ、可視性を下げる

    ユーザーの目的の内容は、ページの先頭に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のホームページ どうだろう、そのユーザーは先ほどの課題に答え

    自動送りカルーセルとアコーディオンは、ユーザーをいらつかせ、可視性を下げる
  • 入力フォームのプレースホルダーを使ってはいけない

    入力フォームのプレースホルダーテキストは、入力欄にどんな情報を入れたのかをユーザーが思い出すことや、エラーのチェック・修正を難しくしてしまう。また、視覚や認知機能に障害のあるユーザーにはさらなる負担となる。 Placeholders in Form Fields Are Harmful by Katie Sherwin on May 11, 2014 日語版2014年6月17日公開 コンテクストに沿った説明やヒントは、入力フォームのそれぞれに何が入るかを明確にするのに役立つ。その結果、入力が促進され、コンバージョンレートは向上する。ヒントの提供方法はいろいろとある。実装として一般的なのは、入力フォーム内に説明を入れるやり方だ。しかし、残念ながら、入力フォーム内のプレースホルダーはユーザビリティに役立つよりも損なうことのほうが多いことがユーザビリティテストでは繰り返し示されている。 ラベル

    入力フォームのプレースホルダーを使ってはいけない
  • GoodUI

    Learn From What Leading Companies A/B Test Receive the latest discovered UI patterns and leaked experiments from companies such as Amazon, Netflix, Airbnb, Etsy, Google, and Booking.com, etc. We're obsessed with learning about what works and what fails.

    GoodUI
  • in the looop | Looops communications

    ループス・コミュニケーションズは、 企業のSNS活用戦略の立案・運用改善、啓発教育などのコンサルティングサービスや、リーダーシップやイノベーションをテーマとした企業研修を提供しています。

  • amazonのリニューアル後のカテゴリメニューが素晴らしい | トラねこblog

    どうも、kuwaです。 amazonさんがリニューアルされました。パッと見でもかなりスッキリとした印象ですね。 今回はその見た目ではなくメニューの細かい制御についての話です。左の画像にある、カテゴリ選択メニューの細やかな制御が素晴らしくて感動しました。 一番上の「漫画・雑誌」から下方向にマウスカーソルを垂直に移動させると選択カテゴリが速やかに切り替わります。これは当たり前ですね。 問題は、ここからサブジャンルを選択する際です。例えば、「DVD・ミュージック・ゲーム」を選んだ後、右側に表示されるサブカテゴリから、「TVゲーム」を選ぼうとサブカテゴリを選ぶケースです。この場合「DVD・ミュージック・ゲーム」の上にあるマウスカーソルを「TVゲーム」まで持っていくために、右下に向かって斜めに移動さると思います。この時、マウスカーソルは「DVD・ミュージック・ゲーム」の下にある「家電・カメラ・A

    kuwa
    kuwa 2012/09/26
    書いた。
  • 絞込み項目(タグ)の折り畳みを実装しました。 | トラねこblog

  • 有名サイトのデザインをコピーすべきか

    成功しているWebサイトというのはユーザビリティに優れている場合が多い。しかし、平均的なサイトが背景の異なるサイトのデザイン要素をコピーしてしまうと、ビジネス上の損失になることもあり得る。 Should You Copy a Famous Site's Design? by Jakob Nielsen 2010年8月23日 デザインに行き詰まると、上司というのはよくこういうことを言う。「Xをコピーしようか」。ここでのXとは知名度のある成功したウェブサイトのことである。この戦略にも一理ある。つまり、Xというサイトはあれほど規模も大きいし、有名なのだから、おそらくうまくやっているに違いないというわけだ。 そのうえ、ユーザーというのは慣習に沿い、期待通りに機能する、確立したデザインを好むものである。例えば、検索ボックスを右上隅に置くと、検索のユーザビリティは向上する。これは単に、その場所で利用す

    有名サイトのデザインをコピーすべきか
  • nanapiの初期バージョンに検索窓がなかった理由 : けんすう日記

    はじめに 【仕事における80:20の法則】個人・企業のパフォーマンスを最大限に高める方法 | [b] bizMode|世界のデジタルトレンドを読む というブログの中で nanapiというレシピサイトがありますが、c/o時は全然機能がなく、レシピを探せませんでした。果たして、カットオーバー時点において、レシピ検索機能は備え付けておく必要があったのでしょうか?また、個人ページにも全く機能性はありませんでしたが、今はどうでしょう?十分パワーアップしています。 そこに、多くの問題が発生したでしょうか?していません。 少しの問題は発生していましたが、プロダクト価値を脅かすものではありません。 徹底的に80%にこだわり、重要なポイントは、十分に抑えられていたと思います。 こんな記事で紹介してもらったので、ちょっと書いてみます。記事内では、最初は検索結果に対しての工数をさかずにあとで回した、というニュア

  • 実用的なユーザビリティの10のポイント:ガイドライン編 | コリス

    ユーザーにあなたのウェブページを容易で、そして楽しくアクセスできるようにする実用的なユーザビリティの10のポイント(ガイドライン編)をSmashing Magazineから紹介します。 Tumblr 多くのフォームは2カラムのレイアウトを採用し、ラベルはフィールドの左に配置されています。一見よさそうに思えますが、これは採用すべきではありません。 なぜなら、フォームは一般に垂直に方向付けがされているためです。ユーザーが左→右→左下と視線を動かすことより、上→下と移動する方が容易です。 また、ラベルを左に配置することはもう一つの問題があります。 あなたはラベルを右揃えと左揃えのどちらで配置しますか? 左揃えはラベルを読みやすくしますが、どのフィールドのラベルか判断するのが難しい場合があります。 右揃えはその逆です。フィールドのラベルを判断するのは容易ですが、ラベルを俯瞰するのが困難です。 2.

    kuwa
    kuwa 2009/09/30
    新鮮な内容が多かった。
  • 優れたユーザインタフェースを設計する際に考慮する8つのポイント

    ユーザーにとって有益なユーザインタフェースを設計する際に考慮する8つのポイントをUsability Postから紹介します。 8 Characteristics Of Successful User Interfaces 以下、その意訳です。 ユーザインターフェイスの設計時に、考慮する8つのポイントを紹介します。 Clear Concise Familiar Responsive Consistent Attractive Efficient Forgiving To conclude… 1. Clear 明快 明快であるというのは、最も重量な要素です。 ユーザインターフェイスデザインの目的は、ユーザーに意味と機能を伝え、利用するアプリケーションと相互につきあえるようにすることです。そのアプリケーションがどのように機能するのか、どこに進むべきか理解することができない時は、ユーザーは困惑しが

  • ユーザの訪問頻度を考慮したトップページ設計 (ユーザビリティ実践メモ)

    今回は「ユーザの訪問頻度」を考慮した工夫について、ニュースサイト(※1) のトップページを題材に取り上げます。 ※1 記事コンテンツを中心としたメディアサイトを「ニュースサイト」と定義しています。 例えば、あるニュースサイトでは、1日に記事を2、3配信しており、トップページではその日の最新記事3を大きく見せるレイアウトを採用していました。 今日の最新記事が面積を大きく取っているため、情報が更新されたことが伝わりやすくなっています。1日1回以上の頻度でサイトを訪れるユーザにとっては、新しい情報だけをすぐに手に入れることができる好ましい設計であると言えます。� しかしアクセス解析の結果、このサイトには週に1回程度の頻度で訪れるユーザが圧倒的に多く、毎日訪れるユーザはごく少数であることが分かりました。つまり、多くのユーザにとっては15-20程度の『まだ見ていない記事』があるにも関わらず、ト

  • グーグル先生を超える良回答連発、Powersetを使ってみた − @IT

    2008/05/15 インターネットの検索でエポックメーキングな出来事は2度しか起こっていない。1994年にジェリー・ヤン氏らが立ち上げたヤフーがインターネットに検索をもたらしたときと、1998年にラリー・ペイジ氏らがグーグルを立ち上げ、Webページの重要度を示す「PageRank」という概念を導入したときだ。検索連動広告の発明もビジネス的には大きなステップだったが、使い勝手の向上というユーザー視点での転回点は2つだけだ。いま、ベンチャー企業の米Powersetが注目を集め、3つ目のイノベーションを起こすかどうかが注目されている。 ネット検索の歴史:数から順位への転換 Powersetが解決しようとしている問題を明確にするために、インターネットの検索エンジンの歴史を少しだけ振り返ってみよう。 グーグルが登場する以前、各検索サイトは、自分たちがいかに多くのWebページをクロールし、検索に対し

  • CKWorks 開発メモ: 「感想ノート」にブログ記事URLの入力欄が付きました。

    2008年2月 3日 「感想ノート」にブログ記事URLの入力欄が付きました。 ■2008/01/23 [開発メモ:ノートにブログ記事URLを指定できるといいな] 『 基はブログ記事のほうに感想を書いて、 コミックダッシュ!の感想ノートのほうは そのPermalinkを指定すると取り込んでくれる 』 とかだったら上手くいくかもしれない、と今日思いつきました。 というお話を先日いたしましたが、その機能をそっと仮実装してみました。 感想ノートの入力欄に、 ブログ記事のURLを入力できる欄 を追加してあります。 もしすでにご自分のブログですでに感想を書かれている場合には、 その記事のURLをココに入力してみてください。うまくいけば 感想ノートの保存と同時に、自動的に概要文が取り込まれます。 取り込みは、ノート文が空の場合だけ動作します。ノート文が 空でない場合には、直接入力したノート文のほ

  • 確認メールであきらめる人を減らす具体的な方法 - 二宮日記

    今日ホットエントリにあがっていた記事から。 1つの大きな理由は、「もともと申込書を最後まで書くつもりはなかった」でした。 申し込みフォームを使いやすくして途中であきらめる人を減らす具体的な方法論【前編】 | Web担当者Forum ずいぶん前の話だけど、去年はてなでユーザー登録関連のリニューアルを行った時に、ユーザビリティテストを何度もやったり、Google Analytics でユーザー登録完了までのドロップ率の測定をやったりして、ユーザー登録をしようとした人が最後まであきらめずに到達できるよう色んな変更を加えていきました。 はてなのユーザー登録はだいたい以下のようなフローになっています。 入力フォーム 入力内容確認画面 入力されたメールアドレスに登録完了のためのURLを載せたメール送信 登録完了 途中で登録をやめてしまう人は1から2の間が一番多くて、次が3から4の間でした。 入力フォー

    確認メールであきらめる人を減らす具体的な方法 - 二宮日記
  • 多くのユーザーは一度に1本しかジュースを買わない ― @IT

    ユーザビリティのヒント(1) 多くのユーザーは 一度に1しかジュースを買わない 「自動販売機での不要な動作から考える」 ソシオメディア 上野 学 2006/6/2 Webアプリケーションのユーザーインターフェイスデザインに役立つさまざまなTips集。自動販売機でジュースを買うときの不要な動作から考える。(編集部) 今回からはWebアプリケーションのユーザーインターフェイスの続編の「Tips編」として、ウェブアプリケーションのユーザーインターフェイスをデザインするうえで役立つさまざまなヒントを、少し細かな視点から具体的に見ていきます。 複雑な構成物を作り上げるには、基となるコンセプトやアーキテクチャといった抽象度の高い部分から考えていくトップダウン式のアプローチと、構成要素の細部から考えていくボトムアップ式のアプローチの両方が必要になりますが、前回までの経験則編はどちらかといえばトップダ

  • 分裂勘違い君劇場 - 見た瞬間に使い方の分かるユーザインタフェース

    「初心者にわかりやすいGUI」については、この記事のid:naoya氏の気持ちは、分かる気がします。 まず、プロのGUIデザイナーと実プロダクトの仕様について議論すると、ほとんど必ずと言っていいほど議題に上がるのが、「とっつきやすや」と「機能性」のトレードオフ。 よく、回すべきなのかスライドべきさせるのか、押すんだか引くんだかよく分からないドアというのがある。ドアのどちら側を押すべきなのかも分かりにくいことも多い。それは、ユーザインタフェースが、self explanatory(自己説明的)じゃないからだ。これは、よくユーザインタフェースの設計ミスの事例としてやり玉にあげられるんだけど、ぼくは、それはそんなに単純な話じゃないと思うのだ。 たとえば、丸い取っ手のあるドアは、見た瞬間、「ああ、これはドアノブを回して引くんだな」ということが、直感的に分かる。つまり、そのドアノブは、「機能」を提供

    分裂勘違い君劇場 - 見た瞬間に使い方の分かるユーザインタフェース
  • "なめらかアルバム" 大量の画像を閲覧するためのインターフェイス - sshi.Continual

    http://sappari.org/flash/kamakura/ 普段このダイアリを見て「わけわからんことしか書いてない」と思ってる人も、このリンクを辿って画像集(アルバム)を眺めてみよう。気持ちよくアルバムが閲覧できます。そんなことない? 詳しい説明は、http://sappari.org/na.html に。このアルバムを作るソフトは http://sappari.org/namaker.html で公開されている。 このアルバムを眺めていると、をぱらぱらめくる感覚になれる。ざーっと見たいときは、ぱらぱらぱらららっとおおざっぱにページをめくっておおざっぱにページを流し読んで、気になった箇所があれば、ぱらっとそこで止めたりめくるスピードを遅くしたりして詳しく読む、っていうアレ。このアルバムでは高速にスクロールすると、見ている対象がどんどん縮小されていって普段より多くの情報を一度に見

    "なめらかアルバム" 大量の画像を閲覧するためのインターフェイス - sshi.Continual
  • イントラネットポータルの簡素化

    イントラネットのポータルを調べた結果、スリム化された情報アーキテクチャと、コンテンツを新鮮に保つことへの新たな努力が見られた。担当業務内容に合わせたパーソナライゼーションなど、過去の発見も再度確認された。 Intranet Portals Get Streamlined by Jakob Nielsen on October 24, 2005 前回イントラネットポータルのユーザビリティ調査を行ってから、約 3 年の月日が経った。イントラネットの平均的な再デザインは 3 年なので、イントラネットポータルのデザインを見直してみる、良い時期だろう。 現在、運用されているデザインがどのようなものなのか調べるため、新たなポータルのプロジェクトを調べ、前回の結果と比較してみた。 結果: 変化なし 全体の流れとしてみると、3 年という時間は、あまり長い時間とはいえない。そのため、最初に行った時の結果が未

    イントラネットポータルの簡素化
  • 1