web-dev-qa-db-ja.com

暗い配色のマイナス面とプラス面は何ですか?

私のアプリケーションでは Light-on-dark color scheme (暗い背景と明るいテキスト)を使用しています。

私の質問は、この配色のマイナス面とプラス面は何ですか、なぜこの配色は広く使用されていないのですか?

136
Navid

濃い配色は、ビジュアルコンテンツに重点を置くソフトウェアで効果的に使用されることがよくあります。たとえば、Adobe Lightroom、Adobe After Effects、Microsoft Expression Blend、およびKaxamlは、暗い色をテーマにしたインターフェイス。これにより、インターフェースをバックグラウンドにフェードインして、コンテンツを生き生きとさせることができます

なぜそれが広く使われていないのですか?それはあなたの群衆に依存すると思います。これらのアプリケーションでは、うまく機能する傾向がありますが、多くの人は暗いインターフェースを好まないでしょう。私の会社では、暗いUIを使用して非常に複雑なソフトウェアのインターフェースを作成しました。すべてを簡素化し、特定の時間に必要な要素に注意を向けるのに役立ちました。問題は、多くの人々が不平を言ったことでした。 「暗すぎる」、「明るい太陽の下で使用しているとき、ラップトップでは見栄えが悪い」など一部の人々は、暗いインターフェイスが嫌いです。

ボトムライン:アプリケーションが非常にコンテンツ主導型の場合、特に視覚的なコンテンツの場合は、暗いインターフェースを検討しますが、反対の準備をします。

代替ソリューション:2つのテーマ、1つは明るい、もう1つは暗いを提供します。これは、MicrosoftのExpression Blendで行われます(ライトテーマはかなりひどいように見えますが、IMO)。

また、うまく機能する暗いインターフェースを取得することはしばしば少し難しいことに注意することが重要です。暗い背景にあるテキストの読みやすさには、もう少し注意が必要です(つまり、読みやすくするには十分な明るさ​​ですが、読むのに邪魔になるほど明るくはありません)。

79
Matt Rockwell

暗いテーマと暗いテーマの明るいテーマには、次のような複数の効果があります。

  • アプリケーションにattentionをもたらすことと、アプリケーションのコンテンツに注意を引くこと

    • 人々は明るい領域に焦点を合わせています—暗い背景はコンテンツに注意を向けていますが、明るい背景はウィンドウ自体よりもデスクトップに注意を向けています。
      16:9以外の映画の周りのボックスが黒ではなく白だった場合、映画から注意をそらしてしまうことを想像してください。
  • テキストの詳細の強調とテキストの可読性

    • 暗いテキストを明るくすると、テキストが拡大したように見えます(人間の知覚により明るいオブジェクトが光るので)。これにより、テキストが太く表示されます。テキストが既に太字の場合、行間の間隔が狭くなるため、フォントによってはテキストが読みにくくなる場合があります。テキストが太字でない場合(または最初からフォントがきれいで幅が狭い場合)、テキストが目立ちます。

    • 灰色の異なる色合いの違いは、明るい背景よりも暗い背景でより顕著になります。 ( ここの式を参照 または ここ 。)

  • 明るい環境と暗い環境でテキストを読みやすくする

    • 暗い環境では、明るい背景が目を疲れさせる可能性があります。

    • 非常に明るい環境 、暗い場所でのライトはテキストを表示するのに役立ちますが、色合い(白いテキストと灰色のテキスト)を区別するのを難しくします。ライトオンダークは、シェード間の違いを確認するのに役立ちますが、環境が明るすぎる場合、暗いテキストのみが表示されます(グレーのテキストは白く見えます)。

  • 画面を見やすくする長期間またはさまざまな環境で。

    • TV画面 は、オフィスのコンピューター画面よりも照明の少ない部屋にあることが多く、暗いテーマの方が明るいテーマよりも目を休めることが容易になります。 (壁とスクリーンの輝度の差が小さいほど、アイリスの機能が低下します。)
  • コントラストの知覚に影響するさまざまな視力の問題を持つ人々がテキストを読みやすくする

    • 一部の人々は高コントラストのテキストしか読むことができません、黒の50%グレーは 高コントラスト 白の50%グレーよりもです。

    • 暗すぎる環境ではうまく見えない人もいれば、明るすぎる環境ではうまく見えない人もいます。それぞれ異なる(反対の)テーマが必要になります(どちらが必要かを推測させてください)。

  • 一致する人の視点

    • 背景を明るくすることに慣れていて、変化が嫌いな人は、暗闇では明るくなりません。

    • 創造的な人々は暗い背景を好むかもしれません、なぜならそれは一般的な慣習への挑戦を導入し、詳細と色を強調するからです。


