ボタンの色を選ぶ方法は何ですか？
これはさまざまなスレッドで議論されていることに気付きましたが、多くの場合、トピックがいくつかのアクションにのみセグメント化されていることがわかりました。つまり、保存してキャンセル、または正/負の関係。
私が尋ねていることは、ボタンの色を選択するための全体的なシステム全体の戦略は何ですか？例：「ポジティブ」アクションの色が緑で、「破壊的/ネガティブ」アクションの色が赤の場合、「追加」アクションにはどの色を選択しますか？あなたはそれを前向きな行動だと思いますか？または、それは中立的な行動ですか？ 「詳細」ボタンはどうですか？ 「編集」ボタン？
ユニークなブランド/サイトの色である「プライマリ」ボタンの色（明るいオレンジとしましょう）があるとします。明るいオレンジ色のボタン、たとえばニュートラル（灰色）または正の緑色を使用するのはいつですか。それとも、すべてのポジティブアクションカラーをブランドカラーに置き換えますか？
ボタンの色は、コンテキスト/ビューまたはその画面の必要性（コントラスト、重要性などを作成するため）に基づいて選択しますか、それとも、製品/サイト全体で一貫して、例外なく、それを調整しますか？
あなたの考えを共有してくれてありがとう、そしてうまくいけば私は誰も混乱させていません。
アクションには標準の「プライマリ」「セカンダリ」「他の場所へのリンク/エスケープ」を使用し、赤と緑は使用しません。赤と緑が使用されない理由は、間違ったものを意図せずに強調してしまう可能性があるためです。
例えばアイテムを削除するためのボタンがあります。これは一般的なアクションではありませんが、赤にすると、画面に引き寄せられるのはこれだけです。それは破壊的であるため、それでも確認モーダルまたは元に戻す機能を配置する必要があります。したがって、赤はページフローを妨げる不要な混乱です。
ポジティブアクションにグリーンを使用する場合も同様です。
例えば「追加」に緑を使用するとします。画面に、追加できるアイテムが複数あるとします。アイテムの種類が異なる場合もあれば、同じアイテムであるが、リストを編集しているために位置が異なる場合もあります。これらの追加ボタンに緑を使用すると、どこにでも緑が見つかるため、乱雑になります。強調は、コントラストを付けて選択的に適用した場合にのみ機能します。
標準に固執し、単一の最も一般的なアクションをプライマリ、他のアクションを明るいセカンダリカラーにすることをお勧めします。ウェブインターフェースを使用している場合、リンクは「キャンセル」またはその他の「エスケープ」タイプのアクションで機能し、セカンダリアクションからさらに強調されない場合があります。
ボタンの色は、コンテキスト/ビューまたはその画面の必要性（コントラスト、重要性などを作成するため）に基づいて選択しますか、それとも、製品/サイト全体で一貫して、例外なく、それを調整しますか？
どちらも。すべての製品/サイトのデザイン全体で一貫している場合、「その画面」は他の一般的なデザインを共有するため、結果としてボタンもすべての画面で一貫します。
「ポジティブ」アクションの色が緑で、「破壊的/ネガティブ」アクションの色が赤の場合、「追加」アクションにはどの色を選びますか？
ここでは、デザインを逆に考えています。IMOの方法は、UIに使用する色のセットを最初に考え、次にだけです、「ポジティブ/ネガティブ」カラーを適用することが一般的なインターフェースに適している/視覚的に互換性があるかどうかを判断します。
インターフェースが暗黙の意味を持つボタンに色を使用する場合（赤/緑の場合）、中間色を使用できます（たとえば、無彩色、またはそれほど重要ではないアクションを区別するために、色のセットに応じて区別される人）。 Facebookの例：
ただし、アクションボタンを色で区別する必要はありません。メッセージとボタンのテキストをどのように表現するかが重要だと思います。これを見てください：
アクションの結果は明確ではないので、ボタンの色を好きなように変更しても、問題は解決しません。
あなたのサイトのデザインが「あなたに許可する」場合、ボタンのアクションの知覚を強化する色の区別を行うことができます。もちろん、同じ色、しかし、色が違っていても、それは大きな問題ではありません。