コンテンツにスキップ

主要色の抽出 (ExtractKeyColors)

概要 (What is it?)

ExtractKeyColors ノードは、画像を分析し、K-Means クラスタリングまたはメディアンカット（MMCQ）アルゴリズムを使用して最も支配的な主要色を抽出します。画像内での出現頻度順に自動ソートし、抽出された色ごとに動的なカラーピッカーパラメータを生成するため、カラーパレット作成、ブランド分析、デザインワークフローに最適です。

使用する場面 (When would I use it?)

以下のような場面でこのノードを使用します：

  • デザインプロジェクト用に画像からカラーパレットを生成したい場合
  • ロゴやマーケティング素材の支配的な色を分析したい場合
  • 画像からブランドカラーを抽出したい場合
  • 画像の内容に基づいて調和のとれたカラースキームを作成したい場合
  • 色に基づいた画像フィルタやエフェクトを構築したい場合
  • ビジュアライゼーションプロジェクト用のカラーデータを生成したい場合
  • 写真の色彩分布を分析したい場合
  • 視覚的な参考画像からデザインシステムを構築したい場合

使い方 (How to use it)

基本セットアップ

  1. ワークフローに ExtractKeyColors ノードを追加します
  2. 画像ソースを "input_image" 入力に接続します
  3. 抽出したい色の数（num_colors）を設定します
  4. 抽出された色が動的なカラーピッカーパラメータ（color_1, color_2 など）として利用可能になります

パラメータ一覧 (Parameters)

画像入力 (Image Input)

  • input_image: 分析する対象の画像（他の画像ノードから接続可能）
    • 一般的なフォーマット（JPG, PNG, GIF, BMP, TIFF, ICO, WEBP）をサポート
    • ImageArtifact または ImageUrlArtifact を受け付け
    • ファイルブラウザ連携による直接選択も可能

カラー設定 (Color Settings)

  • num_colors（2〜12、デフォルト: 3）: 抽出する色の数

    • スライダーによる直感的な操作
    • 支配度（頻度が高い順）に自動整列
    • 抽出された各色が個別に出力パラメータとして生成されます

  • algorithm（デフォルト: kmeans）: 使用する色抽出アルゴリズム

    • kmeans: 正確な色のグループ化を行う K-Means クラスタリング
    • median_cut: 色空間をバランスよく分割する改良版メディアンカット量子化（MMCQ）

出力 (Outputs)

抽出された色ごとに動的なカラーピッカーパラメータが生成されます：

  • color_1, color_2, ...: 16進数カラーコード（#RRGGBB）
    • 各パラメータに対話型のカラーピッカー UI が付属
    • 出現頻度順（最も支配的な色が最初）に整列
    • プロパティパネル（Properties panel）で確認可能
    • 色処理を行う他のノードに接続可能

使用例 (Example)

一般的なカラーパレット抽出ワークフローの例：

  1. LoadImage または GenerateImage を使用して画像を読み込み、または生成します
  2. その画像を ExtractKeyColors ノードの "input_image" パラメータに接続します
  3. 上位 5 つの主要色を抽出するために num_colors を 5 に設定します
  4. ノードが画像を解析し、5 つのカラーパラメータを生成します：
    • color_1: 最も支配的な色（出現頻度最高）
    • color_2: 2 番目に支配的な色
    • color_3: 3 番目に支配的な色
    • 以下同様...
  5. プロパティパネルで抽出された色を確認します
  6. これらのカラー出力を他のスタイル調整ノード等に接続して利用します

重要な注意点 (Important Notes)

  • アルゴリズムの選択: 知覚的に正確な KMeans と、バランスの取れた色空間分割を行う Median Cut から選べます
  • 自動ソート: 画像内でのピクセル出現頻度に基づいて自動的に降順ソートされます
  • 色の多様性: 両アルゴリズムとも、代表的で互いに識別しやすい色が抽出されるよう配慮されています
  • 動的パラメータ: 要求した色の数（num_colors）だけ過不足なく出力パラメータが生成されます
  • リアルタイム処理: 入力画像が変更されると即座に色が再計算されます
  • Hex 形式: すべての色は標準的な 16 進数コード（#RRGGBB）で出力されます

よくある問題 (Common Issues)

  • 色が少なすぎる: num_colors スライダーの値を増やしてください
  • 似たような色が抽出される: KMeans は多様性を保ちますが、元画像全体のトーンが均一な場合は似たトーンが抽出されることがあります
  • 処理時間が長い: 非常に高解像度な画像では、Median Cut の方が KMeans より高速に処理できます

技術的な詳細 (Technical Details)

このノードは以下の高度な色抽出プロセスを実行します：

  1. 画像変換: 入力画像を PIL Image に変換し、RGB 色空間を確保
  2. アルゴリズムの実行:
    • KMeans: scikit-learn の K-Means クラスタリングを使用し、視覚的な類似性に基づいてピクセルをクラスター化。各クラスターの代表色を決定し、クラスターサイズ（ピクセル数）順にソート
    • Median Cut (MMCQ): 色空間を反復的にバケット分割し、常に最大の色範囲を持つバケットを分割。指定された色数に達した時点で各バケットの平均色を決定
  3. 頻度分析とソート: 抽出された色をピクセル頻度順にソート
  4. 動的 UI 生成: 各色に対応するカラーピッカーパラメータを動的に構築

アルゴリズムの特徴

  • KMeans アルゴリズム:
    • 人間の知覚に基づく高精度なクラスタリング
    • 明確に色が分かれている画像やグラデーションに最適
  • Median Cut アルゴリズム:
    • 色空間の均等でバランスの取れた代表色の選択
    • 大きな画像でも高速に動作