歴代iPhoneのモックアップ素材まとめ|無料PSD(iPhone3GS〜iPhone6)

素材 & フォント

先日iPhone6とiPhone6 Plus(プラス)が発表されて何かと世間を賑わしていますが、今回の目玉は5.5インチという大画面サイズのiPhone6 Plusみたいで、既に予約が殺到して出荷が遅れる見通しになっているみたいですね。

ちょうど一年前にiPhone5Sを購入した自分としては今回は完全にスルーしているのですが、とは言いつつもiPhone6発売記念(めでたい!)ということで、歴代iPhoneのモックアップ素材をまとめてみました。 

 

iPhone6

f:id:lord_cashew:20140914195855j:plain

 

iPhone5S

f:id:lord_cashew:20140914195921j:plain

 

iPhone5C

f:id:lord_cashew:20140914200000j:plain

 

iPhone4s

f:id:lord_cashew:20140914200050j:plain

 

iPhone4

f:id:lord_cashew:20140914200140j:plain

 

iPhone3GS

f:id:lord_cashew:20140914200217j:plain

 

個人的な感想

iPhone3GSの丸々っとしたデザインが懐かしいですねー。2009年の発売なのでかれこれ5年前なんですねー。

そういえばiPhone6は角丸な感じのデザインになっているみたいですが、個人的にはiPhone5Sとかの角っとしたデザインの方が好みだったりします。とか言いつつ、しばらく見続けていると「これはこれでいいかもなー」とか思ってしまうような気がするので、要するに慣れの問題なのかもしれませんね。

 

iPhone 6 Plus ケース, Spigen® [ スタンド機能 ] ウォレット S レザー 手帳型 ケース Apple iPhone (5.5) アイフォン 6 プラス カバー (国内正規品) (ブラック 【SGP10918】)

iPhone 6 Plus ケース, Spigen® [ スタンド機能 ] ウォレット S レザー 手帳型 ケース Apple iPhone (5.5) アイフォン 6 プラス カバー (国内正規品) (ブラック 【SGP10918】)

  • 出版社/メーカー: Spigen
  • メディア: Wireless Phone Accessory
 

 

モックアップ素材とは?

モックアップとは、スマホやPCの枠の中に自分のデザインをはめ込んで、実際の製品に表示されているように見せるための素材のことです。アプリの画面やWebサイトのデザインを「本物のiPhoneに映っている状態」で見せられるので、提案資料やポートフォリオ、SNS投稿などで説得力が一気に高まります。

  • PSD形式:Photoshopで画面部分を差し替えやすく、自由度が高い
  • ベクター形式:拡大しても劣化せず、サイズ変更に強い
  • スマートオブジェクト対応:自分の画像を流し込むだけで合成できるものは作業が速い

モックアップ素材の選び方

配布サイトは数多くありますが、選び方を押さえておくと作業がスムーズです。見た目だけで選ばず、使いやすさとライセンスを意識しましょう。

  • 角度・構図:正面(フラット)は差し替えが簡単、斜めや手持ちは雰囲気が出る
  • 解像度:印刷や大きく見せる用途なら高解像度のものを選ぶ
  • 差し替えのしやすさ:スマートオブジェクト対応だと画面の入れ替えが一瞬で済む
  • ライセンス:商用利用やクレジット表記の要否を配布元で必ず確認する

こんなシーンで役立つ

  • アプリやWebサイトのデザイン提案・プレゼン資料
  • ポートフォリオで制作実績を魅力的に見せる
  • ブログやSNSでアプリ・サービスを紹介する
  • ストアやLPのキービジュアル制作

使うときの注意点

  1. ダウンロード前にライセンス(商用可否・クレジット要否)を確認する
  2. 旧機種のモックアップは画面比率が現行と異なるため、用途に合うか確認する
  3. 枠(ベゼル)のデザインが古いと、最新感を出したい用途では合わないことがある
  4. 差し替える画像は枠のサイズに合わせ、引き伸ばして粗くならないようにする

よくある質問

古い機種のモックアップを今使う意味はありますか?

懐かしさを演出したい記事や、当時のアプリ・デザインを紹介する用途では今でも有効です。一方で最新製品を見せたい場合は、画面比率やデザインが現行と異なる点に注意してください。

モックアップは商用利用できますか?

素材によって異なります。商用利用可か、クレジット表記が必要かは配布元のライセンスで必ず確認しましょう。無料でも条件付きのことがあります。

Photoshopがなくても使えますか?

PSD素材は基本的にPhotoshopなどの対応ソフトが必要です。PNGなどの画像素材や、対応する無料・代替ソフトを使えば扱える場合もあります。

まとめ

歴代iPhoneのモックアップ素材は、当時のデザインを振り返る楽しさだけでなく、提案資料やポートフォリオを魅力的に見せる実用ツールでもあります。選ぶ際は角度・解像度・差し替えのしやすさ、そして何よりライセンスを確認することが大切です。用途に合った素材を選び、自分のデザインを“本物のように”見せて、表現の幅を広げてみてください。

関連記事

この記事を投稿した人
おしブロ管理人

Web発掘ブロガー。知る人ぞ知る、ちょっと面白くてちょっと便利なWebツール・サービス・レトロデジタルを"発掘"して紹介しています。大手が扱わないニッチな隙間を掘って、「これ面白い!」「やってみたい!」をお届け。

おしブロ管理人をフォローする
素材 & フォント