Hawk Vision — Dominant Colors Addon

Takehiko Ono
6 min readMar 3, 2022

Hawk Visionプラグインに、Vision AIによる高精度なドミナントカラー抽出機能を追加するアドオン、「Hawk Vision — Dominant Colors Addon」を公開しました。

Hawk Visionプラグインと併せて有効化することで、解析時に画像を構成するドミナントカラーの抽出を行い、被写体によりフォーカスした画像が持つ本来の支配色を露わにすることが出来ます。

一般的なドミナントカラー解析ライブラリによる抽出結果

画像のドミナントカラーの抽出はWordPressプラグインのみならず、PHPやJavaScript等プログラム内から扱える様々なライブラリが存在します。

しかし機械的な抽出には限界があり、画像を構成する面積の大きなエリアを強いドミナントカラーとしてピックアップしてしまうことは避けられません。

次の画像のドミナントカラーを機械的な手法で抽出すると、いずれも画像の多くを占める「背景」に引っ張られ、結果は背景の色を強く反映した構成となりがちです。

しかし上記の画像に関して言えば、画像本来の主役は言うまでもなく被写体である「人物」にあるのですが、その構成色がドミナントカラーの候補としてピックアップされない点には疑問が残ります。

Dominant ColorsアドオンによるAIを利用した抽出結果

これに対し、同じ画像をHawk Visionプラグイン + Dominant Colorsアドオンで行なった場合の結果が以下です。

Vision AIによってプログラムがその画像の被写体が何であるかを認識することができるため、抽出されるドミナントカラーも被写体に重点を置いた結果が返ります。かと言って画像の面積の多くを占める「背景」の色構成を無視してしまうこともなく、的確な抽出結果と言えると思います。

Dominant Colorsアドオンで得られるデータには、

  • 各色のドミナントカラーとしての強さを示す「Score」
  • 各色の画像中の使用率の高さ(=面積)を示す「Pixel Fraction」

の双方が含まれており、これは管理画面のインターフェース上で並び替え操作をし、比較可能にしました。

専用メソッド hawkvision_get_dominant_colors

各画像のドミナントカラーはデータベースに保存され、テンプレート中で専用メソッド hawkvision_get_dominant_colors を利用することでいつでも取り出すことが可能です。

Request

$dominant_colors = hawkvision_get_dominant_colors(array(
'post_id' => 123,
'force_extract' => true
));

Return

Array
(
[status] => success
[dominant_colors] => Array
(
[0] => Array
(
[id] => 776
[post_id] => 252
[color_r] => 227
[color_g] => 30
[color_b] => 28
[hex] => e31e1c
[pixel_fraction] => 0.00673333
[score] => 0.236978
[percent] => 43.8721
)
[1] => Array
(
[id] => 777
[post_id] => 252
[color_r] => 165
[color_g] => 31
[color_b] => 33
[hex] => a51f21
[pixel_fraction] => 0.00406667
[score] => 0.0592024
[percent] => 10.9603
)
[2] => Array
(
[id] => 778
[post_id] => 252
[color_r] => 198
[color_g] => 196
[color_b] => 198
[hex] => c6c4c6
[pixel_fraction] => 0.0618
[score] => 0.0549452
[percent] => 10.1721
)

)
)

詳しくは公式サイトのDocsを参照いただければと思います。

--

--

Takehiko Ono

💻 Web Design and Develop @ aguije inc. / 🏄‍♂️ Pro Web Surfer / ≡ adidas SAMBA / 📸 Fujifilm / 🚲 VanMoofer / 🎮 Nintendo Addict