タグ

ブックマーク / uxmilk.jp (8)

  • UXデザインに役立つ6つの心理学の法則

    Webデザインに触れるすべてのユーザーは(少なくともシンギュラリティが到来するまでは)人間であり、なにかしらの心理学的法則の対象です。何十年もの研究において、心理学者と哲学者は今日に至るまで有効な人間の質を観察し続けており、有能なUXデザイナーであれば、彼らの研究に目を向けるのが賢明でしょう。 疑うまでもなく、UXに心理学を適用することはシームレスで楽しいユーザー体験を提供する上で最適な選択です。人間の心理に注意を払わないWebサイトを閲覧することは、(VoxのJoe Posner氏が述べているように)押し戸を引いているようなもので、自身のせいでなくとも自分が愚かだと感じてしまうものです。 幸運なことに、あなたのデザインが心理的に適切なのかを試すために、臨床試験をしたり論文を書く必要はありません。既に心理学者がやっているからです。ここではUXデザインを考える際に頭に留めておきたいいくつか

    UXデザインに役立つ6つの心理学の法則
  • 見た目の美しさとアクセシビリティのパラドックス

    UX Movementの著者および創設者です。UXのベストプラクティスとスタンダード、さまざまなテクニックに関する知識を共有することで、よりよいデジタルの世界をつくり出しています。 すべてのインターフェイスにはユーザーが存在し、そのユーザーはつねに多数派と少数派によって構成されています。たとえば、大半のユーザーは正常な視力をもっていますが、少数派となるユーザーは何らかの視覚障害をもっています。 正常な視力をもっているユーザーが見るものと、色覚異常および低視力のユーザーが見るものとの間には大きな隔たりがあります。何らかの視覚障害をもっているユーザーはテキストが小さすぎたり色のコントラストが低すぎると、文字がぼやけて見えたり、要素がよく見えなかったりする傾向にあります。 アクセシビリティの目標は、多くの場合忘れられがちな少数派のニーズを満たすことです。しかし、少数派のニーズを満たした結果、多数

    見た目の美しさとアクセシビリティのパラドックス
  • アクセシビリティからデザインを学ぼう

    福岡のWebアクセシビリティ/フロントエンドエンジニア。株式会社ディーゼロ所属。Webにインクルーシブな未来を夢見てる人。よりセマンティックでアクセシブルなHTMLをマークアップできるように開発者を手助けするmarkuplintというオープンソースツールを個人の活動として開発しています。 これはエンジニアである僕がアクセシビリティを学ぶことによりデザインの知識と理解が深まったという経験談です。もしも今、あなたがデザインに関わっていく上で物足りなさやスキルの向上に伸び悩んでいるのであれば、アクセシビリティの知識がその助けになるかもしれません。広範囲でしかも大袈裟な話に聞こえるかもしれませんが、気になったところからちょっとずつ覗いてみるだけでもいいと思います。 アクセシビリティとは Accessibilityは英語なので人によって訳や解釈が若干異なりますが、これから話すアクセシビリティは、一般

    アクセシビリティからデザインを学ぼう
  • 【UXの迷信】ユーザーはスクロールをしたがらない?

    ZoltánはCentralway(チューリッヒのソフトウェア企業)のUXデザイナー長。元UstreamのUXディレクター。美しく、且つ使えるプロダクトを作ることに情熱を燃やしています。 90年代半ばはまだユーザーはスクロールすることに慣れていませんでしたが、昨今ではスクロールはとても自然なアクションです。記事やチュートリアルのように一続きで長ったらしいコンテンツの場合は、スクリーンやページを分けてしまうよりスクロールの方がはるかに高いユーザビリティを生み出します。 ホームページのトップや、ファーストビューにすべての情報を詰め込む必要はありません。そしてユーザーを確実にスクロールさせるためには、デザインの一定の鉄則に従ってユーザーが興味を持つようなコンテンツを提供しなければなりません。そうは言っても、ファーストビューの情報はやはり最も目立つものであり、ページに価値があるかどうかをユーザーが

    【UXの迷信】ユーザーはスクロールをしたがらない?
  • Webデザインのスタイルガイドの作り方

    Webサイトの制作はどんどん複雑化しており、1人で行う仕事ではなくなってきています。サイト制作では、ビジネスの目的に合わせた一貫性のあるデザインによって、快適なユーザー体験を作り出すことが重要です。 Webサイトを分割してチームでデザインをするときにチームメンバーが共通認識を持つには、デザインドキュメントまたはWebデザインのスタイルガイドを作成することが有効です。これは、エンジニアがデザインを変更してしまうことを防ぐのにも役立ちます。 異なるページの間に一貫した体験を作り出すために、スタイルガイドを用意するのはとても有効です。また、今後の開発やサードパーティ製品が生まれた際も、ブランドのガイドラインに沿い、ブランドの一部として知覚されるようにやすくなるでしょう。 Luke Clum氏は、Webデザインの第一歩としてスタイルガイドを利用することについて、昨年簡単に紹介をしました。この記事で

    Webデザインのスタイルガイドの作り方
  • 有名サイトの事例から学ぶ12のWebデザイン・レイアウト

    ユーザーはデザインを見たいのではなく、コンテンツを求めてサイトにアクセスします。Web UI Patterns 2016 Vol. 1で説明した通り、デザインは直感的で分かりやすくコンテンツを表示するための手段にすぎません。 この記事では、Webにおける12通りのレイアウトのパターンを実際の例や良い実践方法、共通のシナリオを通して見ていきます。 1. カード 2. グリッド 3. マガジン 4. コンテナの不使用 5. スクリーン分割 6. シングルページアプリケーション(SPA) 7. Fパターン 8. Zパターン 9. 水平的なシンメトリー 10. 水平的なほぼシンメトリー 11. 放射線状のシンメトリー 12. アシンメトリー 1. カード

    有名サイトの事例から学ぶ12のWebデザイン・レイアウト
  • Web制作の作業効率を格段にアップさせる便利なチートシートまとめ

    HTMLCSS のタグやプロパティをすべて記憶することはベテランのデザイナーでも難しいものです。しかし、わからないタグやプロパティなどをいちいち検索して調べていると開発に時間がかかってしまいます。そんなときに役立つのがチートシートです。 チートシートを使えば素早く目的のものを見つけ、より効率的な開発を行うことができます。今回は Web 制作を行うときによく使う HTMLCSSBootstrapWordPress、ツールに関するものを紹介します。 HTML HTML5 Cheat Sheet ダウンロードページ HTML5 のタグがまとめられているチートシートです。すべてのタグが簡潔にまとめられており、非常に見やすいです。 The HTML 5 Mega Cheat Sheet ダウンロードページ こちらも HTML5 のタグをまとめたチートシートです。ブラウザ対応、廃止されたタ

    Web制作の作業効率を格段にアップさせる便利なチートシートまとめ
  • Gitを一度はあきらめた人のためのわかりやすいスライド9選

    エンジニアの方はすでにGitを使用している方も多いと思いますが、最近ではGitを活用しているデザイナーの方も増えてきました。今回はGit初心者の方にもわかりやすく解説されているスライドをまとめてみました。Gitは使っているけど、うまく活用できていないという方にもオススメです! デザイナのためのGit入門

    Gitを一度はあきらめた人のためのわかりやすいスライド9選
  • 1