ハッサク
こんにちは！
フリーランスコーダーのハッサクです。
Webサイトを納品後にポートフォリオを更新するのですが、その時に作成するのが「モックアップ」。
URLを開かなくても、パソコン・スマホの表示が確認出来て便利ですよね。
▼モックアップイメージ
いつも使用している「Mockup Photos」が何回やってもダウンロード出来ず…。
変更を検討し、他のモックアップ作成ツールを調べました。
ちなみに上記のモックアップのような「モニター、タブレット、スマホ」が1つになったモックアップは、これから紹介するサイトでは見つかりませんでした。
ハッサク
もし3デバイスを1枚画像で、無料で生成できるサイトがありましたら、ぜひ教えてください！
無料ツール
MOCKUPSJAR
Create realistic mockups for your awesome apps | MOCKUPSJAR - Free Mockup Generator
mockupsjar.com
メリット
・URLでの生成も可能
デメリット
・URLでの生成、画像のダウンロードには、会員登録が必要
・（個人的な感想）慣れるまで、最初操作に手間取った
Canva
Login to your Canva account
Login to access and create your next design.
www.canva.com
メリット
・種類が豊富
・操作が簡単（画像をアップロードするだけ）
デメリット
・会員登録が必要
・種類は豊富だが、無料のものは少ない（ただし無料の中でもバリエーションは豊富な印象）
・ダウンロードしたファイルが重いので、圧縮必須
MockUPhone
MockUPhone
MockUPhone is a free tool that helps you wrap app screenshots in different mobile devices. Support iPhone mockup, iPad m...
mockuphone.com
メリット
・（個人的な感想）操作は一番簡単だった
デメリット
・URLでの生成は不可
・種類は少ない（背景なしのみ）
・ダウンロードするとzipファイル（他はzipじゃないため、解凍→削除がやや手間に感じた）
・スマホだと3種類（正面、横向き、斜め）の画像がダウンロードされるため、不要な画像の削除がやや手間に感じた
有料ツール
Placeit
Placeit | Create Amazing Mockups, Logos, Videos & Designs
Get Unlimited Downloads Across 150K+ Templates! Create & Customize Logos, Videos, Mockups, Flyers, Business Cards in Sec...
placeit.net
ダウンロードボタンを押すと、以下の購入画面が出てきたため有料の印象。
メリット
・URLからモックアップの作成が可能
・種類が豊富
参考サイト
無料で使えるモックアップ作成サービス・素材サイト(ジェネレーター・はめ込み・素材) | webclips
スマホ・PCなどのデバイスにデザインをはめ込めるモックアップジェネレーターと、PSD・Figmaで使える無料素材サイトをまとめて紹介。デザイン制作・ポートフォリオ・SNS投稿に活用できるサービスを厳選しています。
webclips.jp
