タグ

ブックマーク / u-site.jp (90)

  • 日付入力フォームのUXデザインガイドライン

    日付入力欄は、適切なデザインパターンを利用して、あいまいさのない、タスク達成に役立つものにしなければならない。小さなデザイン変更で、大きなユーザーエラーが防げる可能性もあるのだ。 Date-Input Form Fields: UX Design Guidelines by Angie Li on January 22, 2017 日語版2017年4月24日公開 日付入力欄の書式設定など、ささいなことだと思うかもしれない。しかし、書式の実装が不適切だと、ちょっとしたインタラクションによって、入力のプロセスが立ち往生してしまうこともある。日付入力に関するデザインが良くないと、ユーザーが悩んだり、イライラすることになり、その入力フォームを全面的に断念してしまうというリスクがあるからだ。それどころか、ユーザーが間違った日付を指定してしまって、取引自体が悲惨なことになってしまう可能性もある。たと

    日付入力フォームのUXデザインガイドライン
  • リモートでのUXの作業:ガイドラインとリソース

    一般に、UXセッションは対面で行うのが理想だ。とはいえ、予算や移動の制約により、UXに関する作業をリモートで行わざるを得ないこともある。この記事では、リモートでのユーザー参加型調査、UXワークショップやプレゼンテーション、およびコラボレーションに関するガイドラインを提示する。 Remote UX Work: Guidelines and Resources by Kate Kaplan on March 29, 2020 日語版2020年4月14日公開 ユーザー参加型調査の実施やUX作業のプレゼンテーション、他のチームメンバーや利害関係者とのコラボレーションは、対面でやり取りしたほうがいろいろなメリットがあることがわかっている。調査の参加者にとっては、対面のほうがリモートよりも良い関係を築いて、信頼関係を構築しやすい。また、プレゼンテーションやコラボレーションの出席者も、対面のほうがより

    リモートでのUXの作業:ガイドラインとリソース
    ks0222
    ks0222 2020/04/14
    リモートUXリサーチに関する良い記事が出てた。
  • ユーザー調査に適した参加者を選び出すためのスクリーニング質問の利用方法

    適切なUX調査参加者をリクルートするには、調査の目的を明かさずにユーザーの特徴を評価しよう。 How to use Screening Questions to Select the Right Participants for User Research by Kathryn Whitenton on July 14, 2019 日語版2020年3月2日公開 ユーザー調査に適した参加者を見つけるのは、ターゲットオーディエンスを明確に定義している場合でも容易ではない。ほぼすべてのユーザーから「何か」は学ぶことができるものだ。しかし、調査参加者の行動や興味、知識が実際のユーザーと同じであれば、調査から得られる知見はより有意義なものになる。 参加者を選び出すためのスクリーニング質問の利用 調査参加者をリクルートするには、彼らの背景と特徴を評価するスクリーニング質問をする必要がある。たとえば、

    ユーザー調査に適した参加者を選び出すためのスクリーニング質問の利用方法
    ks0222
    ks0222 2020/03/02
  • チェックボックス 対 ラジオボタン

    有名ウェブサイトでも、基的なユーザインタフェース(UI)で初歩的な間違いを犯すことがある。主要なガイドラインは明確だが、それ以外にも考慮しなくてはいけないことが 10 項目ある。 Checkboxes vs. Radio Buttons by Jakob Nielsen on September 27, 2004 最近、有名ウェブサイトの登録ページで、下に示すような記入欄を見た。これには最低でも 2 つのデザイン上の間違いがある。続きを読む前にその 2 つを見つけることができるか、試してもらいたい。 お見逃しありませんように!お薦めの製品、ソリューション、サービス、講習会などの最新情報を提供いたします。ぜひ Foobar Corp. や、そのほか選りすぐりの企業からの情報をお取り寄せください。 電子メールを通して、最新情報をお送りしてもよろしいでしょうか? はい、電子メールを通して、その

    チェックボックス 対 ラジオボタン
  • 適切なリンクラベル:クリックを促す4つのS

    リンクテキストを具体的なものにすれば、リンクに偽りがないとユーザーに期待してもらえるし、その期待に応えることもできる。また、中身のある具体的なリンクテキストにすることで、簡潔なまま、単独で意味がわかるようになる。 Better Link Labels: 4Ss for Encouraging Clicks by Kate Moran on March 24, 2019 日語版2019年10月30日公開 ユーザーはリンクテキストによってサイト内を移動する。コンテンツの見つけやすさや発見しやすさ、アクセシビリティに対する、この小さくて控えめなUXの文言による貢献度は大きい。 そして、こうした役割を最もうまく果たせるリンクとは以下のようなものである: 具体的である(Specific) 偽りがない(Sincere) 中身がある(Substantial) 簡潔である(Succinct) 具体的であ

    適切なリンクラベル:クリックを促す4つのS
    ks0222
    ks0222 2019/10/30
    「具体的である」「偽りがない」「中身がある」「簡潔である」「情報を伝える言葉を先に出そう」
  • ショッピングカートかウィッシュリストか: あとで買う商品を残しておく、ECサイトの機能

    ECサイトにおいてショッピングカートの商品をあとで購入できるように保存しておく方法は、発見しやすく手間のかからないものでなければならない。 Shopping Cart or Wishlist? Saving Products for Later in Ecommerce by Page Laubheimer on November 4, 2018 日語版2019年6月11日公開 ショッピングカートは外部記憶である ショッピングカートとは買ったものを入れる単なるカゴではない。外部記憶の一種であり、これによってユーザーが興味のあるアイテムを思い出せて、そのアイテムにすぐアクセスできるツールでもある。最近実施した49のECサイトを対象にした調査で我々はよく目にしたのは、買い物客が買い物を続けている間、アイテムを比較したり、商品を保存する目的で、あるいは、後日、そのサイトを利用するときのために、

    ショッピングカートかウィッシュリストか: あとで買う商品を残しておく、ECサイトの機能
    ks0222
    ks0222 2019/06/11
    「ウィッシュリストにアイテムを追加すると、「『ぜひ』それが欲しい」ということになるが、カートにアイテムを追加するのは、「それが欲しい『かもしれない』」ということ」
  • 幸福のデザインを忘れていませんか

    利潤の増大はあくまでもUCDやHCDの結果のひとつであり、主要な結果は人々の満足感や幸福であるはずだ。そのことを忘れてしまったように見える昨今の状況においては、来、我々が目指すべき目標が何だったのかを改めて知らせることが必要だろう。 黒須教授 2019年5月20日 マーケティングに毒された最近のUXD 現在、UXD関係者の焦点は、より高いUX水準を持ち、その結果、より一層ユーザに受けいられる、つまり購入したり利用したりしてもらえる人工物(製品やサービスやシステム)の設計と提供に偏ってしまっている。これは世界中で同じような傾向が見られているが、果たしてそれで良いのだろうかという反省が見られない。少なくとも僕の耳には入ってこない。 資主義の世界では、製造手段や提供手段をもつ人々(資家)が、それを持たない人々に働く場や手段を提供したり、その結果として得られる産品を提供したりしてその代価とし

    幸福のデザインを忘れていませんか
  • 効果的なカルーセルをデザインする: お化け屋敷ではなく、しゃれた娯楽を創り出そう

    カルーセルを使えば皆が一番欲しがる場所を複数のコンテンツで独占することができるが、ビューポートの大小にかかわらず、カルーセルはスクロールして飛ばされてしまうことも多い。もしカルーセルをページの主役にするなら、良質なナビゲーションとコンテンツによってその有効性を高めることが可能である。 Designing Effective Carousels: Create a Fanciful Amusement, Not a House of Horrors by Kara Pernice on September 14, 2013 日語版2013年11月11日公開 カルーセルの普及 カルーセルと見なされているUI要素にはいろいろなものがある。例えば、(DellのWebサイトにあるような)クリック可能な複数イメージからなるフィルムストリップもそうである。 また、(NestのWebサイトにあるような)

    効果的なカルーセルをデザインする: お化け屋敷ではなく、しゃれた娯楽を創り出そう
  • より良いUXのための、役立つフィルターのカテゴリーと値の決め方

    ファセット検索を有益なものにするために、適切で、ユーザーが予測でき、業界用語のない、優先順位づけされたフィルターカテゴリーとフィルター値を作成しよう。 Defining Helpful Filter Categories and Values for Better UX by Kate Moran on July 15, 2018 日語版2019年3月11日公開 オンラインサービスでは、ECサイトであれ、ニュースサイトであれ、ソーシャルメディアやその他の大企業のサイトであれ、情報が多すぎると問題を引き起こすことがよくある。(商品、場所、コンテンツなどの)たくさんの選択肢をユーザーが検索しやすくする方法の1つは、そうした選択肢のリストをユーザーの指定した条件を満たす扱いやすい数に絞り込むことができるようにすることだ。 ユーザー調査では、検索結果を絞り込むツールをどんなにありがたいと思ってい

    より良いUXのための、役立つフィルターのカテゴリーと値の決め方
    ks0222
    ks0222 2019/03/11
    “理解不可能な業界用語はフィルターにはふさわしくない。”
  • ネットショッピングの新たなUX: ユーザーが抱く期待の変化

    現在のネットショッピング客は、迅速な配送・購入の選択肢があること、実店舗とWeb間の移行がシームレスであること、提供される情報が正確でタイムリーであること、豊かなエクスペリエンスが物理的な世界にも引き継がれることを期待している。 The New Ecommerce User Experience: Changes in Users’ Expectations by Kim Flaherty and Anna Kaley on June 10, 2018 日語版2019年1月9日公開 我々がECサイトの調査を始めたのは、ドットバブルの頃の2000年にまでさかのぼる。それ以来、eコマースのユーザビリティとそのカスタマーエクスペリエンスの調査を継続的におこなってきた。 『Ecommerce User Experience』(eコマースのユーザーエクスペリエンス)のレポートシリーズの第4版に向け

    ネットショッピングの新たなUX: ユーザーが抱く期待の変化
    ks0222
    ks0222 2019/02/02
  • ビジュアルデザインのテスト方法

    フォントや色などのビジュアル要素を評価するときには、美的印象と行動への影響の両方を評価しよう。 How to Test Visual Design by Kathryn Whitenton on June 17, 2018 日語版2019年1月22日公開 フォントや色、配置、画像などのビジュアル要素に対して、ユーザブルなエクスペリエンスを作り出すだけでなく、親しみやすさや信頼性、革新性のような複雑なそのブランドの特徴を表現することが期待されるようになってきている。 それに対して、デザインチームの多くはまず目標とするブランドの特徴を定義することから始める。そして、デザイナーとステークホルダーで、そうしたブランドの特徴が最もよく伝わると思われるビジュアル要素を選び出す。デザイナーとステークホルダーの意見はユーザーの反応を正確に予測しているはずだ、ということがこのアプローチの前提になっている。

    ビジュアルデザインのテスト方法
  • ポリヒエラルキーはIA内のまぎらわしいカテゴリーの見つけやすさを改善する – U-Site

    アイテムが2つ以上のカテゴリーに当てはまる場合、IA構造の中でそのアイテムの親を複数挙げることで、ユーザーを失うことを避けることができる。 Polyhierarchies Improve Findability for Ambiguous IA Categories by Page Laubheimer on May 13, 2018 日語版2018年12月12日公開 はじめに Webサイトのために完璧な情報アーキテクチャ(IA)を作成するのは、特に正確さと明確さを両立させようとすると容易なことではない。理想的には、コンテンツや製品を正確に伝えられ、新しいトピックやプロダクトの追加時に拡張可能で、(人によって異なることが多い)ユーザーのメンタルモデルに一致するカテゴリーを作成するべきだからだ。 最も一般的なIAの階層は、ツリー状の構造をしていて、(トップページに該当するもの以外は)各ノー

    ポリヒエラルキーはIA内のまぎらわしいカテゴリーの見つけやすさを改善する – U-Site
    ks0222
    ks0222 2018/12/15
    “可能性のあるすべての親カテゴリーの中に置かないようにしているのは明らかだ。これはポリヒエラルキーのデザインにおいては重要なポイント”
  • 高齢ユーザへの接し方

    僕は、ラガードとなった高齢者の人達をICTの渦に巻き込むのは積極的にやるべきではないと思う。ICT利用でネガティブな経験をさせてしまうより、人的サービスを提供したり、従来のやり方で対応できるようにしてあげる方がよほど人間中心的ではないだろうか。 黒須教授 2016年7月21日 ベクトルとしての人生と硬化傾向 僕は、人が生まれてから幼児期、青少年の時期、成人した時期、壮年期、そして老年期へと経ていく過程は、多次元空間におけるベクトルの伸長のようなものだと思っている。 その原点は、遺伝子によって多少位置が異なっていて個人差はあるものの、まだ多くの部分はポテンシャルとしてのものであり、形質をなしているものについては、お互いおおよそ近いところにある。 成長するにしたがって、そのポテンシャルが外化されて形質化し、さらに教育やしつけ、友人関係、メディアなどの影響が個人個人によって異なるため、徐々に異な

    高齢ユーザへの接し方
  • アイコンのユーザビリティテスト

    ユーザーがアイコンの意味や目的をきちんと理解できるように、製品開発サイクルのさまざまなステージで複数の種類のテストを実施しよう。 Usability Testing of Icons by Aurora Bedford on February 7, 2016 日語版2016年5月17日公開 スペースを節約し、ビジュアルをすばやく再認できるというメリットを活かそうと、デザイナーはよくアイコンを利用する。スマートフォンやウェアラブルデバイスなどのディスプレイの小さいデバイスの人気が高まるにつれ、アイコンの利用も増えてきている。しかし、こうしたアイコンはどの程度ユーザブルなのだろうか。ある特定のアイコンがうまく機能するかどうかを確認する唯一の方法は、ユーザーにそのアイコンをテストしてもらうことである。 アイコンのテストでは何をテストするのか テストの方法によって、アイコンのユーザビリティの中で

    アイコンのユーザビリティテスト
  • HCDの最近の位置づけ

    ISO 13407以来のあの図は単なるプロセス図であり、全体をぐるぐる回すことがHCDの特徴ではない。また、人間工学的な観点を重視するようにという記述も設計者にとっては留意事項の1つに過ぎない。となると、HCDのコアはどこにあるんだろう、ということになる。 黒須教授 2016年5月24日 題意 実は、今回のタイトルは「HCDはぐるぐる回る」とか「HCD教はいかがわしい」とかにしようかと思ったのだが、もう少し穏当なものにしようと考え直した結果、このようなつまらないタイトルになった。ただ、今回の原稿の大意はそうした内容である。 HCDの曖昧さ HCDは、もともと境界領域として出発した。そこには、人間工学や心理学やデザインやマーケティングや品質工学などなどが関係している。その意味では、HIやHCIといった領域と似たような特徴を持っている。コアとなる概念や手法が明確ではなく、皆がそこを目指して頑張

    HCDの最近の位置づけ
  • 改めて「デザイン思考」を考える

    デザイン思考というキーワードが、現在のビジネス界のバズワードのひとつになっている。言葉というのは、その意味が拡散するにつれ、何でもありの世界に入っていってしまうが、ここは一つ、当初の概念に立ち戻り、それが何だったのかを考え直すようにしたい。 黒須教授 2016年5月19日 バズワード 流行というものは、それが登場してきた時の新奇性によって人々を興奮させる。もちろん新奇なものなら何でも流行するわけではなく、タイミングや状況、そして当のモノの質にもよる。そうした淘汰の段階を経て流行となったものは、しかしながら数年から長くても十年ほどで新しい流行に取って代わられる。これが流行という現象だ。 デザイン思考というキーワードは、こうした点で現在のビジネス界のバズワードのひとつになっている。UXもバズワードのひとつだったが、今やかなり拡散してしまい、バズワードの戦列から離脱しつつあるようにも見える。 U

    改めて「デザイン思考」を考える
  • モバイルWebサイト: モバイル専用、レスポンシブ、アダプティブ、あるいはデスクトップサイト

    モバイルWebサイトのさまざまな実装アプローチにはそれぞれメリットやデメリットがある。しかし、適用されるユーザーエクスペリエンスの原則は、実装に関係なく同じである。 Mobile Websites: Mobile-Dedicated, Responsive, Adaptive, or Desktop Site? by Raluca Budiu on February 14, 2016 日語版2016年5月26日公開 Web上にあるサイトはどれもが同じように作られているわけではない。モバイルデバイスでユーザーが遭遇するサイトは次の種類のうちのどれかになる: モバイルフォン用にデザインされたモバイル専用サイト。 特殊なタイプのモバイル専用サイトで、アプリのようなルックアンドフィールを持つWebアプリ。 画面サイズの異なる複数のデバイス向けにデザインされたレスポンシブデザインサイト。このデザイ

    モバイルWebサイト: モバイル専用、レスポンシブ、アダプティブ、あるいはデスクトップサイト
  • 若年層はその親世代よりフラットデザインを好む

    18~25歳のユーザーはフラットなUIの魅力を中高年よりもやや高く評価している。しかし、フラットデザインで見た目を魅力的にすることには、その結果、損なわれるユーザビリティに見合うほどの価値はないかもしれない。 Young Adults Appreciate Flat Design More than Their Parents Do by Kate Meyer on February 28, 2016 日語版2016年6月9日公開 自分たちのインタフェースが流行の先端をいっている、あるいは今風であると思われたい場合にデザイナーはフラットデザインをよく採用する。その根底にあるのは、フラットなUIのターゲットはミレニアル世代であるという前提である。つまり、ミレニアル世代はその両親や祖父母世代よりもこのデザインスタイルを好むと思われている。したがって、中高年ユーザーがフラットなUIの使い方をな

    若年層はその親世代よりフラットデザインを好む
    ks0222
    ks0222 2016/06/16
    「見た目をほんの少し良くすることが、インタラクションを非効率にし、クリックできるかどうかをわかりにくくし、中高年ユーザー層を遠ざけるかもしれないというコストに見合うかどうか」
  • HCDはイノベーションを生み出せるか 1 of 4

    現在のバズワードのひとつにイノベーションがある。イノベーションという概念を再定義して、世の中にポジティブな動機付けを広めたのは、経済学者のシュンペーターである。当初、彼はイノベーションという代わりに「新結合」という表現を使っていた。 黒須教授 2016年5月31日 イノベーションの流行 現在のバズワード(流行り言葉)のひとつにイノベーションがある。それに関連して、デザイン思考、IDEO、d-school、アブダクション(編注: 仮説的推論)、感性工学などが語られている。一昔前なら、水平思考とか、ファジーとか、カタストロフ理論などが、関連して語られていたところだ。イノベーションに縁が薄い人達は、こぞってそうしたビジネス書を読んでいる。要するに、一種の魔法としてイノベーションというキーワードに惹かれてしまうのだろう。そうしたの累積の売り上げを想像すると、なんとも忌々しい感じがする。(もちろん

    HCDはイノベーションを生み出せるか 1 of 4
  • 音声対話のUX: すばらしき新世界…だが、変わらない部分もある

    音声対話はグラフィカルユーザーインタフェースとはかなり異なるものだが、伝統的なユーザビリティ原則がそこでのユーザーエクスペリエンスの質に決定的な役割を果たすことに変わりはない。 Voice Interaction UX: Brave New World...Same Old Story by Kathryn Whitenton on January 31, 2016 日語版2016年4月11日公開 音声コマンドを利用して、コンピュータをコントロールするときのエクスペリエンスが、新世代の音声対話システムの登場により、大きく変わってきている。AppleのSiriやGoogle Nowが利用できるようになって数年経ったことで、このテクノロジーは赤ん坊としての時代は終えたといえる。むしろ、今は、幼児期といっていいだろう。つまり、歩いたり、話したりしはじめたところだが、まだ何度も転ぶし、まったく意

    音声対話のUX: すばらしき新世界…だが、変わらない部分もある