少し難しめなバナー画像の作り方！

今回このバナーを制作する際に使用するサイトは、WEBボタン素材自動生成サイト - ButtonMakerアフラットさんです。

とても多機能で、細部まで自分のイメージに合ったバナー画像を作ることが出来ると思います。

では、作り方の方に入っていきます。

１．画像サイズを指定する





上のリンクに飛ぶと、こんな画面が出てきます。

このサイトでは、画像サイズは自分で自由に決められます。
ですが、バナーっぽくしたいのであれば下の３つのサイズがおすすめです。
サイズをコピペして使う場合、ここでは横×縦で書いていますので、コピペするときには、例えば（468×60）をコピペするときには



こんな風にコピペしてご利用ください。


１．フルバナー（468×60）


普通のよく見かけるサイズ。バナーの大半はこれだと思う。

２．リーダーボード型（728×90）


大きめのバナー。これも結構見かける。

３．ミディアムレクタングル（300×250）


正方形に近い形をしたバナー。ゲームとかの広告で見かける。

（注意　これはうらつくでの表示であり、他のサイトでこのサイズのバナーを表示すると、形・大きさが違う風に表示されるかもしれません。あしからず）

ちなみに、フルバナーが一番どの端末で表示してもいい感じに収まるみたいです。
（3ds、androidタブレット、windowsのパソコンで検証しました）

２．背景色を指定する

サイズの指定が終わったら、背景色を指定しましょう('ω')ノ



ここをクリックして背景色を決めましょう。
もし良い色が見つからない！　という方はこちらへ。
（リンク先で作った色は、コピペした後＃を消さないと使えません）


３．他の加工をする



最低限下地となる加工が出来たところで、一気に機能を解説します。

１、２は解説済みなので３から行きます。
なお、設定は一回変えるごとに右上の「Create」ボタンをクリックしないと反映されません。

３．枠線
枠線を付けられる。太さは1pixと2px両方選べるが、1pixがおすすめ。
色は背景に近く、背景に比べやや濃いめの色でまとめるとくっきりする。

４．背景ライン
背景にボーダーをつけられる。
濃さは、背景色と比べて何％変えるかで選べる。

５．テキスト
文字を入れられる。
位地２は指定しなくてもいい。
指定したい場合、画像全体の幅と自分が文字を置きたい場所の割合を考える必要がある。
サイズはとりあえず40位から少しずつ変えていくと、ちょうどいいサイズを見つけられると思う。
他は試行錯誤がどうしても必要。

６．テキスト２
５．テキストと仕組みは全く同じ。
サブタイトルのような感覚で使ってみるといいと思います(*^^*)

７．丸い角
角を丸くできます。
半径２〜10pxの範囲で選べますが、丸くしたいのなら思いっきり10pxにしたほうが分かりやすく丸くなり、おすすめです('ω')ノ

８．タブ
これについては説明が難しいので、画像で具体例を出します。



タブをこんな風に設定し、背景色を赤に設定すると、



こんな風になりました。
うまく使えばふち取りやアンダーラインとかに使えそうですね。

９．クリア調
画像にクリアな感じをつけられます。
クリックするだけで設定できるので、説明は不要でしょう('ω')

こんな感じです。
後は気の向くままです。
自らの感性のまま突っ走ってみて下さい。

そしたら、多分20分後くらいには完成しています(^w^)

完成したら、このサイトはダウンロードボタンが無いので画像の上で右クリックして、
「名前をつけて保存」すれば、そのまま使えます(^w^)

「私が求めているのはこんなオリジナリティじゃない、もっと、もっとオリジナリティをーー！」
という猛者でつわものな読者様は、下のバナーから難しいモードにチャレンジしてみましょう！