エレファント2バナー

      2017/08/31

アプリでバナー作成!初心者でも簡単に作る方法を詳しく解説するよ。

 
壁紙画像

おひとりさまブロガー和泉
ブログアクセスアップ術を教える仕事をしています。
趣味はグルメ・映画鑑賞・ミニチュア製作です。
お陰様で月間17万PV達成しました。

パワーブログ講座やっています。

こんにちは、おひとりさまブロガー和泉です!

今日は、「アプリ」を使って、スマホで簡単にバナーを作成する方法を解説したいと思います。

バナーを作成するとなると、フォトショップやイラストレーターなどを使わないといけないイメージですが、スマホの「アプリ」を使うことで、スマホで簡単にバナーを作成することが出来ます!

  • スマホのアプリで簡単にバナーを作成してみたい方

に向けて書いた記事です


スポンサーリンク


アプリでバナーを作成することが出来るの?

そもそもアプリでバナーを作成することが出来るのか疑問を感じるかと思いますが、、、

  • 実際に私のブログ内にあるバナーはすべて今回紹介するアプリで全部作っています。

素人が作ってるので手作り感満載ですが、イラストを描いたり、文字を書いたり、画像を重ねたり、画像の大きさを決めたり色んなことが出来るのでとっても便利です。

このブログタイトルのバナーも今回紹介するバナーで作ってます!

バナー

バナーを作成できるアプリとは?

今回ご紹介するバナーを作成するアプリは以下の2つです。

  1. 「ibisPaintアプリ」
  2. 「phontoアプリ」

この2つのアプリを駆使してバナーを作成していきます。

1.ibisPaintアプリ

「ibisPaintアプリ」は基本は絵を描くアプリですが、、、

  • 画像の大きさを自由に決めることが出来る
  • 画像と画像を重ねることが出来る
  • 画像の背景に色を付けることが出来る

上記の作業が出来るので、そういう場面で活用していきます。

2.phontoアプリ

phontoアプリ

「phontoアプリ」は写真や画像に文字を入れることが出来るアプリです。

  • 写真や画像に文字を入れる
  • 文字を色々装飾することが出来る

上記の作業が出来るので、そういう場面で活用していきます。

「ibisPaint」「phonto」アプリをダウンロードしよう!

バナーを作成する方法を解説する前に、まずは2つのアプリをダウンロードしましょう!

  • 「ibisPaint」アプリ
  • 「phonto」アプリ

iPhoneの場合、appストアからダウンロード

androidの場合は、Googleplayからダウンロード

アプリでバナーを作成する方法【基本編】

では、ここからはスマホアプリを使ったバナーを作成する方法を解説していきます。

step1 まずは「ibisPaint」アプリで背景画像を作る

  • 「ibisPaint」アプリを開き、「マイギャラリー」をクリック

アプリでバナー作成

  • マイギャラリーが開いたら、上の「+」を押す

アプリでバナー作成

  • 新規キャンパスが開いたら、好みのサイズを選択します。
  • 今回は、自分で画像サイズを設定します。

アプリでバナー作成

  • 画像が開いたら、背景に色をつけます。
  • 画面下の「消しゴムマーク」の場所を押し、「ばけつマーク」にします。

※消しゴムマークは場合によっては、筆マークとか異なります。

アプリでバナー作成

  • 好きなカラーを選びます。
  • 円のカラーで微妙な調整が出来ます。

アプリでバナー作成

  • カラーを選んだら、画像を押すと、色がつきます

アプリでバナー作成

step2 背景画像に別画像を重ねてみよう

  • 「1」と書かれているレイヤーボタンを押します。

アプリでバナー作成

  • 「カメラボタン」を押します。

アプリでバナー作成

  • 「カメラボタン」を押します。
  • お好きなアプリから画像を選択します。

アプリでバナー作成

  • 「カメラボタン」を押します。
  • お好きなアプリから画像を選択します。

今回は以下のPNGイラスト画像を選択します。

アプリでバナー作成

※このイラストも、「ibisPaint」アプリで手描きしたイラストです。

ただ、イラストはどこかの素材サイトからもってくるのもOKです。

  • 入った画像は、指で好きな場所に移動することが出来ます。
  • 画像を指で押さえて、縮めたりも出来ます。

アプリでバナー作成

  • 画像の場所が決まったら、画面上の「OK」ボタンを押します。

