Advertisement

11appleuikit

 

ついに公開されましたね、iPhone 4

これを機会に買い換えようと考えている方もいるのではないでしょうか。

iPhoneやiPad用に対応したウェブサイトやアプリなども増えています。

 

海外デザインブログWeb Design Ledgerで、iPhone、iPad用アプリ制作に便利なUIデザインキット11個をまとめたエントリー「11 UI Kits for iPhone and iPad Development」が公開されていたので、今回はご紹介します。

さっそく発売されたばかりのiPhone 4をデザインしたPhotoshop用PSDファイルも公開されていたので、追加しています。

 

 

iPhone, iPadアプリ制作に便利なUIデザインキットまとめ


 

 

iPhone 3G用:

 

iPhone GUI PSD 3.0

何度かご紹介している気もしますが、ユニークな壁紙デザインでも有名なiPhone 3G用PSDファイル。

こちらもパーツごとにレイヤー分けがされており使い勝手がとてもよいです。

iphone_kits_1

 

 

iPhone PSD Vector Kit

海外有名デザインブログSmashing Magazineが公開している品質の高いベクター素材をPhotoshopで利用することができるキット。

個人的によく利用させてもらっています。

iphone_kits_10

 

 

iPhone UI Vector Elements

Illustratorを利用するベクター素材なら拡大縮小も思いのままに行うことができます。

実際に使われているUIデザインそのままですね。

iphone_kits_3

 

 

Yahoo! Design Stencil Kit

デザインのモックアップに利用することもできるYahoo!が公開しているステンシルキット。

iphone_kits_2 

 

 

Ultimate iPhone Stencil for Omnigraffle

Macユーザーの方でOmnigraffleを利用する方にオススメのステンシルデザインキット。

iphone_kits_9

 

 

Free iPhone Toolbar Icons

iPhoneで利用されているシンプルなアイコンをモチーフにデザインされた、商用利用可能な160個のアイコンセット。

Photoshopを使うことで簡単にアイコンの色変更もできますよ。

iphone_kits_6

 

 

Free iPhone Toolbar Icons

こちらもミニマルですっきりとしたアイコンセットのひとつ。

各アイコンはPNGファイルとなっており、商用利用も可能となっている点もポイントです。

iphone_kits_7

 

 

 

 

iPad用:

 

iPad GUI Kit in PSD Format

Photoshopで編集可能なiPad用デザインキットです。

ボタンやキーボードなどそっくりそのまま再現されているので、必要なパーツを選んで使用することができます。

iphone_kits_11

 

 

iPad GUI PSD

Photoshopで編集可能なPSDファイルでデザインされたUIキットのひとつ。

こちらのエントリーで詳しく触れています。

iphone_kits_4

 

 

iPad Vector GUI Elements

もちろんiPadデザイン用Illustratorベクター素材も公開されていました。

ブラウザなどもデザインされているので、アプリ制作などにはもってこいです。

iphone_kits_5

 

 

iPad Stencil for Omnigraffle

Macユーザー限定となってしまいますが、Omnifraffle用ステンシルUIキットです。

テキストが実際入力されているので、レイアウトの参考になります。

iphone_kits_8

 

 

iPhone 4用:

 

参照元サイトにはまとめられていませんでしたが、今日公開されたばかりのiPhone 4もすでにPhotoshop用PSDファイルで公開されていました。

今後色々なデザイン用UIキットが公開されると思いますので、順次追加していこうと考えています。

 

Apple iPhone 4G .PSD

ホーム画面のみでなく、通話中画面や天気予報など色々なページが再現されています。

Apple_iPhone_4G__PSD_by_zandog

 

 

まとめ、追記事項


 

PhotoshopやIllsutratorでデザインするのは手描きでスケッチ、モックアップを行う方も多いのではと思います。

以下のエントリーを参考にしていただくと良いかもしれません。

 

印刷可能、UIデザインのモックアップ用無料スケッチPDFファイルまとめ

printpdf1

 

ウェブデザインのワイヤーフレーム作成に使えるオンラインツール10選まとめ

10wireframetool

 

iPhoneなどのモバイルデザインで見やすく使えるフリーフォント20個まとめ

20mobilefont

 

個人的に購入しようかどうしようか迷っていたのですが、以下の動画など見るとどうしても欲しくなってしまいますね。 

 

[参照元 : 11 UI Kits for iPhone and iPad Development – Web Design Ledger]