スマホだけでできる!ブログのアイキャッチ画像の作り方【Android編】

スマホだけでできる!ブログのアイキャッチ画像を作る方法

 

今日は、
「ブログの
アイキャッチ画像を作る方法」

解説しちゃいますね。

 

画像なんてプロじゃないから
作れない...と
お考えかもしれませんが

実は誰でも簡単に
しかも無料で♪スマホだけで!
作れちゃうんですよ^^

 

※今回はAndroidのスマホでの
操作方法のご案内です。

iPhoneでも同じアプリはあるのですが
画面がだいぶ違うようです。

 

やっぱりブログは、写真があるだけで、
ぐっと見やすく華やかになって
内容がわかりやすくなります。

Facebookでシェアした時なども
クリックしてもらいやすくなりますので
画像づくり、ぜひ挑戦してみてくださいね!

 

※アイキャッチ画像とは…

ブログの内容をわかりやすく
伝えるためのイメージ画像です。


このような画像のことです。

 

 

WordPressでは、
投稿画面の右下に「アイキャッチ画像」を
登録するメニューがありますよ。

それでは画像の作り方をご案内していきますね。

 

 

無料で簡単にアイキャッチ画像を作る方法

1)画像を用意する

2)サイズを調整する

3)文字を入れる

手順はこれだけです。

ねっ、簡単でしょう??

 

それぞれ、スマホアプリを使って行います。

 

 

1 画像を用意する

まずは…無料画像サイトから
好きな画像を貰ってきましょう。

オススメの無料画像サイトはこちらです。

 

■写真AC
https://www.photo-ac.com/

メールアドレスを登録すれば
1日10枚まで無料でダウンロードできます。

それ以上ダウンロードするには
有料会員にならないといけないのですが

別のメールアドレスを登録しちゃうという手もあります(笑)

日本語でわかりやすく、使いやすい画像がたっぷりです。

 

■O-DAN
http://o-dan.net/ja/

海外の無料画像サイトを
まとめて検索できる便利なサイトです。

日本語で入力しても、自動的に翻訳
してくれ画像を検索できる、優れものです♪

海外の画像サイトは、おしゃれな
インパクトのある画像がたくさんですよ!

会員登録もいらないし、
1日何枚でももらえるので
ちょっと時間のある時に、好みの画像を
まとめてダウンロードしておいても良いですね^^

 

2 画像サイズを調整する

画像を手に入れたら、
次はちょうどいいサイズに調整しましょう。

サイズの調整をしないと、
記事ごとに画像サイズが違って
新着記事一覧の表示などが
ガタガタになってしまうことがあります。

アイキャッチ画像例

お使いのテーマによって
違うこともあるのですが

できればアイキャッチ画像は、
Facebookに投稿した時に
ぴったりなサイズ
にするのがお勧めですよ!


Facebookに投稿した時のイメージ

ここで使うアプリは… 

Photoshop Elements CC です。
フォトショップ エレメンツ CC

パソコンのフォトショップとは違って
アプリでは画像の色味を変えたり、
サイズ調整するだけの機能ですが

ちょうど「Facebook用」に
サイズを合わせる機能
用意されているので便利なんです♪

 

 

Photoshop Elements CC アプリの使い方

アプリを開くと…

画像選択の画面になります。

無料サイトからもらった画像をタッチします。

 

画像が大きく表示されたら、
左下のトリミングマークをタッチします。

 

すると、下の方にいろんな
切り取りサイズが出てくるので

左右にスライドして「Facebook広告」
というのを探してください。

広告と書いてありますが、
広告とアイキャッチはサイズが同じなので
これでOKです。

白い枠は4隅が動かせますので
どこまでカットするか指で調節してください。

ちょうどいいサイズになったら
左上の矢印マークをタッチ。

すると、「変更を保存しますか?」と聞いてくるので
「保存」を押して下さい。

 

これで、画像のサイズが調整できました!

では続いて文字を入れていきましょう♪

 

 

3 画像にタイトル文字を入れる

次は、Phonto というアプリを使います。

文字の種類もたくさん選べて
文字のデザイン加工もしやすい、
とっても便利なアプリです。

 

Phonto アプリの使い方

アプリを開くと、まず何もない画面が出るので
右上の画像マークを押します。

       ↓ ↓ ↓

「端末内の画像を選択する」を押して
先ほどカットした画像を選びます。

※画像は「Photoshop Express」
というフォルダに保存されています。

 

 

画像を開いたら、右上の鉛筆マークをタッチします。

 

 

 

「文字を追加」というメニューが出てくるので
ここで好きな文字を入力してください。

   ↓  ↓  ↓

フォント」ボタンを選ぶと
文字のデザインが選べます。

初めて使う文字は、グレーになっていて
タッチするとダウンロードが始まります。

 

 

■文字装飾バリエーションいろいろ

デザインはお好みでなんでもOKですが、
どんなことができるか、
バリエーションをご紹介します。

 

書いた文字を再度タッチすると
「文字」「フォント」「スタイル」
「大きさ」「傾き」「移動」というメニューが出ます。

「スタイル」を開くと文字や背景に
さまざまなデザイン加工ができます。

・スタイルを開いた画面

「文字色」をタッチすると
どこを加工するか選べます。

・文字色を開いた画面


「背景」
に色を付けると下地が作れます。

・背景を開いた画面

色のグラデーションは左右に動かして、
いろんな色が選べますよ。

「透明度」を変更すると、後ろの画像が少し見えて
透けた印象にできます。
ベタ塗りにするよりも、優しい印象になります。

・背景色を黄色にして、透明度を薄くした様子

「幅」・「高さ」・「角」で
背景の下地の大きさ、形も変えられます。

・幅と高さを大きくして、角を丸くした様子

「ストローク(縁取り)」を選んで
文字にふちどりをつけて
メリハリを出すのもお勧めですよ。

ふちどりも、色を変えたり、透明度で薄くしたり
ふちを太くすることもできます

完了を押すと、前の画面に戻ります。

あとは文字の大きさを字が「大きさ」で調整します

画像が仕上がったら、
右上の保存マークをタッチして、できあがりです!

できあがり♪

ぜひお試しくださいね~^^

村重 敦子

「猫でもわかる!」くらい簡単にわかりやすく、WordPressの使い方をサポートする、WordPressソムリエです。デザインを学んだ後、なぜかレストランでワインサービスに従事。絵も描けるワインソムリエでした。その後大手通信会社に勤めIT・Webの各種サポートを経験。ソムリエもWebも常に「専門知識をお客様に合わせてわかりやすくご提案し、期待以上のサービスをする」ことをモットーとしています。テクニカルサポートの経験は、通算1,100人以上。現在はWebデザイン・ディレクターをしながら、ブログ集客をしたい方へWordPressの制作、使い方のレクチャーなどを行っています。

Pocket