• ピックアップおすすめ記事

LINEやFacebook、Twitterなどのヘッダーどうしてる?無料アプリでつくろーよ。…まさかまだ風景画じゃないよね?

LINEやFacebook、Twitterなどのヘッダーどうしてる?無料アプリでつくろーよ。…まさかまだ風景画じゃないよね?

やあ、カスタマイズ大好き諸君。

今日はどこをいじろうか?
フォント?壁紙?それともヘッダー?

おしゃれにする?それとも個性的にする?

僕は僕らしいカスタマイズにするよ。
それこそ僕しかできないコンテンツだからね。


 

ども、カスタマイズ初心者シゲ(@piece_hairworks)です。

ブログやFacebook、TwitterやLINEなどなど…今では多くのSNSやメディアが、誰でも簡単に始められますよね?誰でも始められるからこそ、ネット上では似たようなメディアが溢れてる。

時間の流れは速く、タイムラインは瞬く間にあなたの発信を押し流しています。

あなたが叫んだ一言は誰の目にも触れられず、そのままネットの海へ…

Avatar image
ワイフ
なにわけのわかんないこと言ってんの?早くブログ書きなよ。
Avatar image
シゲ
あ、はい…。スンマセン…。
Avatar image
偶然の産物
今日はなんの記事なんですか?
Avatar image
シゲ
あ、そうそう。要はみんなの目に止まるカスタマイズをしたらどうかなと思って。

そうそう、簡単に言うとそんな感じ。例えばヘッダーなんかはメディアの一番の看板みたいなもんだから、魅力的だと「おっ?」てなるんだよね。

▼うちのブログだとここがヘッダーになるのかな??

スクリーンショット 2015-06-24 13.52.51

もちろん見た目重視じゃダメなんだろうけど、第一印象って大事だと思うんだよね。

今日は無料アプリで個性的なヘッダーを作る方法を教えてもらったから、シェアしたいと思います。作り方はこちらからどうぞ。ノリハナ(@infnity_87_)さんから教えていただきましたー。ありがとうございます。

Avatar image
ワイフ
またやっぱりパクリだー。
Avatar image
シゲ
パクリではない。シェアと言いたまえ、失敬な。そしてだな、言わせて貰えば自分の実体験を交えることで、コンテンツとは全く新しいコンテンツに生まれ変わるのだ。そもそも、コンテンツとは…
Avatar image
偶然の産物
パクリメディア〜
Avatar image
シゲ
うるさーーーい!ノリハナさんに「やってみてください」って言われたからいいんだー!!


ということで、オリジナルヘッダーを作ってみます

ではオリジナルのヘッダーを作ってみます。

使用するアプリは3つです。画像編集はMoldivTwin Collageの2つ。サイズ調整はバッチリサイズを使います。

MOLDIV - フォトエディター、コラージュ、ビューティーカメラ

MOLDIV – フォトエディター、コラージュ、ビューティーカメラ
開発元:JellyBus Inc.
無料
posted with アプリーチ

Twin Collage - 2枚の写真を並べて1枚にまとめる簡単コラージュアプリ for Instagram, LINE, Twitter, Facebook

Twin Collage – 2枚の写真を並べて1枚にまとめる簡単コラージュアプリ for Instagram, LINE, Twitter, Facebook
開発元:FANG Inc.
無料
posted with アプリーチ

バッチリサイズ2 - 複数の写真をまとめてリサイズ

バッチリサイズ2 – 複数の写真をまとめてリサイズ
開発元:Koichi Otera
無料
posted with アプリーチ
Avatar image
ワイフ
いよいよパクリメディアだな。うん。
Avatar image
シゲ
僕のブログ訪問者がヘッダーに困っていたら、君はどう責任を取ってくれるんだい?
Avatar image
偶然の産物
そんな都合のいいことはないと思うけど…。

どれも無料のアプリなんで、ダウンロードしておくと便利ですよ〜。

それでは改めて僕なりのヘッダー作りスタート!

まずは使いたい写真をたくさん選びましょう

今までに撮った写真の中で自分のお気に入りだったり、キレイな写真をできるだけたくさん用意します。

▼iPhoneなら新規アルバムを作った方が分かりやすくていいですよ。

IMG_0041

