About

--About this site

dropくん

iOSアプリのアイコンギャラリーです。
アイコンのサンプルが大量に欲しくなったので作ってみました。アプリ開発者の方、デザイナーの方、アイコンデザインの参考に是非どうぞ。 iPhoneユーザーの方で、おしゃれなアイコンでホーム画面を彩りたい方のアプリ探しにもピッタリだと思います!

内容の不備やご意見・ご感想はxxmiz0rexx@gmail.comまで。
サイトについて詳しくは「このサイトについて」を御覧ください。

--Author

xxmiz0rexx

@xxmiz0rexx( Google+)
ウェビメモというWEB関連のブログをやっています。

WEBクリエイターとしてお仕事を請け負っていますが、 最近アプリデザインのお仕事もしています。個人PJでFeedDropというニュースフィードアプリをリリースしました。(詳しくはこちら

336
app

[iOS7]アプリアイコンを作る時に役立つグリッド付きpsd『iOS7 Icon Template』

Posted on 2014/03/19

真新しいわけじゃないのですが、 Dribbbleで使いやすそうなアイコンキットを見つけたのでご紹介します。

『iOS7 Icon Template』

iOS7 Icon Template』はグリッド付きのアイコンキットで、 iTunesArtworkを始め、アプリ作成時に必要になる諸々のアイコンサイズを合計10種類カバーしております。iPadにも対応。

使い方

サイトからDLしたpsdを開くと、レイヤーの一番上に『Edit & Save』というスマートオブジェクトがあるので、ダブルクリックでそれを編集していきます。

スマートオブジェクトを編集

グリッドの中に収まるようにオブジェクトを配置したり、背景などもろもろ細部を作りこんだら、グリッドレイヤーを非表示にしてから保存して閉じましょう。psdファイルの方に戻ると、いま作ったアイコンが各サイズごとに並んでいます!どじゃ〜ん。

スマートオブジェクトを保存すると反映される

便利便利。
使わないサイズもあると思うので、自分が必要なサイズのアイコンを選んで書き出しましょう。試しに1つ書き出してみたよ。

iTunesArtwork

ちなみに、psdの他にSketchのファイルもサイトからダウンロードできるようです。

ファイル名の一覧表

あと最後に各アイコンにつけるべきファイル名の一覧をををを。自分用メモ。

アイコンファイル名
サイズ ファイル名 備考
29px icon-small.png 設定用アイコン
58px icon-small@2x.png 設定用アイコンRetina
40px icon-small-40.png Spotlight用アイコン
80px icon-small-40@2x.png Spotlight用アイコンRetina
120px icon-60@2x.png iPhone用アイコンRetina
76px icon-76.png iPad用アイコン
152px icon-76@2x.png iPad用アイコンRetina
512px iTunesArtwork iTunesArtwork用アイコン
1024px iTunesArtwork@2x iTunesArtwork用アイコンRetina

iPhoneアプリの場合はiOS7対応している非Retinaデバイスが今のところないため@2xサイズのみでOKです。

PageTop

PageTop