web-dev-qa-db-ja.com

明るいピンクの背景が悪いUX / UIなのはなぜですか?

赤い背景のフォームのエラーメッセージの色は何ですか? 明るいピンク色の背景はUX/UIが悪いと言っています。

本当ですか?背景として明るい赤/ピンクを使用すると、自動的に悪い決定になり、結果としてインターフェースと使いやすさが低下しますか?もしそうなら、なぜですか?

注:私がデザイナーではない場合、私はあちこちの理論を少ししか知っていません。必要。

63
Maurycy

目が痛い

特定の色と色の関係は、目を刺激し、頭痛を引き起こし、人間の視覚に大混乱をもたらす可能性があります。

黄色で純粋な明るいレモンイエローは、最も疲労感のある色です。どうして?答えは、光と光学の物理学にあります。より多くの光が明るい色で反射され、目の刺激が過剰になります。したがって、黄色は目の刺激物です。

そして、あなたに赤い長方形を見つめるタスクを与えた後:

赤の四角形に焦点を合わせると、赤のデコードに使用される83,000の錐体が疲労し、過剰に刺激されました。

目の操作は主に筋肉質であり、過度の活動はそれを疲れさせます。 http://www.colormatters.com/color-and-vision/color-and-vision-matters

したがって、問題となるのは明るいピンクだけではなく、画面全体の明るい色です。明るい色はユーザーの目を傷つけ、ユーザーがアプリケーションをすぐに使用できなくなる原因となります。

コントラスト

その上にテキストのコントラストの問題もあります: enter image description here

ピンクの背景の例を参照してください。ほとんど読むことができません。

可視スペクトル上で遠く離れている色の組み合わせでは、ユーザーは常に目を再調整する必要があり、視覚的な不快感や、場合によっては疲労が生じます。 http://www.uxmatters.com/mt/archives/2007/01/applying-color-theory-to-digital-displays.php#sthash.NZw9zDUs.dpuf

実際、効果的に対比する色を見つけるのは非常に困難です。白と最も暗い黒以外のすべてが、WCAG 2.0の標準のコントラストを満たしていません:(通過する最も明るい黒を示し、すべてライター失敗)最も一般的なフォントの色を使用できないままにします。 enter image description here

http://webaim.org/resources/contrastchecker/

84
DasBeasto

本当ですか?

番号。

また、それが優れたUXであることも事実ではありません。

これは視覚的なデザインの質問であり、実際に状況に応じて適切に答えることができます...そしてその一部は、全体的なページデザインでどのように機能するかです。

引用された質問の特定のコンテキストで...

enter image description here

...RedについてPink

これは非常に具体的な組み合わせであり、DasBeastoが述べているように、問題は赤とピンクを使用していることではなく、赤とピンクのコントラストがほとんどないため目立たないことです。

これは、質問している質問とはまったく異なる質問です。つまり、ピンク自体が悪いかどうかです。繰り返しますが、いいえ、特定の色は悪いわけではありません-しかし、色は不適切な方法で使用できます

たとえば、緑を使用しても同じ問題が発生する可能性があります。色の問題ではなく、コントラストの問題です。

enter image description here

40
DA01

明るい色の背景は、この答えで拡張した身体的および生理学的理由により、UIが悪いです 8〜14歳向けのソフトウェアは、カラフルで「子供っぽい」ものですか?

ピンク色の背景に対してエラーメッセージに注意を引く方法については、赤い背景とピンク色の背景の間のコントラストを上げる必要があります。上記の@ DA01の例では、エラーメッセージを含む赤いパネルの周りの白または黒の境界線が役立ちます。

しかし、私にとっての本当の問題は、明るいピンクの背景です。変更できないことが前提である場合は、回避してください。ただし、選択する責任はありません。目の色収差は常にニュートラルスクリーンの平面から前に押し出されるため、ピンクまたは赤は背景として特に悪いです。

0
nigel222