ポートフォリオの作り方をゼロから徹底解説

【無料・最新】高品質なiPhoneのモックアップ素材77選【PSD・AI】

この記事を読むのに必要な時間は約 44 分です。

Photoshop(フォトショップ)やIllustrator(イラストレーター)で使える無料のiPhoneのモックアップを77点紹介します。

レイヤー分けされたPSDとAIなので編集が容易!
リアルなiPhoneからフラットデザインのiPhone、手に持ったiPhone等、必要な素材が見つかるでしょう。

デザイン用の素材、サイトやアプリのデザインカンプをはめ込める為の素材など、様々な用途に使えます。
では早速紹介していきます!

Photoshop(PSD)形式

Photoshop(フォトショップ)のPSD形式で作られたiPhoneのモックアップです。
世代が新しい順に、古いものは4Sまで掲載しています。
レイヤー分けされているので楽々編集が可能です。

Photoshopを導入しましょう
PSDを編集するにはPhotoshop(フォトショップ)が必須です。
まだPhotoshopが未導入の方はAdobe公式サイトから入手しておきましょう。

iPhone 12

Psd iPhone 12 Mockup Set

汎用性の高いiPhone12の正面モックアップです。
5色のフレームが用意されており、クオリティも非常に高いです。
商用利用可能。

ダウンロード

Gravity Psd iPhone 12 Mockup Set

斜めアングルのiPhone12のモックアップです。
商用利用可能

ダウンロード

Isometric Psd iPhone 12 Mockup Set

斜め上から見下ろしたアングルのiPhone12モックアップです。
こちらも商用利用可能です。

ダウンロード

Perspective Psd Iphone 12 Mockup Set

パースビューのiPhone12モックアップです。
商用利用可能。

ダウンロード

iPhone 12 Pro Mockup

細部まで作り込まれたiPhone122Proのモックアップです。
Proなので微妙に通常のiPhone12と違います。

ダウンロード

Perspective Psd Iphone 12 Pro Mockup Set

パースビューのiPhone12Proのモックアップです。
商用利用可能。

ダウンロード

Psd iPhone 12 Pro Mockup Set

正面から見たiPhone12Proのモックアップです。
細部まで作り込まれたPSDです。
商用利用可能。

ダウンロード

iPhone 11

Psd iPhone 11 Pro Mockup Set

汎用性の高い正面アングルのiPhone11のモックアップです。
PSD形式なのでPhotoshopが必要です。未導入の方はAdobe公式サイトから入手しておきましょう。
商用利用可能。

ダウンロード

Free iPhone mockup set, 11 Pro edition

ハイクオリティなiPhone11のモックアップです。
シルバー、スペースグレイ、ミッドナイトグリーン、ゴールドの4色が収録されています。

ダウンロード

iPhone XI Clay—a free minimalist mockup

ミニマルデザインで作成されたiPhone11のモックアップです。

ダウンロード

Isometric iPhone 11 Pro Max Mockup

裏面もしっかりと作り込まれたiPhone11のモックアップです。
商用利用可能。

ダウンロード

iPhone X

Psd iPhone XS Mockup Isometric

商用利用可能なiPhoneXSのモックアップです。
非常に再現度の高いフレームの質感が良いです。

ダウンロード

Psd iPhone XS Max Mockup Vol1

汎用性の高いiPhoneXS Maxのモックアップです。
商用利用可能です。

ダウンロード

Psd iPhone XS Max Mockup Vol2

iPhone XS Maxの縦向けモックアップです。
こちらも商用利用可能です。

ダウンロード

Psd iPhone XS Max Mockup

汎用性の高い正面アングルのiPhone XS Maxのモックアップです。
商用利用ができます。

ダウンロード

Psd iPhone XR Mockup Isometric Vol1

iPhone XRのモックアップです。
フレームの質感再現が見事です。
商用利用可能。

ダウンロード

Psd iPhone XR Mockup Isometric Vol2

色違いのiPhoneXRのモックアップです。
こちらも商用利用可能です。

ダウンロード

