Entries

iTunes11のアルバム情報表示に使われるオシャレアルゴリズムを考える

iTunes11がリリースされましたね。賛否両論を呼びそうな大変更。

このiTunes11、アルバム選択時の情報画面がもの凄く凝ってる。なんとアルバムジャケットにあわせて情報の色が変化するんよ!! 何これオシャレ!



どういうアルゴリズムになっているのか、とっても気になる。

仮定としては、

  • ジャケットを16〜32色程度で減色、パレット抽出する。
  • 四辺のエッジに含まれる色から、最多ピクセル色を背景に採用。
  • 残りの色の中で、背景色と一定距離(RGB or 色相)がある最多ピクセル色を文字色1として採用。
  • 残りの色の中で、背景色と一定距離(RGB or 色相)がある最多ピクセル色を文字色2として採用。
  • どうしても適切な色がない場合、白か黒を文字色に採用。
  • アルバムの四隅に対し、背景色でインナーシャドーをかける

という感じかなと。多分これであってる。

アルゴリズムで文脈にあった綺麗な配色を作るっていうのは、なかなか制御が難しくて面倒いのだけど、このやり方はスマートだなぁと感じたのでメモ。
誰かwonderflかjsdo.itで検証してくれないかな??

<追記>
ブログ書いたら、@y_imayaさんがjsdo.itで検証コード書いてくれた!! 多謝多謝。 だいたいそんな感じだと思う。
200pxぐらいのジャケット画像を下のjsにロードすると動作が確認できるです。