そしたらそこにお気に入りの写真を放り込みましょう。これで使う画像が「どこだっけ?」って探さなくてもいいですよ。

まずはMoldivでコラージュを4つ作りましょうねー

さて下準備できたら、ここからうまい具合にコラージュしていきますよ。

4つコラージュを作るので、ぜひお洒落なコラージュ作ってくださいね!Moldivを起動させたら分割数を選んでいきます。

▼1.お好きな物を選んでいきましょう!

IMG_0723

Avatar image
ワイフ
へー無料なのに結構しっかりしてるー。マガジンタイプとかもあるんだね。
Avatar image
シゲ
そうなんだよ!意外とテンプレートも豊富だからいい感じ。

▼2.はめ込みたい箇所をタップし、画像を入れていきましょう。

IMG_0724

▼3.アルバムを選んで好きな写真をタップしていくと、一つずつはめ込まれていきます。

IMG_0726

▼4.そしたらコラージュできあがるんで、微調節した後に右下の共有からカメラロールへ保存します。

IMG_0727

Avatar image
ワイフ
あっ!ゆきちゃん(実家の犬)だ!かわいいー!
Avatar image
シゲ
ちゃんと入れといたよー!他にも色々いるよ!
Avatar image
偶然の産物
なんか変なのも混ざってるような…。

※ここでノリハナ(infnity_87_” target=”_blank”>@infnity_87_)さんは写真の端っこを調節してますが、僕はそのままやりました。きになる方は調節してくださいね。

 

IMG_0875

▲右下のボタンで写真間隔を0にします。

引用元:[n❁h]アプリ2つで簡単に出来る!ごりゅご.com風ヘッダー画像はこう作れ! | NORY*NOTE

▼5.画像の大きさも選べます。僕は欲張りなので最大解像度でw

IMG_0728

解像度が高いと容量が圧迫されるので、お好みで選んでくださいね。

Avatar image
ワイフ
よくその16GBのiPhoneでやってられるね。

▼6.これで一つコラージュができます。

Processed with Moldiv

ここまでの作業を4回繰り返す正方形のコラージュが4つできますよね?

▼こんな感じで。ここまでがMoldivの仕事でーす。デザインも色々なんで、何度かやり直して気に入ったのを作ってみてください。

Processed with Moldiv

Processed with Moldiv

Processed with Moldiv

Processed with Moldiv

Avatar image
ワイフ
わー結構可愛いのができるんだねー。ちゃんとあたしも入ってる!
Avatar image
偶然の産物
ぼ、僕もいるー!
Avatar image
シゲ
ちゃんとみんな入れておいたからねー!

あとはTwin Collageをつかってこの4つの写真を合成するだけです。

ここで使っているアイコンはこのアプリで作りました。

こちらもチェック 顔出しNGのクレイジーワイフがStampmeで自分のアイコン作ったよ。 

もう一つのTwin Collageで4つの写真を合成してみましょう

ここからはTwin Collageをつかって、【2つの写真を1つにする】→【その写真を2つ作る】→【その2つを1つに合成する】という流れで横長のヘッダー画像を作ります。

Twin Collageを起動して、Moldivのアルバムから好きなものを2つ合成します。

IMG_0737

▼1枚選択したら、左の「+」を選んでもう一枚を追加します。決まったら真ん中の☑️マークを押します。

skitched-20150625-090907

この手順を2回繰り返し2枚の写真を作ります。

Avatar image
ワイフ
…なんかもうめんどくさくなってきた。あとでやろ。
Avatar image
シゲ
ちょっと写真が多くて訳わかんないだろうから、時間があるときにやる方がいいですよー。
Avatar image
偶然の産物
ぼ、僕もコラージュに入ってるー!うれしいー!

▼4枚の写真を合成したらカメラロールに保存しましょう。

skitched-20150625-091640

あとはこれを使いたいメディアのヘッダーに載せるといいですよ。

Avatar image
ワイフ
これ、TwitterとかFacebookの背景に使うとオシャレかも!
Avatar image
シゲ
相手の好きなものだったら、見てもらった人に共感してもらえるかもね!
Avatar image
偶然の産物
焼肉の写真!シゲさん、焼肉好きですもんね!

僕はブログのヘッダーに使ってみた。が…。