Psd iPhone XR Mockup Isometric Vol3

縦向けのiPhone XRのモックアップです。
無料で商用利用ができます。

ダウンロード

Psd iPhone XR Mockup Isometric Vol4

色違いの縦向けのiPhone XRのモックアップです。
無料で商用利用ができます。

ダウンロード

Psd iPhone XR Mockup

汎用性の高い正面アングルのiPhone XRのモックアップです。
ハイクオリティなのに無料&商用利用可能。

ダウンロード

iPhone XR Mockup – Free

iPhone XRの正面アングルモックアップです。
6色のフレームが用意されています。
PSD形式で楽々編集!

ダウンロード

UI Psd iPhone X Monochrome

無料&商用利用可能なiPhoneXのモックアップです。
編集にはPhotoshopが必要なので未導入の方はAdobe公式サイトから入手しておきましょう。

ダウンロード

iPhone X Psd Mockup Isometric

正面アングルのiPhoneXのモックアップです。
汎用性が高い素材で商用利用可能です。

ダウンロード

iPhone X Free Mockup PSD

充電器の上に浮かれたiPhoneXのモックアップです。
日常に利用シーンが再現できます。

ダウンロード

New iPhone X Hands Mockups

手に持ったiPhoneXのモックアップです。
アプリやWebサイトのデザインカンプをはめ込んだり、様々な用途で使えます。

ダウンロード

iPhone SE

iPhone SE Psd Mockup

iPhone SEのモックアップです。
正面アングルで使い勝手が良い素材です。
Photoshopが必須なのでAdobe公式サイトから入手しておきましょう。

ダウンロード

Apple iPhone SE Mockup PSD

シンプルな質感のiPhoneSEのモックアップです。
無料でPSDをダウンロードできます。

ダウンロード

iPhone SE PSD mockup

手に持ったiPhoneSEのモックアップです。
簡単に画面を差し替える事ができるので誰でもリアルな利用シーンが再現可能。

ダウンロード

iPhone SE mockup

こちらも手に持ったiPhoneSEのモックアップです。
コンパクトな端末ですね。

ダウンロード

iPhone 8

iPhone 8 Mockup

iPhone8のモックアップです。
細部まで質感再現がされており、非常にクオリティが高い仕上がりです。

ダウンロード

iPhone 8 Mockup PSD Freebie

正面から見たiPhone8のモックアップ素材です。
PSD形式なのでフォトショップが必須です。未導入の方はAdobe公式サイトから入手しておきましょう。

ダウンロード

Free iPhone 8 mockup

リアルな質感の黒いiPhone8用モックアップです。

ダウンロード

iPhone 8 Gold Mockup

ゴールドのiPhone8のモックアップです。
縦向けのアングルで使えます。

ダウンロード

Free iPhone 8 Mockup For Screens Display

iPhone8の本体と画面のモックアップです。
画面が別で用意されています。

ダウンロード

iPhone 8 Plus Design Mockup

iPhone8Plusのモックアップです。
光沢感のある質感の再現度が抜群ですね。

ダウンロード

iPhone 8 Plus in Hand Free Mockup

手に持ったiPhone8Plusのモックアップです。
もちろん無料でPSDがダウンロードできます。

ダウンロード

Free iPhone X + iPhone 8 PSD Mockups

iPhoneXとiPhone8のモックアップのセットです。
どちらも正面アングルで使い勝手が良いです。

ダウンロード

Floating white iPhone 8 Mockup

斜めから見た白いiPhone8の端末モックアップです。
無料で利用ができます。

ダウンロード

Free Tilted iPhone 8 Mockup

黒いiPhone8のモックアップです。
Photoshopがあれば簡単に編集ができます。

ダウンロード

Black iPhone 8 Mockup

正面から見た黒いiPhone8のモックアップです。
リアルな質感で高級感があります。

ダウンロード

iPhone 7

iPhone 7 Psd Mockup Vector

iPhone7のモックアップです。
編集にはPhotoshopが必要、Adobe公式サイトから入手しておきましょう。

ダウンロード

