超助かります!アプリ開発者目線で作られたiOS7 アイコン制作用のIllustratorテンプレート!

超助かります!アプリ開発者目線で作られたiOS7 アイコン制作用のIllustratorテンプレート!

104

@JUNP_Nです。僕が大好きなiPhoneアプリ「TiltShiftGen」などを作成している、fladdictさんがiOS 7用のアイコン作成テンプレートのIllustrator版を作ってくださっています。

開発者目線で作られたiOS 7のアイコン制作用Illustratorテンプレート

僕はアプリ開発者ではないのですが、アプリを作っている人ならではの視点だなと思うところがあったのでご紹介。

Ios7 icons template

すでにいくつか先行作成されたものがあるものの、ストアサイズ1024pxを基準としたものが多い。
だけどこのサイズは実機表示には都合がわるい。
120pxにリサイズするとデータが滲んでしまう。

そこでこのテンプレートでは、実機サイズ120pxの10倍スケールの1200px基準にしてみた。
10px単位で要素を配置すれば、パッキリとピクセルパーフェクトなアイコンになるはず。

via : iOS7用のアイコン製作テンプレート(ピクセル最適化済) | fladdict

こうゆう視点って大事ですよね。Photoshopのテンプレートってよく見かけるのですが、Illustratorのテンプレートって少ないし助かります。

そもそもPhotoshop使えないし持ってないし、Illustratorとか独学だから基本的なことわかってないしなのですが...

Ios7 icons template 2

テンプレートのダウンロードは以下の記事よりどうぞ。

via : iOS7用のアイコン製作テンプレート(ピクセル最適化済) | fladdict

男子ハックのロゴもiPhoneアプリっぽいので少し修正してみた

Ios7 icons template 4

男子ハックのアイコンも四角いし、iPhoneアプリみたいなイメージなので上記テンプレートを利用して四角のカーブだけでもと思い修正してみました。

多分誰も気づいていないはず(2013/6/15 19:00頃に変更済み)

Ios7 icons template 3

黄金比ガイドに合わせて眼鏡の位置とかも少しだけ変更。作業時間5分(手抜き。いつか時間とってちゃんとやる。)

完成したiOS 7仕様の男子ハックロゴがこちら。一見何が変わったの?という感じですよね。比べてみると全然違います。

Ios7 icons template 5

比較しやすいようにGIF動画にしてみました。全然違うのがわかってもらえたでしょうか。

ios7_icons_template

男子ハックの場合は自己満足ですが、アプリのアイコンの場合は死活問題です。(どなたかヒマな人がいたら男子ハックのアイコンを完全にiOS7対応してくれないかしら...)

iOSアプリ開発者の皆様iOS 7対応がんばってください。