※「OKボタン」でマイギャラリーに戻らない場合は、画面下の「BACK」ボタンを押します。

アプリでバナー作成

これで背景画像の作成は出来たので、次は共有(保存)します。

step3 画像を共有しよう

自身のギャラリーなどに共有をしましょう。

  • 「共有ボタン」を押して、画像を共有します。

アプリでバナー作成

  • 画像の形式を選びます。

今回は背景色もつけたので、JPEGにします。

アプリでバナー作成

バナーの背景が出来ました!

次は「phonto」アプリで文字を入れていきます!

step3 「phonto」アプリで背景画像に文字を入れていこう

ここからは上記で作成したバナーの背景画像に文字を入れていきます。

  • 「phonto」アプリを開きます。
  • 画面上の「画像マーク」を押します。

アプリでバナー作成

  • 新しい画像の「端末内の画像を読み込む」を選択

アプリでバナー作成

  • 先ほど作った画像が挿入します。

アプリでバナー作成

  • フォントを選んで、文字を追加します。

アプリでバナー作成

  • 文字の色を「スタイル」で変えます。

アプリでバナー作成

  • 文字色をスライドすることで、色を選択できます

アプリでバナー作成

  • 文字の大きさを変えます。
  • 「大きさ」を押して、バーを左右することで変更できます。

アプリでバナー作成

これで完成したので、画像を保存します!

  • 画像を保存します。
  • 画像マークを押します。

アプリでバナー作成

完成!

「ibisPaint」「phonto」を合わせることで、アプリでバナーを作成することが出来ました!

アプリでバナー作成

アプリでバナーを作成する方法【応用編】

ここからは「ibisPaint」「phonto」アプリを使った、バナー作成の応用編をやっていきます!

  • PNG形式にすることで、背景色が出なくなるので、サイトのヘッダー画像とかロゴ画像にも使えますよ!

背景を透明(PNG)にして作る

  • まずは、「ibisPaint」アプリで画像の背景を作成します。
  • 「1」と書かれたレイヤーボタンを押します。

アプリでバナー作成

  • 背景を透明にします。

アプリでバナー作成

以下のようになったら透明になっています。

アプリでバナー作成

  • 次は、別画像を重ねます。
  • 「カメラ」ボタンを押します。

アプリでバナー作成

  • 次は、別のPNG画像を重ねます。
  • 「カメラ」ボタンを押し、画像を選択します。
  • 画像は入ったら、好きな場所に移動させたり、画像を縮めたりします。

PNG画像は、イラスト素材サイトからもってくることも出来ます。

下記のイラストは「ibisPaint」で描いたものです。

アプリでバナー作成

  • 「BACK」ボタンを押すことで、保存されます。

アプリでバナー作成

  • 「共有ボタン」を押すことで、画像の形式を選択できます。
  • 今回は背景を透明にするのが目的なので、「PNG」を選択。

アプリでバナー作成

好きなアプリに共有させてください。

次は「phonto」アプリで文字を入れていきます!

「phonto」アプリで文字を入れる

  • 画像ボタンから、先ほど作ったPNG画像を挿入します

アプリでバナー作成

  • 「ペンマーク」を押して、字を入れて装飾します。

アプリでバナー作成

ここで一通り完成!次は画像の形式を変えます。

  • 「…」を押して、画像形式を変更

アプリでバナー作成

  • 「設定」を押します。

アプリでバナー作成

  • 「画像の出力形式」を選択

アプリでバナー作成

  • 今回は「PNG」を選択

アプリでバナー作成

※一度変えたら、次回からも「PNG形式のまま」になるので、次回使うときはJPEGに戻しておきましょう。

  • 「…」を押して、画像を共有します

アプリでバナー作成

  • 「共有」ボタンを押します。

アプリでバナー作成

完成!

わかりにくいですが、PNG形式になっているので、背景は透明になっています。

アプリでバナー作成

最後に

ここまで「ibisPaint」「phonto」アプリを合わせてスマホでバナーを作成する方法を解説してきました。

この2つのアプリを合わせることで、フォトショップやイラストレーターを使わなくても気軽にバナーを作成することが可能になります!

少し難しいかもしれませんが、慣れればそこまで難しい作業ではありません。

ぜひ、やってみてくださいね^^

「phonto」アプリについては、【phontoアプリの使い方】記事で詳しく解説しているので、参考にしてください^^

 

Copyright© おひとりさまですブログ。 , 2017 All Rights Reserved.