せっかくだから僕もこの画像を使ってみた。いい感じのやつになるかと思ったんですが…。

▼こんな始末。

スクリーンショット 2015-06-24 13.19.06

Avatar image
ワイフ
ありゃりゃ。これじゃロゴがみえないね
Avatar image
シゲ
うーん。写真の中にロゴを入れるかしないとダメか。仕方ない、Twitterのヘッダーにしよう。
Avatar image
偶然の産物
調整が必要みたいですね。

仕方ないので、これはTwitterの背景に使うことにしました。サイズが少し合いませんが、これはこれで気に入っています。もしジャストサイズが必要なら、リサイズする必要がありますね。

▼リサイズするならこちらのアプリの出番です!

バッチリサイズ2 - 複数の写真をまとめてリサイズ

バッチリサイズ2 – 複数の写真をまとめてリサイズ
開発元:Koichi Otera
無料
posted with アプリーチ

▼各SNSの画像サイズは以下を参照してください。

Twitterヘッダー画像

サイズは 5 MB までで、推奨サイズは 1252 x 626です。2:1の比率だとうまくいくようです。

Avatar image
ワイフ
コラージュも4つより2つの方がうまくいきそうだね。

Facebookヘッダー画像

ページのカバー写真:

851559_648123611901820_1364307922_n

コンピュータでは幅851ピクセルx高さ315ピクセル、スマートフォンでは幅640ピクセルx高さ360ピクセルの大きさでページに表示されます。
フィーチャーフォンでは表示されません。
元のサイズは少なくとも幅399ピクセルx高さ150ピクセルである必要があります。
幅851ピクセルx高さ315ピクセルで、100キロバイト未満のsRGB JPGファイルだと読み込み時間が短くなります。
ロゴやテキストを含むプロフィール写真やカバー写真には、PNGファイルを使用すると、より良い結果を得ることができます。

引用元:Facebookページのプロフィール写真やカバー写真のサイズはどのくらいですか。 | Facebookヘルプセンター

Avatar image
偶然の産物
Twitterとはちょっと違うみたいですね。

LINEのヘッダー画像

LINEのホーム画像大きさは正式に公開されていません。

自分のiPhoneで試したところ500×400くらいの大きさが綺麗に収まる大きさとなりました。

基本的にはそれ程サイズを気にせずにトリミングをして上手く表示させるのが良いでしょうね。

引用元:LINE(ライン)のホーム画像の大きさ(サイズ)を教えて下さい

Avatar image
シゲ
LINEもサイズ感が少し違うみたいです。コラージュの大きさを調節できるものに変えたほうがいいですね!

うまくサイズ感を調整して使ってみてくださいね!

▼僕のTwitterはこんな感じになりましたー!

スクリーンショット 2015-06-24 18.33.44

Avatar image
シゲ
うん。割といい感じになったんじゃないかなー!

あとがき!

ちゃんとロゴもコラージュの中に入れ込んだら、綺麗なヘッダーになるのかもしれません。でもめんどくさいので今回はTwitterだけ変えてみました。

いろんなコラージュタイプがあるので気分で変えてもいいかもしれませんね!

Avatar image
ワイフ
結局めんどくさくなってるー。
Avatar image
シゲ
途中で何度やめようかと思ったか
Avatar image
偶然の産物
でも、Twitterいい感じになりましたね!シゲさんらしいですよ!

ヘッダーに限らず、旅行に行った時のアルバム作りなんかにも使えるので便利です。Twin CollageもブログでiPhoneの画像を並べたいときなんかは、かなり役立ちますよー。

Avatar image
シゲ
この記事書くのもTwin Collageをつかってるしね。

長くなりましたが、最後までありがとうございますー。お役に立てるといいなあ。

追記

コラージュに使うおしゃれな画像がないなら、無料で使える画像を色々ダウンロードできるサイトがオススメ!この記事も参考にしてみてねー!

招待状や広告を作るのにもオススメ!オシャレなフリー画像サイト&ウェブサービス12選

ははは、じゃあねー!( ´ ▽ ` )ノ

この記事が気に入ったら
『いいね!』してね

Twitter でシゲを

Sponsored Link

コメントをどうぞ!

*
*
* (公開されません)

Facebookからコメントする