iPhone 7 Psd Jet Black Mockup

ジェットブラックのiPhone7のモックアップです。

ダウンロード

iPhone 6

3D iPhone 6 Plus Psd Vector Mockup

iPhone6Plusのモックアップです。
個人的にはiPhone6が好みです。

ダウンロード

3-4 iPhone 6 Plus Psd Vector Mockup 2

縦向きのiPhone6Plusのモックアップです。
無料でPSDがダウンロードできます。

ダウンロード

3-4 iPhone 6 Plus Psd Vector Mockup

先のモックアップと逆向けのiPhone6Plusのモックアップです。

ダウンロード

iPhone 6s Psd Rose Gold Mockup

ローズゴールドのiPhone6S用モックアップです。
正面アングルです。

ダウンロード

Flat Psd iPhone 6 & 6s Mockup

フラットな質感のiPhone6とiPhone6Sのモックアップです。
Photoshopがあれば編集可能です。

ダウンロード

3D View iPhone 6 Psd Vector Mockup

iPhone6用のモックアップです。
今でもiPhone6を使っている方は多いです。

ダウンロード

3-4 iPhone 6 Psd Vector Mockup Part 2

縦向けのiPhone6用のモックアップです。
PSDが無料でダウンロードできます。

ダウンロード

3-4 iPhone 6 Psd Vector Mockup

先の素材とは逆アングルの縦向けiPhone6用のモックアップです。

ダウンロード

3-4 iPhone 6 Psd Vector Mockup

正面アングルのiPhone6用モックアップ素材です。
PSDが無料でダウンロードできます。

ダウンロード

iPhone 5

3-4 iPhone 5C Psd Vector Mockup

iPhone5Cのモックアップです。
PSDを編集するにはフォトショップが必要です。未導入の方はAdobe公式サイトから入手しておきましょう。

ダウンロード

3D View iPhone 5C Psd Vector Mockup

アングル違いのiPhone5Cのモックアップです。

ダウンロード

iPhone 5C Psd Vector Mockup

使い勝手の良い正面アングルのiPhone5C用モックアップです。

ダウンロード

iPhone 5S Psd Flat Design Mockup

iPhone5Sのモックアップです。
フラットデザインで作られているので様々な用途に合います。

ダウンロード

3D View iPhone 5S Psd Vector Mockup

質感が見事に再現されたiPhone5S用のモックアップです。

ダウンロード

iPhone 5S Psd Vector Mockup

正面アングルのiPhone5S用モックアップです。
PSD形式なので編集が容易にできます。

ダウンロード

3-4 iPhone 5S Psd Vector Mockup

斜めアングルのiPhone5S用モックアップです。

ダウンロード

iPhone 5 Psd Flat Design Mockup

フラットデザインで作られた使い勝手の良い正面アングルのiPhone5用モックアップです。

ダウンロード

iPhone 5 Psd Landscape Mockup

ランドスケープ(横向け)のiPhone5用モックアップです。
カラーは黒です。

ダウンロード

3D iPhone 5 Psd Vector Mockup v2

斜めアングルの白いiPhone5用モックアップです。

ダウンロード

3D View iPhone 5 Psd Vector Mockup

斜めアングルの黒いiPhone5用モックアップです。

ダウンロード

iPhone 5 Psd Vector Mockup

正面アングルのiPhone5用モックアップです。
白黒の2色セットです。

ダウンロード

3-4 View iPhone 5 Psd Vector Mockup

斜めアングルのiPhone5用モックアップです。
白黒の2色セットです。

ダウンロード

iPhone 4

iPhone 4s Psd Vector Mockup Template

iPphone4s用モックアップです。
かなり古い端末なので使っている方を見る事は稀です。

ダウンロード

Illustrator(AI)形式

Illustrator(イラストレーター)形式のiPhone用モックアップ素材です。
ベクター形式なので拡大・縮小を行っっても劣化が起きません。

Illustratorを導入しましょう
AIを編集するにはIllustrator(イラストレーター)が必須です。
まだIllustratorが未導入の方はAdobe公式サイトから入手しておきましょう。

