ビジュアルデザインはUXに本当に影響しますか？
ビジュアルデザインがユーザーエクスペリエンスに与える影響を本当に心配していますが、広すぎるように見えるので、少し説明します。
私の発言は、ユーザーが必要な情報を見つけることができれば、思慮深い情報設計のために、視覚的設計の品質にもかかわらず、ユーザーは満足するということです。つまり、機能性に満足している限り、ビジュアルデザインはあまりよく考えられていませんが、インターフェースを使い続けています。ただし、その逆はめったにありません。
つまり、私の質問を絞り込みます。他の設計上の考慮事項が考慮されている場合、（良いまたは悪い）ビジュアルデザインは本当にUXに影響しますか？
- これをサポートできる事例や研究はありますか？
- これをサポートする個人的な経験はありますか？
Don Normanの「Why we Love（or Hate）Everyday Things」は、N。Tractinskyが1999年に実施した有名な研究の報告から始まります。ATMマシンの4つの異なるデザインをテストしました。使いやすさ、美しさの良し悪し（2x2の研究デザイン）。彼はそれを報告した
システムの美学の程度は、美学と使いやすさの両方の使用後の認識に影響を与えましたが、実際の使いやすさの程度はそのような影響を与えませんでした。
元の論文はこちらから入手できます What is Beautiful is Usable 。
これは後にTractinskyと同僚によって複製および拡張され、彼のウェブサイトは さまざまな研究の簡単なレビュー を提供しています。
はい、ビジュアルデザインはユーザーエクスペリエンスに影響します
視覚的な違いが1つしかない一般的な食事を次に示します。劇的に異なるユーザー体験を推進するのに十分です：
このトピックに関する正式な文献は他にもありますが、他の文献はすでに引用されているため、もう1つ簡単なイラストを追加します。次の2つのフォームは、視覚的なデザインを除いてほとんど同じです。
左側のフォームは通常、右側のフォームよりも読みやすくなっています。
- テキストの色が統一されている（黒）
- テキストと背景のコントラスト比が高い（黒と紫の間の色空間のベクトル距離は、ライトグレーと白の間の距離よりも大きい）
- フォームフィールドは、より明確に区別されています
- 中央に配置されたラベルは、ワークフローを明確に示します
それでも、ほとんどのユーザーは、右側のフォームの方がユーザーエクスペリエンスが優れていると報告します。これは、フォームがビジュアルデザインが優れている：
- grid alignment （ラベルはフィールドと左揃えされます）
- レイアウトの一貫性が向上しました（フィールドとボタンのサイズは同じです）
- （驚き/矛盾する色 の少ない落ち着いたカラーパレットがあります。
- 形としてはより身近な見た目
まず、 interaction-design.orgのエントリー、Noam Tractinskyによる視覚的美学 を読んでください。 エントリに関するJeffrey Bardzellのコメント も忘れずに読んでください。
次に、Tractinskyの独創性をチェックできます 美しいものは使用可能です ：
共分散の多変量分析の結果、システムの美学の程度は、美学と使いやすさの両方の使用後の認識に影響を与えたが、実際の使いやすさの程度はそのような影響を与えなかった。
および 美しいは本当に使用可能ですか？HCIにおける使用可能性、美学、および影響の関係の理解に向けて Tuch、Roth、Hornbæk、Opwis、およびBargas-Avilaによる：
結果は、美学が知覚されるユーザビリティに影響を与えないことを示しています。対照的に、使いやすさは使用後の美的感覚に影響を与えます。私たちの調査結果は、「美しいものは使いやすい」という概念を示しています。これは、美学がユーザビリティの知覚を高めると仮定すると、特定の条件下では逆転できる（ここでは、中程度から大規模の美的操作と組み合わせた強力なユーザビリティ操作）。
使いやすさ自体が優れたユーザーエクスペリエンスにとって十分であるとデザイナーが考えているか、ルックアンドフィールや機能性を含む複数の側面の合計が優れたユーザーエクスペリエンスであるとデザイナーが考えるかに関係なく、私は常にNielsen-Normanスケールでそれを考えます。
これまでに指摘されたほとんどの点に同意するので、まだ触れられていない点を追加します。
ビジュアルデザインについて見過ごされがちなことの1つは、ユーザーの信頼に与える影響です。あなたが今までに多くのいずれかを使用して構築された中小企業のウェブサイトに行ったことがある場合。テンプレートベースの安価なホスティングWebサイトなら、私が何を意味するかわかるでしょう。 。 。通常、ページは完全に機能しており、必要な作業を完了することができますが、無意識のうちに、「製品/サービスはWebサイトと同じ品質になるのでしょうか？私が購入したものを手に入れることを信頼していますか？」
公平であるか不公平であるかを問わず、ウェブサイトまたはアプリケーションを構築して見栄えよくするために（機能的であることに加えて）品質と労力を費やすことは、ユーザーが所有者の全体的な見解/品質へのアプローチをどのように認識するかに影響を与えます。詳細に注意を払い、優れたUXを提供するために邪魔にならないことは、ビジネス/アプリの所有者がトランザクション、配信、製品、サービスなどの詳細と全体的な経験に注意を払うことを意味します。
個人的なデータ（購入、登録など）をプロのように思わないとWebサイトから送信しない人を知っています。 。 。彼らは寛大なプロバイダーを探します。
航空機のコックピット内の制御ダッシュボードの視覚的美学が飛行操作の有効性に影響を与えることを示す航空の科学的研究がありました。
したがって、視覚的に魅力的なデザインはユーザビリティに影響を与えます。しかし、興味深いのは、システムがtooオペレーターにとって美しい場合、システムがインテリジェントでありすぎて理想的であると認識していたため、有効性が低下していたことです（システムの制御が失われたため）。
詳細については、「航空ヒューマンファクター、第2版」、第16章「フライトデッキの美学とパイロットパフォーマンス」を確認してください。
ユーザーは、非常に短い時間枠で快適になるか、そうでない場合、ユーザーの知覚方法は非常に重要です。また、ユーザーは以前の経験に基づいて意見を形成し（これは、設計の一部が履歴に従う必要がある1つの理由です）、正しいポイントに混合された右トリガーを配置すると（アイトラッカーが少し役立つ場所）、ユーザーエクスペリエンスを支援します。だから、はい、視覚的なデザインが重要です。
ポイント2）でのみ回答できます。
5年間のモバイルUI設計の後で、機能>設計について説明します。小さい画面は、少ないほど良い詳細な情報を尋ねます。ただし、色（ビジュアルデザイン）はUXを最適化できます。
私のプロジェクトの1つは、農家向けのモバイルアプリでした（以前はスマートフォンを使用していませんでした）。適切な色（キャンセルの場合は赤、OKの場合は緑）を使用して、ボタンをタップした後に何が起こるかを理解することができました。テキストの代わりにアイコンも役立ちます。つまり、ビジュアルデザインは、有効な方法で使用するときにUXを最適化できます。
これをコメントで指摘しましたが、それに「答え」の要素もあります...
ファジーロジック
「視覚的」なデザインがユーザーエクスペリエンスにどのように影響するかに関する研究は、明確にするのが困難です。この主題に関するドンノーマンの優れた文章でさえ、謎や芸術の要素を含んでいます。あなたは言うことを何も見つけません、
「これはndesignedで、これはdesignedでした。結果は次のとおりです。」
それは不可能ですよね？エンジニアの気まぐれに合わせて集められたフィールドの集まりであったとしても、それはどこかにdesignedでした。非視覚的と呼べますか？もちろん違います。これは、悪いものから良いものまでのあいまいな連続体であり、そもそも本質的に個人的および文化的な好みの問題です。
ファジー測定
それでは、あいまいなエッジのあるものをどのように測定しますか？厳密に言うと、ある程度の正確さはありません。したがって、ギャップを埋め、さまざまなソリューション（設計のさまざまな専門分野で構成されるビジュアルソリューション）に対する人間の反応を解釈するには、脳に依存します。
すでに多くの良い議論がここにありますが、OPがUIとUXリンクをサポートするケーススタディを望んでいるように見えるので、私はリファレンスを追加すると思っただけです。
私は、デザインの美学を考えるときに時々これを参照し、実際にそれを見てきました。ユーザー（自分自身を含む）は、ユーザー（自分自身を含む）がデザインの美学に感心しているほど、UXのマイナーな煩わしさをそれほど気にしていないようです。
https://www.nngroup.com/articles/aesthetic-usability-effect/
美的ユーザビリティ効果とは、魅力的な製品をより使いやすいものとしてユーザーが感じる傾向を指します。人々は、実際にはより効果的または効率的でなくても、見栄えの良いものがうまく機能すると信じる傾向があります。
簡単な例を使用して、ビジュアルデザインがユーザーエクスペリエンス、特にユーザビリティにどのように影響するかを示します。その背後にある科学は、エンドユーザーの目を下に向ける方法に関係しています。大量のデータを表示するサイトまたはアプリケーションで実行できる最善のことの1つは、データのグループを作成するために Gestalt Principles を使用することです。適切に行われると、脳は情報を1つの大きなデータセットとして認識しなくなりますが、処理がはるかに簡単なデータのチャンクになります。
他のユーザーを無視しながら、ユーザーが跳ね返る2〜3個の大きなチャンクを作成するのは簡単です。この例としては、ヘッダー、左ナビゲーション、およびコンテンツ領域を持つサイトがあります。ユーザーは、サイトの現在の場所に自信がある場合、コンテンツにすぐに戻ることができますが、コンテンツをより多くのチャンクに分割する必要がある場合はどうなりますか。
この時点で、他のチャンク内にチャンクをネストするところに到達しています。単純に空白を使用すると、余計な空白ができてしまい、うまくいきません。ボーダーを使用すると、視覚的にノイズの多いページが表示され、ユーザーが視覚的な検索タスクを容易にするために実行しようとしている困難な作業のほとんどが破棄されます。あなたが直接情報に注意を向けているかどうかに関わらず、あなたは脳が視覚ノイズを処理します。脳の処理の労力が少ない=パフォーマンスが高いため、ノイズを減らすことは常に良いことです。
チャンクを決定したら、問題を解決するにはどうすればよいでしょうか。奥行きと色は、境界線や余白と同じくらい効果的にゲシュタルトグループを作成できる追加の次元を追加します。特定のグループで別の背景色を使用したり、アイテムの状態に基づいてテキストの色をトリガーしたりすると、表現したいすべてのチャンクが突然存在します。ユーザーの目は、個人的な意図に基づいて自由に跳ね回ることができ、関心のないアイテムは無視しやすくなります。 「キュー内のすべてのアクティブなリストアイテムに興味があります」-それらは緑色で表示され、「このリストで特定のアイテムを見つける必要があります」-すべてのリストの見出しの背景は水色です。
「アート」の部分は、どこにどのような色や深さを適用したいかを選択したときに効果を発揮します。これを適切に適用することは、主に現在の経験から来ています。これは、ほとんどのものが（私が知る限り）文書化されていないためです。ただし、Googleのマテリアルデザイン言語は、ビジュアルデザインをどのように適用するのか、またその理由を説明するのに優れています。このトピックに興味があるなら、私はそれをお勧めします。しかし、正直なところ、ビジュアルデザインは実際には研究とエンジニアリングの産物です。科学は神経科学、認知心理学、実験心理学などから来ています。調査は、エンドユーザー調査、ペルソナ構築、タスク分析、A/Bテストなどのアクティビティから行われます。エンジニアリングは、以前のアプリケーションをユーザーインターフェイスに適用したものです。
数年後、ビジュアルデザインを含むUXのすべての部分は、個人的な好みとはほとんど関係がないことがわかりました。デザインは、他の分野と同様に、ドメインの研究と理解に基づいて提示する必要があります。