↑　クリックで拡大します。

今回は、フォトショップでプロ仕様のiPhoneアプリサイトを作る方法をご紹介します。

グリッドを使い、統一性のある色使いでシンプルでまとまったウェブレイアウトとなっており、メインであるiPhoneが目立ちます。

これからiPhoneアプリ用サイトを作成しようとしているひとは必読の内容です。

今回、このチュートリアルより学ぶことのできるテクニックは

・ グリッドを使ったすっきりとしたウェブレイアウト方法

・ 型押し風ボタンの作成方法

・ 絶妙なグラデーションのテキストエフェクト

・ 立体的でクリックしたくなるボタンの作成方法

・ ロゴなどに使える、文字の一部をハートで表す方法

などがあります。

詳細は以下から。

iPhone画像にお好みの画像を挿入する方法は知っておくと便利ですよ。

本当にボタンを押したような「型押し」ボタンの作り方も学ぶことができます。

原色そのままのテキストを使わずに、微妙なテキストエフェクトを加えることで、デザイン性が格段にあがります。

こんな魅力的なボタンの作り方はぜひ覚えておきたいところです。

このチュートリアルでは、型となる枠組みをFireworksを使って作成しているようです。

→ Build a Promotional iPhone App Website Wireframe in Fireworks