MacのkeynoteとiPhoneアプリだけでオリジナルバナーを作ってみたよ

blog_banner

現在この「まろやかなギーク!」以外に、個人的な日常や心情エッセイみたいなブログ「心中お察しください。」と、手描きのイラストをメインにした「楽描さん」という2つのブログをはてなブックマークでなどで有名なはてなブログで運営している。

もともと2つのブログは当まろやかなギーク!のコンテンツのひとつだったわけですが、分けることでブログに対する軸が定まってきたように思います。

思い切ってブログタイトルも変更したのも良かったのかと思います。

 関連 ☞  ブログタイトルを『まろやかなギーク!』に変えて路線も変更 | まろやかなギーク!

それからブログの運営もちゃんとしようと決めてから、デザインなどもいじるようになりました。素人ながらずいぶん頑張ってるなと思います。

文字の大きさとかアドセンスの位置とか、なんかデザインを変えるだけでもけっこうしんどい。

たぶん僕が理想とする完成形からするとまだ2割くらいしか実現できてなくて、しっくりするのはいったいいつになるのやらって話です。

オリジナルのバナーがいい感じ

そんな中で息抜きでもないんだけど、最近オリジナルバナーというのにハマってます。画像をクリックすると別のサイトにリンクされるアレですね。

すでにFeedlyのバナーは自作のものに変えてまして、お気付きの方も中にはいるかもしれません。

こんなやつ。

こんな感じで上のバナーをクリックするとFeedlyの登録ページに飛ぶわけ。
blog_banner

ようするに画像の中にリンク先のURLを仕込ませてるだけなんですけどね。

それで今回はこんな風に別ブログ用のバナーを作ってみました。(リンク仕込ませてあります)

▼ 心中お察しください。
心中お察しください。

▼ 楽描さん
楽描さん

いままでこういうバナーってのは「高価なソフトで専門的な知識がないとできないのだろうな」なんて決めつけてましたが、アイデアしだいでどうとでもなるんだなーと感じました。

Macの「keynote」とiPhoneアプリ「合成写真スタジオ」で作っちゃう

使うソフトはMac純正の「Keynote」とiPhoneアプリの「合成写真スタジオ」だけです。

Keynote

2,000円
(2014.11.12時点)
posted with ポチレバ

手順としては、素材となるイラストを用意したらiPhoneで写真を撮りそのまま合成写真スタジオで背景の透過処理をします。

次にMacでバナーと同じ大きさの画像をスクショまたは、ブログに貼ってあるバナーを抜き出してデスクトップへ。そのあとスクショした画像をkeynoteに貼りつけて下地が完成です。

下地の画像は大きささえ合ってればなんでもよく、画像の中身を変えたいなら希望の画像を重ねてスクショするだけ。

iPhoneで透過処理したイラストをkeynoteに入れるときは、その画像をいったんFacebookに非公開で投稿します。iPhone/Macの同期が早いので僕はいつもこのやりかたですね。

あとはFacebookからイラストをダウンロードしてkeynoteで下地処理した画像と重ねて終わり。めっちゃ簡単でしょ?

この作業のポイント

この作業でポイントとなるのは、keynoteとFacebookです。

なぜkeynoteを使うのかというと、文字と画像のバランスをとるのにめっちゃ便利なんですよね。

お気に入りのフォントで大きさや色、位置を自由に決められて、なおかつ画像の大きさや位置も自由自在。

そしてもうひとつのポイントのFacebook。

iPhoneから非公開で写真(イラスト)を投稿してすぐにMac側のFacebookからダウンロードする。手間がかかってるように感じるかもしれませんがまったくそんなことはないです。同期の早さがポイントかなーと。

まとめ

20141027125548-1

いかがでしょうか。ちなみにこの方法は画像の形式は特に意識してませんw

形式を変えるなら、Mac純正のプレビューやSkitchでやればいいと思います。

もしこんなバナーでよければイラスト込みで承りますよー!個別にご連絡ください(ちゃっかり)

記事が参考になったりおもしろかったら
いいね!してね( ´ ▽ ` )ノ

Twitterでマツオユキを