• Twitter
  • facebook
  • search

-web集客の悩みは尽きず-

12/05(月)は
1533
閲覧
New Standard
売れるHPとデザインと。

Photoshop不要!お洒落なブログ用アイキャッチの作り方

Writter: miyamot.s
  • このエントリーをはてなブックマークに追加
Photoshop不要!お洒落なブログ用アイキャッチの作り方

売れるHPとデザインと。

売れるHPとデザインと。企業がHPを作る理由とは何でしょう?それはただ一つ、売上を上げることです。その為には、集客できるHPでなければいけません。そんな制作の現場をクリエイティブの視点からお届けするブログです。実のある話がモットーです。

アイキャッチの重要性がすごく高いのはみなさんご存知の通りだと思うのですが、念のため「アイキャッチ」とはなんぞや? と思われる方のために冒頭でどういったものかをさらっとご説明しておきます。

アイキャッチとは、アニメ、特撮番組等の中盤でのCM放送前後に映される番組タイトルクレジットのこと。(中略)作品により、毎回固定の映像を流す場合や、各話ごとに異なる演出の物が存在する。

アイキャッチ(wikipedia)

じつはこれ、アニメの業界用語? だったようですね。ただ、WEB界隈で「アイキャッチ」と言えば、上にあるような「目をひかせるための画像」と思えば簡単です。このアイキャッチがあるないではそのコンテンツの反応度も違ってきますし、SNS連携などでバイラル効果を狙う場合も、効果的な画像を配して記事を流す場合とそうでない場合とではクリック率も相当違います。

今回はそんな大切なアイキャッチをPhotoshopなどの画像編集ソフトを使わずにより効果的なものを作成できるサイトをご紹介いたします。この連載で作成したアイキャッチ画像も今回ご紹介するサイトで作成したものです。こんなクオリティーで作成ができますので、ぜひ参考になさってみてくださいね!

Photoshop不要!効果的なアイキャッチを作る!

フォトフォニアのサイト
こちらが今回ご紹介するサイト「PhotoFunia(フォトファニア)」です。仕組みとしてこのフォトフォニアの中にいろいろな人物画像のエフェクトがあるので、そのエフェクトを選んで加工する。といった感じです。なので、基本的には人物画像が必要になってきます。そのほかには「砂浜に手書き文字を書いた風な」画像を作れたりもできるのですが、残念ながらこちらは日本語には対応しておらず英語だけです。英語だけであればこういった文字エフェクトもずいぶんと活用ができそうです。「SALE!」とかですね。ではさっそくどのように作っていくのか見ていきましょう!

まずは人物画像を準備すべし!

独自のスタッフ写真などから元にできればすごくいいのですが、そういった画像がなく撮ってる暇もない。という方であれば、商用でクレジット表記も不要な人物写真を主体としたサイトがありますので、こういった写真素材サイトを使ってみましょう。今回はPhotoACさんからこんな画像をチョイスしてみました。

PhotoACさんから選んだ人物画像
びっくりしたとってもカワイイおねえさんです(笑)。PhotoACさんではこういった非常にクオリティーの高いモデルさんを使った人物画像が豊富にそろっています。

さっそくフォトフォニアで作るべし!

まずサイトにアクセスすると左側にいろいろなエフェクトの種類がならんでいます。「Posters」や「Billboards」、「Vintage」などですね。これはポスター風にしたいですとか、ビルボード(屋外広告)風にしたいですとか、ビンテージ風でおしゃれにしたいといった「効果」の名称を表しています。また、メイン部分にはさまざまな画像が並んでいます。これはエフェクトをかけた結果がずらずらと並んでいるので、ここから「んー・・・コレ!」って感じで選んでもOKです。

フォトフォニアでエフェクトを選ぶ
今回ぼくが選んだのはビルの屋外広告を作成している風なエフェクト「Replacing billboard advert」です。作成はとっても簡単でまずは好きなエフェクトをクリックして、次にさきほど保存した人物画像をアップロードするだけです。詳しくは次の手順になります。

人物素材をアップロードすべし!

行いたい加工を選ぶ
エフェクトを選ぶとこのような形になるので、その中にある大きなオレンジボタン「Choose photo」をクリックです。

選んだ画像をアップロードする
クリックするとこんな画面になるので「Browse…」をクリックして先ほどの画像をアップロードします。

アップロードした結果
少し時間はかかるのですが、アップロードするとこんな形になるので「OK」ボタンを押しましょう。

アップロード後の画像
これで「Edit photo」をすればエフェクトに入れた画像領域を編集することができ、そのまま「Go」をクリックすればエフェクト加工が始まります。

画像領域を選択して調整する
「Edit photo」である程度顔やポーズの部分を中心にあまり余白を与えず大きく選択しておくといいかもですね。これはエフェクトによっていろいろな場合がありますので、エフェクトごとに考えてみてください。

完成!

フォトフォニアで看板広告風に加工した結果
おぉぉ。。。こいつはすごい!先ほどのおねえさんがビルの屋外広告の看板で作成されました!できあがりを確認したら「Save」で画像として保存できます。

まとめ

いかがでしたでしょうか! これならアイディアしだいですごく目をひくアイキャッチ画像を簡単に作れそうですよね。あとはこの出来上がった画像を元に帯タイトルを付けて今回の連載で使ったような形にすれば立派なアイキャッチ画像が完成です。ぜひお試しアレ!

miyamot.s

miyamot.s

ninoyaデザイナー

イケメンわんわんお(とくに白い犬)画像を集めるのが趣味のWEBデザイナー/WEBディレクター/ライター。「意外と年食ってるんだね」と言われることが多くなってゲンナリしています。好物は「お豆腐」です。

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

著者新着

著者人気

ninoyaブログ新着

blog_share_area_heading読者登録はこちら

New Standard

-web集客の悩みは尽きず-
12/05(月) は 1533人が閲覧

ninoyaからのお知らせ

Facebook、Twitter、メルマガで最新情報を配信中

メルマガ登録

メルマガ登録

週1回&酒と泪と女と女更新時にメルマガをお届けしています。

入力内容にエラーがあります。