FREE iPhone X Illustrator Wireframe Mockup

AI形式のiPhoneX用モックアップです。
無料でダウンロードできます。

ダウンロード

Free Vector Apple iPhone 7 Jet Black Mock-up In Ai & EPS Format

ジェットブラックのiPhone7用モックアップです。
AI形式の素材が無料でダウンロードできます。

ダウンロード

Apple iPhone 6s & Plus Vector Mockup

iPhone6Sのモックアップです。

ダウンロード

Apple iPhone 6 & Plus Vector Mockup

iPhone6のモックアップです。
全てIllustratorで作られています。

ダウンロード

Free Vector Apple iPhone 6 Mockup In Ai & EPS Format

AIとEPS形式のiPhone6用モックアップです。

ダウンロード

iPhone 6s PLUS FRONT AND ANGLED PSD + AI VECTOR MOCKUP

正面と斜め左右のiPhone6SPlus用モックアップです。

ダウンロード

Freebie: iPhone 6 Flat Vector Mockup

フラットデザインで作られたiPhone6用のモックアップです。
ベクター画像なので編集しても劣化が起きません。

ダウンロード

Flat iPhone 6 mockup

フラットな質感の黒いiPhone6用のモックアップです。

ダウンロード

iPhone 6 – Illustrator Download

iPhone6のIllustrator用モックアップです。
AI形式なのでイラストレーターが必須です。未導入の方はAdobe公式サイトから入手しておきましょう。

ダウンロード

iPhone 6 mockup + wireframe – AI

iPhone6のイラレ用モックアップです。
カラーは黒です。

ダウンロード

iPhone 6 – 4.7” vector for Wireframes

iPhone6のイラレ用モックアップです。
カラーは白です。

ダウンロード

商用利用可能な高品質テンプレート

商用利用ができる高品質なAdobeStockのデザインテンプレートを厳選しました!
制作時間を大幅に短縮でき、尚且つ品質の向上が可能な優秀な素材ばかりです。

制作の手間を格段に軽減してくれるだけでなく、スキルアップの為の教材としても最適ですよ。


デザイン制作の勉強としての導入にオススメの名刺デザイン。
想像だけで作るとイマイチな仕上がりになりがちですが、良質なサンプルを参考に作ると吸収できる情報の質が段違いです。
相手に舐められない名刺テンプレート50選


バナーもフォトショップの練習をする上で良質な教材です。
想像だけ・中途半端な素材を参考にするのは有効な学習方法とは言えませんよ。
ハイクオリティなバナーテンプレート50選


例えばクリエイターの就職や転職に必須のポートフォリオ。
プロのテンプレートでレイアウトや余白、文字サイズを簡単に研究可能。内定獲得の可能性が格段にアップします!
厳選!ポートフォリオ用テンプレート34選


ゲームUIの制作は素材制作にはツールの深い知識が必要です。
テンプレートはまさに制作ノウハウの宝庫!
どれも最高の素材ばかりです。
ゲームUIに使えるテンプレート48選


単なる白黒の文字オブジェクトを一瞬で全く別モノへ大変身させるエフェクト52選です。
文字に高品質なエフェクトを追加するモックアップ


写真をはじめとした素材を「あっという間」に全く違うグラフィックへ大変身させるエフェクトです。
時短と品質の向上をされたいかたに超オススメ!
写真を全く違うグラフィックに変える事が出来る高品質なエフェクト50選


良質な素材をもっと見る
上記で紹介しているテンプレートはごく一部。
下記記事で良質な素材を紹介しております。併せてチェックしてください!

おわりに

以上、無料でダウンロードできるiPhone用のモックアップ素材でした。

アプリやWebデザイン用の素材をはじめとした用途に便利なiPhone素材ばかり。
PSDとAI形式なので編集に便利!
上手く活用して制作を加速させましょう。

ではまた!

ゼロから始めるシリーズ

現役デザイナーが教えるIllustrator、Photoshop、ポートフォリオ講座の目次です。
デザイン未経験からプロを目指しましょう!