Appleのパソコンのモックアップ画像を作る方法

MacbookやiMac等、Apple(アップル)社のパソコン/PCのモックアップ画像とイラストを集めてみました。

人気のイラストなだけに、なかなか著作権フリーの素材は少ないですが、これらは全て著作権フリーです。

パソコンの画面には好きな画像をアップロードして、オリジナルのイラストをデザインできるので、顧客とのイメージのすり合わせやデモシーンなんかでも

利用可能だと思います。

※以前の記事でスマートフォン版も紹介しているので参考にしてみて下さい

パソコンのイラストや画像6選 画面に好きな画像をアップロード可

 

 

デザイン方法

PlaceitというWebサービスを使います。

英語のサイトですが、操作方法は難しくないですし、本サイトでもやり方を紹介します。

 

まずは下記が大まかな流れとなります。

 

Step1:デザインのモックアップを決める

Step2:画像をアップロードする

Step3:画像のサイズを調整する

Step4:ダウンロードする

 

画像は後から差し替えることも可能ですし、背景が透明の画像もダウンロード可能だったりと、このサービス1つで色々できて便利です。

以下ステップ毎の具体的な方法です。

 

Step1:モックアップを決める

Placeitにアクセスし、イラストの基本的なデザイン素材を選択します。

上手の通り、Placeitには様々なテンプレートが用意されているので、色々探してみて下さい。

ちなみに今回自分は、こちらのデザインを使いました。

 

 

Step2:画像をアップロード

デザイン画面のInsert Imageをクリックして、モニター画面に表示したい画像をアップロードします。

Insert Imageをクリックすると、下図のような画面になります。

デスクトップやダウンロードフォルダからアップロードする場合は、Upload from Your Deviceをクリックして画像を選択します。

 

 

Step3:画像のサイズを調整

モニター画面に収まるよう、画像のサイズを調整していきます。

画像下のスクロールバーを左右に動かせば、画像のサイズを調整できます。

最後に「Crop」を選択すると、画像が切り取られます。

 

 

Step4:ダウンロード

画面右上のダウンロードボタンを押して、画像をダウンロードします。

なおPlaceitは素材のダウンロードに関しては、実は有料です。下図がPlaceitの料金プランとなっていて、いずれかに契約しないと先に進めません。

有料ですが、月額1,500円程度です。

下手に無料の素材を探すのは時間がかかり、その手間を考えれば、ちょっとお金を出してサブスクを買った方が個人的にはスマートだと思います。

一回使ってやめたければ辞めればいいわけで、実際に自分は月額プランを契約してサムネイル画像等はここから持ってきています。

 

契約が完了したら、もう一度ダウンロードを押します。

ダウンロードが完了すると。ダウンロードフォルダにダウンロードされています。

画像形式はPNGです。実際に開いてみました。

画質もそこそこいいです。

プレゼン資料に使ったらオシャレですよね。

 

以上です。

 

Placeitは慣れてくれば、ものの3分もかからずにデザインが完成すると思います。

 

なお画像を切り替えたい場合は、再度Upload Your Imageより選択し直します。

画面内にテキストやロゴ(自社サービスや企業ロゴ等)を挿入して編集することも可能です。

 

以上、参考にしてみてください。

Placeitでデザインを始めてみる!

 

 

 

●最近アップした動画!!

ElementorというWebサイトビルダーのメリットとデメリットをまとめてみました。参考にしてみて下さい!

 

 

 

●人気記事

WordPressをGCP環境で実装して使ってみた

 

社会人向けWebデザイン講座8選 メリットやデメリット

 

在宅ワークを快適に!おすすめアイテム4つ紹介

 

 

2 Comments

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です