menu

想像とシンプル/体温を感じるWEBサービス
WEB DISIGNERS Blog

2016/07/08
  • その他

驚くほど簡単にはめ込み画像作成できる モックアップ画像やポートフォリオに最適なサイト「Frame Awesome Product Shots」

frame

WEBサイトを制作している方など、自分の制作したサイトのポートフォリオを作成されることも多いと思います。Frame: Awesome Product Shotsはそんな時にオンライン上で簡単にモックアップ画像を作成してくれるサイトを紹介します。これは結構感動ものです。

モックアップ画像やポートフォリオに最適

Frame: Awesome Product Shots

こちらのサイトで数クリックで各デバイスに、お好みの画像をはめ込むことができます。
Frame: Awesome Product Shots


例えばこのような画像を用意します。
frame1


それが数クリックで
frame2
こんな風にしてくれます。

PCだけでなくタブレットやスマートフォンの素材もあります。

このキャプチャー画像が
frame3

frame4
こんな風に!!

手 順

1. トップページの「Get Started」をクリック

frame5

2. デバイスを選択 → 好みの画像を選択

frame6

3. 画像をドラッグでアップロード

frame71

4. 画像を切り取りサイズを調整

frame8

5. ダウンロード

frame9

素材もある程度数用意されているのも嬉しいですね。自分で作成するのは時間がかかってしまいますし、時間がない場合などに、これだけクオリティの高い画像が簡単に作れてしまうのでオススメです。

コメントを残す




POPULAR POSTS

高機能jQueryスライダー「Slider Pro」の使い方

2016/03/03

HTML要素に背景としてYouTube動画を表示するレスポンシブ対応

2016/02/11

「HTML5」と「CSS」のみで背景動画をフルスクリーンで再生する

2016/04/09

HTML/CSSのみで動きを加えてくれるアニメーション ホバーエフェクト9選まとめ

2016/03/24

NEW ENTRY

HTMLとCSSだけ簡単シンプルなスライダーを実装

2016/08/23

マウスホバーでテキストの色を左からアニメーションで変更するCSSテクニック

2016/07/26

テキストをCSSだけで映画のタイトルのように、ぼかしたブラーの状態から徐々に表示させるテクニック

2016/07/12

画像を使わずにCSSのみでボーダーにグラデーションをかける方法

2016/07/11