インターネット・アカデミー オフィシャルブログ
About

Apple製品へのはめ込み画像を作れる「Smartmockups」

2016年5月11日

Apple製品にWebサイトのはめ込み画像を作れる「Smartmockups」

このサイト、使ったら感動します。
今日ご紹介する「Smartmockups」は、タイトルの通り、画像に写っているiPhoneやApple Watch、Mac BookといったApple製品の液晶パネル部分に、自分の好きな画像やデザインをはめ込んだ画像を作成することができます。 言葉だと分かりづらいですので、次の項の使い方をぜひご覧ください。

Smartmockupsの使い方

Smartmockupsにアクセスをすると、さまざまなApple製品が写っている画像のテンプレート(Mockups)が用意されています。 いずれも、製品の液晶部分は青く塗られ、「YOUR DESIGN HERE」と書かれています。
この部分に、自分の好きな画像を表示することができるのです。

テンプレートを選ぶと、テンプレートの詳細ページが表示されますので、その中から、「Upload new(画像のアップロード)」か、「URL Screenshot(WebサイトのURLの指定)」のいずれかを選びましょう。
今回は、インターネット・アカデミーのURLを入力してみました。

Apple製品にWebサイトのはめ込み画像を作れる「Smartmockups」 使い方

すると、画像の中で、きちんと製品の液晶画面の角度や奥行などにぴったり合う状態に自動的に調整されて、指定した画像が表示されています。
作った画像が気に入れば、「Download full image」ボタンでpng画像としてダウンロードすることができます。 サイズも、4段階のラインナップから好きなものを選択できますし、無料で商用利用も可能です。

Apple製品にWebサイトのはめ込み画像を作れる「Smartmockups」 使い方

実際に使ってみると、はめ込み画像が表示されたときの感動ったらありません。 撮影したり画像をトリミングするといった手間をかけることなく、簡単にはめ込み画像を作成したいという方、ビジネス利用も可能ですので、ぜひ活用してみてください!!

関連サイト

本ブログは、日本初Web専門スクールのインターネット・アカデミーの講師が運営するWebメディアです。 スクールの情報はもちろん、最新のWebデザイン・プログラミング・Webマーケティングについて役立つ情報をご紹介しています。

  • このエントリーをはてなブックマークに追加

現在、マサチューセッツ工科大学のW3C本部に在籍し、HTML開発とインターネット・アカデミーのカリキュラム開発を担当する。

海外支店責任者として、アメリカとインド、日本を行き来する。5年間、マサチューセッツ工科大学のW3C本部に在籍し、HTML開発と普及活動を行ってきた経歴を持つ。

日本の新宿校、渋谷校インストラクター。主にWebマー ケティングとクリエイティブ系の授業を担当。

バンガロール校インストラクター。デジタルマーケティング が専門分野。

Google認定Webマーケティング講座の企画・開発に携わる。「PHPカンファレンス2011」で講演。「PHP公式資格教科書」の執筆など

バンガロール校支店長。Webプロデューサー、インストラクター、エリアマネージャを経て、現在はグローバル展開のビジネスディベロップメントを担当。

「W3C"HTML5 Tour"」での講演や、インド校にてWebデザイナーおよびチーフインストラクターを勤めた経歴を持つ、人気キャリアプロデューサー。

フランスにあるW3CのEUホスト、ERCIM(欧州情報処理数学研究コンソーシアム)に常駐し、Webの研究を行うインド人インストラクター。Webマーケティングに精通している。

テーマテーマ

最新の記事最新の記事

スタッフ別ブログスタッフ別ブログ