多くのresearchが適切に実行されなかったことに注意することが重要です(テーマごとのテストの長さ、さまざまな(環境照明レベル)、現在は古くなっています(LCD画面ではなく)CRT画面に基づいています)。


考えられる理由暗いテーマがあまり一般的でない理由

  • 現代のウィンドウベースのOSは、最初はデフォルトで黒から白に

    • 古いコンソールベースのOSと区別する

    • それらを紙ベースの製品(本など)のように見せます。

  • ライトテーマは現在の標準です。人々は彼らに慣れている

  • ライトテーマは開発者の作業が少なくて済みます(OS /ブラウザのデフォルトテーマはライトなので、開発者はすべての色を上書きする必要はありません)

62
Danny Varod

なぜこの配色は広く使用されていないのですか?

明白な答えのない良い質問。あらゆるトレンドが関わっていると主張することもできますが、私たちが光を暗くする傾向がある理由を1つでも受け入れることは、勇気ある行動だと思います。あなたの最善の策は、あなたのサイトの目的とそのユーザーに最も適したスキームを開発することだと思います。

矛盾する研究/意見の概要については:

この研究 ライトが暗いのが最高だとわかった-一種。彼らは、審美的な好みが結果に影響を及ぼしていると感じています。彼らはまた、ダークスキームに光を当てることがほぼ同じように機能することを発見しました-Nielsenの見積もりによると(19ページを参照)。

この調査 明るい背景の暗いテキストの方が読みやすいことがわかりました-ほとんどのデザイナーはユーザーにとってより良いデザインを求めます。

そして、問題の一般的な見方として、 この記事 は、光の闇と光の闇の選択におけるいくつかの問題を説明しています。

この最後の記事の場合、フォント設定(スペースなど)に関するライトオンダークの一般的に受け入れられているガイドラインに従っていないと私が信じていないいくつかの例があることに注意してください。 IMOの例は少しずれています。

19
gef05

ライトオンダークのユーザーインターフェイスが機能しなくなる主な理由は、テキストが暗い背景に比べて非常に明るくなる場合です。これは、黒い背景に白いテキストが長時間読みづらくなる基本的な理由の1つです。

Adobe Lightroomのようなアプリケーションは、ダークグレーの配色にライトグレーを使用しており、これによりテキストのギラツキが大幅に減少するようです。ただし、暗いインターフェイスのライトの優れた点は、ソフトウェアを長期間使用したときに全体的なまぶしさが軽減されることです。

Adobe Premiere Pro、Lightroom、AVID MediaなどのソフトウェアComposerおよび今後のFinal Cut Pro Xでは、通常長期間使用されるため、暗いインターフェイスを使用します。

明るい画面への長時間の露出と、いくつかの明るい領域がある暗い画面への長時間の露出の違いは非常に重要です。私は、Premiere ProとLightroomで長時間作業することができ、一日中Microsoft OutlookとVisual Studioを使用するよりもはるかに快適です。仕事をしていると、1日の終わりに目が細くなります。

13
Nick Bedford

私は、WindowsとMacOSの両方がデフォルトで「軽量」スキームに設定されている可能性を軽視するつもりはありません。私はWindowsでダークテーマを使用していて、それを処理できないアプリケーション(ハードワイヤーの色、さらにはハードワイヤーのsome)に頻繁に遭遇するので、これが単なるカジュアルな好みであり、実際の視覚的なニーズではありません。おそらくあきらめて、「みんな」が使用してほしいスキームに戻ります。

アプリケーションにシステムカラー(何であれ)を尊重させることができれば、それが最善です。よくあることですが、特定の色を選択する必要がある場合は、テーマを提供するか、簡単な構成インターフェースを提供できます。ユーザーは通常、頻繁に使用するアプリケーションの設定を1回だけ行います。

6
Monica Cellio

