blog

top > 學展blog

2014.11.20 (Thu)

制作

もっておいて損はない! Apple製品の無料モックアップをまとめてみた

a0 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

こんにちはよねちゃんです。

コンテストやコンペなどで自分のアイディアを発表する際や
自分の作品がどのように使われていくのかをプレゼンする際、「モックアップ」があると説得力が違います。

実際に使われるイメージがしやすくまた洗練されように見栄えがよいです。

今回ご紹介するモックアップはiPhoneやMacなどの「Apple製品」のモックアップです。
WEBや映像、アプリにデザイン制作の手順など美しく見せることのできるモックアップとなっております。

後半にiPhone6/6Plusのモックアップもご紹介させていただいております。ぜひ最後までごらんください。

Apple Responsive Screen MockUps

a1 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

Mac,iPhoneと光沢のあるリアルなモックアップです。
“iMac”,”MacBook Pro”,”MacBook Air”,”iPad”,”iPhone(5c)”

http://graphicburger.com/apple-responsive-screen-mockups/

Free Apple devices mockup

a2 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

こちらもリアルなモックアップです。
先ほどのモックアップよりもラインナップが充実しており、
“iMac”,”MacBook Pro”,”iPhone5S”,”iPhone5C”,”iPad Air”,”iPad mini”6デバイス。
https://www.behance.net/gallery/Free-Apple-devices-mockup/13809759

Shadow Series Apple iDevices

a3 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

黒いモックアップ!
モックアップよりもディスプレイ内の作品、デザインがより引き立ちます。

“iMac”,”MacBook Pro”,”iPad”。

http://www.techandall.com/shadow-series-apple-idevices/

Flat Apple Devices MockUp

a4 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

続いてはフラットなモックアップ。
“iPhone5″,”iPhone5s”,”iPhone5c”,”iPadMini”,”iPad”,”Macbook”,”iMac”と充実したラインナップにそれぞれ角度のついた別アングルがついております。

http://graphicburger.com/flat-apple-devices-mockup/

Apple Flat Devices

a5 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

こちらもフラットなモックアップ。
Macに加え”iPod shuffle”や”MacPro”など様々な歴代のApple製品が用意されています。
http://graphicburger.com/apple-flat-devices/

Flat Devices

a7 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

“iMac”,”MacBook Pro”,”iPad”,”iPad mini”のフラットなモックアップ。
他のフラットなモックアップに比べてとてもシンプルでデザインを邪魔しません。

http://dribbble.com/shots/988673-Flat-Devices

mydesk minimalist

a6 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

Apple製品は”Macbook Pro”,”iPad”,”iPhone”と少ないですがテーブルの上にありそうな小物達の可愛らしいモックアップもセットとなっております。

http://dribbble.com/shots/1420241-mydesk-minimalist

Flat Responsive Showcase Psd Vol2

a8 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

ロングシャドウのかかっているモックアップ。
金属部分の光沢感を絶妙に残したフラットなモックアップです。
“iMac”,”iPad”,”iPhone”。

http://www.pixeden.com/psd-web-elements/flat-responsive-showcase-psd-vol2

Vector Apple Outline Device PSD

a9 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

アウトラインモックアップ。
これも見せたいデザインを邪魔しないシンプルなモックアップです。
“iMac”,”MacBook Pro”,”MacBook Air”,”iPad”,”iPad mini”,”iPhone”。
http://www.pixeden.com/psd-web-elements/vector-apple-outline-device-psd

iPhone 6 / 6 Plus Flat Template

a10 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

ここからはiPhone6のモックアップ。
フラットなモックアップで6,6 Plusの全色用意されています。
http://bedesignful.com/freebies/iphone-6-6-plus-flat-template/

iPhone 6 Plus

a11 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

iPhone6 Plusのモックアップ。
フラットなアイコンセットやApple Watchのデータもセットとなっております。

http://365psd.com/day/5-13-iphone-6-plus/

10 Pure CSS Mobile Devices

a12 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

HTML/CSSで作られたiPhone6/6Plusのモックアップ。
カラーリングも全色あり様々なアングルも用意されております。

http://marvelapp.github.io/devices.css/

3-4 iPhone 6 PSD Vector Mockup

a13 もっておいて損はない! Apple製品の無料モックアップをまとめてみた 學展ブログ

角度のついたモックアップ。
奥行きのある立体的なモックアップはプレゼンをさらにイメージしやすいものにします。

http://www.pixeden.com/psd-mock-up-templates/3-4-iphone-6-psd-vector-mockup

〆(まとめ)

いかがでしたでしょうか。
様々なApple製品のモックアップをご紹介させて頂きました。
最新デバイスを使ったモックアップをぜひみなさんもつくってみてください。

學展の開催概要はこちらから >