質問: 最もユーザーフレンドリーなカラーピッカー 私はウェブサイトをデザインしていますが、ユーザーが一部の要素の色を変更できるようにする必要があります。カラーピッカーを実装する必要があります。どのようなカラーピッカーが最もユーザーフレンドリーで、見栄えが良いですか?これまでに4種類の種類がありますが、他にもっと良い種類がある場合はお知らせください。私はデザインがどのように見えるかに完全に柔軟です。#1:スクエアカラーピッカー #2:カラーホイールのカラーピッカー #3:カラーホイール-スクエアカラーピッカー #4:カラーホイール-三角形のカラーピッカー
回答: リストするすべてのカラーピッカーは、 hsl/hsv (色相、彩度、明度/値)のカラー表現のバリエーションに基づいています。したがって、それらの主な違いは色理論ではなく、単にコントロールの配置と形状にあります。とはいえ、リストの2番目のカラーピッカーには、他のカラーピッカーと比べて大きな欠点が1つあります。色相軸が他のものと分離していないことです。他のすべてのインターフェイスでは、最初に特定の 色相 を選択し、次に基本色相に影響を与えずにその色相の異なる 色合いと濃淡 を選択できますが、2番目のカラーピッカーは彩度を組み合わせます同じ色のホイールの色相軸。ホイールをクリックすると彩度と色相の両方が変化します。したがって、色相を維持しながら色に色を付けようとすると、視力と手と目とマウスの調整が難しくなります。色付けとシェーディングは、色とグラフィックスを操作するときに非常に一般的なことなので、これは非常にイライラすることがあります。リストの最初のカラーピッカーdoesは個別の色相軸を持っていますが、かなり小さなスペースに圧縮されているため、範囲をクリックするだけでは特定の目的の色相を正確に選択することが困難です。また、色相軸の円形の性質を視覚的に表すことができず、スペクトルの赤い部分に任意の不連続性が生じます。したがって、私はそれをロットの2番目に悪いものとして評価します。最後の2つのカラーピッカーは、外観と使いやすさが非常に似ています。個人的には、色合い/シェードスペースis基本的に三角形の性質(3つの「純粋な」シェードの組み合わせ:黒、白、および純粋な飽和色相)。とは言っても、実用性に違いはありません。したがって、私は個人的にカラーピッカーを次の順序で評価します:#4(最高)、#3(ほとんど#4に等しい)、#1、#2(最低)。最後に、allに示したカラーピッカーには共通の欠点があることに注意してください。それらのベースとなっているhsl/hsvカラーモデルは、rgbカラースペースの単純な再パラメーター化なので、知覚的に均一ではないため、色相を変更すると、知覚される色の明度に影響します。 (これは、カラーホイールを見ると簡単にわかります。青い部分は、緑と黄色の部分よりもlot暗く見えます。)したがって、それらのほとんどは、さまざまな色合いや色合いを簡単に選択できます。同じ色相の場合、その逆-知覚される同じ明度と彩度を維持しながら色の色相を変更する-は非常に困難です。残念ながら、この問題を回避するために一般的に使用されているカラーピッカーのデザインについては知りません。また、根本的な問題がいくつかあります。まず明るい緑色を選択してから、色相をたとえば青色に変更してみます。色を濃くしたり、陰影を付けたりせずにnotが可能であることがわかります。通常のrgbモニターでは、飽和した緑と同じ明るさの飽和した青を生成せず、標準のrgbカラースペースが1つを表すこともできません。したがって、そのような場合、someある程度の妥協が必要になります。