暗い背景の明るいテキストの1つの利点は、テキスト内の異なる色区別しやすい

それはほとんどの読者にとって重要ではないかもしれませんが、さまざまな色のテキストを多用する1つのタイプのユーザーはソフトウェア開発者です。

暗い背景の色を区別する方が簡単な理由は2つあると思います。

  1. 暗い背景のテキストは明るくすることができますが、明るい背景のテキストは、コントラストの理由から、通常より暗い強度になります。ご存知のように、色の強度が減少するにつれて、色を区別することはより困難になります。

  2. 明るい背景のまぶしさは感覚をあふれさせません。


もちろん、この色のコントラストは、単なるテキスト以外にも使用できます。

(私は単にこれらの画像の1つを反転してもう1つを作成します。)

5
joeytwiddle

Webスタイルガイドによると、白地に黒が最適です。

http://webstyleguide.com/wsg3/7-page-design/3-visual-design.html

白い背景の黒いテキストは、最高レベルのコントラストを持っています。

3
PhillipW

私の意見では、明るい前景の外観を持つ暗い背景のアプリsexier以上edgy可能性のある対応する明るい背景のアプリよりも伝統的または- 保守的

とはいえ、私の意見では、通常、明るい背景で使用するように設計されているグラフィックス、コントロール、アイコンの量が多いため、暗い背景のアプリは(環境によっては)ビルドに少し時間がかかる場合があります。

3
dodgy_coder

環境により異なります。明るいテーマは明るい環境に適し、暗いテーマは暗い環境に適しています。

したがって、たとえば車のナビゲーションシステムは、夜間またはトンネル内のテーマを暗いテーマに切り替えます。

ユーザーによって異なります。一部の人々は暗い状況でよりよく見ることができ、一部のユーザーはその逆の場合もあります。これは 概日リズム に関係していると思いますが、ここでは複雑すぎません。

2
daniel
  1. 光沢のあるディスプレイでは、暗い背景で反射がより見やすくなります
  2. 目立つように設定されたディスプレイを使用していたとき [〜#〜] pwm [〜#〜] 点滅していると、長い目で見ると、暗い背景の方がはるかに楽だった

これらは暗い背景の一般的な理由であると思います。とにかく2番目のケースでは、PWMの点滅を減らすようにディスプレイを設定することが非常に有益です。

2
Sergey

暗闇の光はうまくいきますが、白い背景はうまくいきません。バックライト付きのLCDまたはLEDモニターを使用すると、淡い色または灰色のミュートが純白よりもうまく機能します。#DBD2BF、#C5D3D6、#D6C7CB、#BDC7BD、または#C2C2C2の作業で黒が見つかります良い例として。

0
Scott B.

色理論によると! 色理論

白、黒、グレー色はニュートラルと見なされます

しかし、個人的には、ほとんどのユーザーは黒やその他の暗い画面の画面を避けています。日常的に黒を身に着けていると、それが目的である場合は、社会的な設定で目立たないようにすることができます。人ごみの中で目立ちたい場合は、黒を着ないでください。ほとんどの人々は葬式で黒を身に着けることさえもはや気にせず、退屈で暗い色を身に着けることはあまりにも悲しいです。

最後の部分はask.comから取られました

0
Pir Abdul

どちらも(暗いと明るい)良いと思います。しかし、これは非常に個別であり、スイッチャー付きの両方のバリアントはすべてに適しています。ダークガンマは夜の方が安全ですが、ダークガンマでは日中は何も見えません。明るいガンマは日中は良いが、夜は目を痛めた。暗いグローバルGUIとWeb CSS。日中ライト。シンプル。そして、彼らは高速スイッチャーを持っている必要があります:)

私の工学でごめんなさい

0
nikolai

これは主にユーザーの認識に依存していると思います。多くのユーザーは暗いテーマで快適ですが、明るいテーマでは快適な場合があります。

Dark on lightテーマは、システムを使用しているユーザーがシステムを使用しているときに安心できるようになったため、現在より広く使用されています。明るい色はユーザーの目をそれほど強調しません。また、ユーザーのUI満足度を向上させるために、明るい色は穏やかな色合いにする必要があります。

暗闇の光は、ユーザーが重要なコンテンツを強調するのに役立ち、それを使用するのも簡単です。

0
talktokets