自作テーマの形ができてきたので、WEBデザイナーさんみたいなことがやりたくて、モックアップというのを作ってみました。
テーマが完成したらパソコン・タブレット・スマホのはめ込み画像を作ってみよう
テーマストアにいくとよく見かけるこの画像。
パソコンやスマホなどに画面のキャプチャがはめ込まれていて、レスポンシブデザインのイメージが湧きますね。
ということで、まだ非公開なのですが、自作のテーマの形ができてきたので、はめ込み画像を作ってみました。
Placeitでモックアップを作ってみたよ
こういうパソコンやスマホ、タブレットなんかにはめ込まれた画像のことをモックアップというみたいで、検索エンジンでモックアップと検索するとたくさんのサイトが出てきます。
古い情報も多くて、リンク切れだったり、サイト自体がなかったりすることも多くて、探し出すのが大変でした。
ようやく見つけたのが、
- Placeit (https://placeit.net/)
というサイトです。
無料のものから有料のものまでありますが、無料のものは少し数が少ない印象です。
Placeit で自作テーマのはめ込み画像を作ってみた
手順1 検索窓で「free」と検索して、カテゴリで絞り込んで利用したいはめ込み画像を探す。
手順2 利用したい画像が見つかったら画像をクリックして設定画面に。
手順3 左上に「device1」「device2」と表示があって、「insert Image」をクリックすると「Upload your device」とあるので、サイトのキャプチャを撮っておいた画像をアップロードします。
「From URL」からも一応試してみたら、少し時間はかかりますが読み込むことができましたので、どちらかお好みで。
手順4 アップロードが完了したら、右上に「Free Download」があるのでクリックすると会員登録の画面になったので、Googleアカウントでログインして無事ダウンロードが完了しました。
雑感
意外と簡単に作成することができたのでよかったです。
他のサイトは、画像がphotoshopで加工できるようになっていてダウンロードして使ったりするものなんかもあったのですが、photoshopは持っていないので、こんな風に簡単に作れるサイトは便利ですね。
日本にもこんなサイトがあったらいいのに。
