Adaptive Icon まとめ (デザイナー向け)

Adaptive Iconとは、Android 8.0（API レベル 26）から利用できるアイコンです。
今までAndroidはアイコンの形が自由に設定できたのですが、
Android 8.0からは全て同じ形に統一するデザインになり、まとまりができました。

形が統一されたという点でiOSと同じようになりましたが、Adaptive Iconは
・円、正方形、角丸正方形など何種類かカスタマイズ可能。
・スクロールの際はアニメーションがつく。
（Foreground、Background２枚の画像を組み合わせて動きをつける）
ということができます。iOSより少し自由な感じがします。

そこで実際に作成してみました。

Adaptive IconはForeground Image＋Background Image（またはカラーコード）で作成されます。
その上に設定した形にマスクされます。
機種によって微妙に違いますが、基本的には下記になります。

これを踏まえ実際に作成してみます。

作成したら、Foreground、Backgroundのレイヤーに分けます。
地球モチーフ全体が動くパターン(左)と、円形のマスクが動くパターン(右)を作ってみました。

実際に動かすとこんな感じ

アニメーションは下記のサイトで確認できるので、微調整していきます。

https://adapticon.mariusclaret.com/

完成したらパーツを作っていきます。
当たり前ですが、SVGやカラー指定の場合は全サイズ作る必要はありません。

これで終了です！！
動きは指定できませんが、デザインによっては面白いものができるかと思いました。

参考
https://developer.android.com/guide/practices/ui_guidelines/icon_design_adaptive?hl=ja