App-Iconの作成

今回「Adobe Illustrator CC」を使用していますが、
ご自分の使いやすいツールで作るといいと思います。

##ダイエットのアプリアイコンを作ってみた。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/a57a7a27-2b65-119c-0b9f-beb1da6c9d00.png)

##完成形はこちら。
![Yasemed_app_icon_nishi_13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/d0353af7-5c52-3566-bd75-aead5e71c172.png)

##人間のからだを書いて行く。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/852184f9-aefc-f85c-c86b-c9dc589bedcd.png)

パスファインダで切り抜く
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/647af09c-4885-5cac-3a88-72e0d8b7b995.png)

切り抜き後
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/4ef5af9f-723a-88b5-90e1-47b5d2a6bdc6.png)

ダイレクト選択で、くびれを作る
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/6d5ed032-0fd4-eb9a-00c0-fafa7efbe3b7.png)

パスファインダで、まとめる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/07a13f9b-d37d-be0e-02ec-c0d9b2594e95.png)

まとめ後
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/d192f3d4-8cf1-df1f-8c48-83dab10bac51.png)

色んな円で切り抜いたり増やしたりを繰り返す。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/b93ef827-4868-caa4-762c-ee0a47a9703a.png)

良い感じになるまでやる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/62241852-153c-23ab-e30e-3634f5c93429.png)

微妙なガタツキはスムーズツールでならす。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/f1f53aad-bdbe-78cb-6d66-13fe30a7614b.png)

リフレクトツールで反転
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/4dece89e-a084-b6d3-df09-6defe7ccaadf.png)

色んな丸をかいてパスファインダ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/083b7122-95b7-e12d-347b-765f3833bfe2.png)

パスファインダの合体と交差を活用後
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/8a9b0fae-73c3-3e64-b76f-09094a4c4c14.png)

色を塗る
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/53a96ffd-59e9-a490-43a2-34e3ebe7b737.png)

ドロップシャドウをつける
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/e8bfc876-6db2-c8e5-bfd6-0d5565297df5.png)

グラデーションをつける。色選びが難しいようならネットに落ちてる画像を置き、スポイトで取る。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/7741839b-c98a-02cc-c0bf-bc1daa38d9f1.png)

背景を付ける。微妙にグラデとか付ける。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/f78168b3-9707-bf3a-d34a-d00f977cb4ce.png)

調整後
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/f5bf571c-aeed-2bb1-5bcb-a38043a155aa.png)

メジャーを作っていく。楕円形を加工して作る。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/59510e25-744e-2384-6d51-777d2576b45c.png)

斜めになるような切り取り用の図形を用意してパスファインダ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/cb9f75c9-d3de-1c40-6087-8298615631ea.png)

反転させて目盛りを書いて、クリッピングマスク
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/36c230fe-cfee-2e5a-86a9-f971347d84c1.png)

カラダの後ろに背景のメジャーを置く
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/c861c476-01d3-7a0e-34d7-95ef39fe28f1.png)

カラダの前にかぶせるメジャーを置く
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/6c535f1d-b216-7368-d1de-ac1fc8518e5f.png)

カラダに乗せるシャドウをコピペしてつくる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/72156d71-0a1b-f3fd-2a95-5074d4e8f9dc.png)

メジャー全体が背景に落とす影を作成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/92c2f494-7757-f41b-3b8a-53aa07b71fd3.png)

シャドウとかグラデは微妙に重ねたり減らしたりする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/bbe9cc1f-78a8-8e87-9549-7efad4dad4a5.png)

グリッドとマスクを外して(1024X1024)の「PNG」で保存する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/abe8c9d0-7a98-e008-4acd-b3c3e20beb16.png)

これでApp-Iconのできあがりです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/216132/e5f2f472-7f52-80d6-0a58-81c2121a490e.png)