かもめのはとば Re:[2]

やわらか系、モバイルとかアプリとか法律とか色々。

twitterアプリ向けに画像最適化して訴求を最大化する



twitterの仕様変更でタイムラインに貼った画像がそのまま表示されるようになったようです。縦尺を取ることやそもそもタイムラインを散らかしてしまうため賛否両論の有る仕様変更ですが、気になった点が一つ。

本日数多く見受けられたののがアプリや商品を押し出すための企業アカウントで、せっかく画像を貼っているにもかかわらずモバイルの公式アプリで見た場合、画像サムネイルで大事な部分が切れて訴求が弱まってしまっている事例。
特に商品やキャラクターの顔が見切れてしまっているものなどはとても残念な感じになってしまっています。

ということで、どんな形で画像を作成すれば訴求効果が最大化できるのか、少し調べてみたので、現時点でわかったところまでをまとめてみます。

f:id:yrik:20131101020743p:plain

 

記事を投稿するにあたりインパクトを与えるためにもすごく使えると思います。
タイムライン上でグラフが入ると、とても目立ちますよね?

以下、全てiPhone5s+iOS7.0.3+Twitter公式クライアント5.12での検証です。

■モバイルでの画像サイズ

・大きな画像を貼った場合のサムネイル画像枠は縦230px、横480px程度でした。
・横幅が枠より小さい場合、枠いっぱいまで縦横の比率はそのままで拡大されます。
・横幅が枠より大きい場合、枠のサイズまで縦横の比率はそのままで縮小されます。
・横幅の拡大縮小の後、はみ出した画像部分は上下カットされますが、上がどれだけ、下がどれだけカットされるかは不定のようです。(上が大きく切られたり下が大きく切られたり。なんらかの法則性があるのかも?)
一定以下の画像サイズはサムネイルが表示されないようです。(閾値を探りきれず…)

f:id:yrik:20131101022754p:plain

上記は4:3の画像をアップしていますが、上下がトリミングされています。

■確実に見切れない訴求を行う為には

確実な方法は縦横比をほぼ1:2で画像を製作し、極力縦の中央に要素を集中させることです。縦長の画像に関していくつか比較を行ったのですが上を大きくカットされたり、下を大きくカットされる等まちまちな為(前述の通りなんらかの法則性はあるのかも?)、縦長で画像を作るのはハイリスクだと思われます。
横長の画像に関しても、空間を活かして端に訴求をしたいものを固めたり、キャプション(売り文句)を上下ギリギリに配置すると見切れが発生する可能性が上がります。
特にありそうなのがEC、ファッション系でモデルさんの顔がスパッと切れたり、靴を訴求したいのに足下が全部見切れてしまったりすること。そういった画像は素直にtwitterから遷移した先のランティングページに設置、twitter側は上記の最適化を行った方が訴求力が上がりそうです。

 

■関係ないけどおまけ

画像が出る事で今まで以上に飯テロ被弾率も上がってしまうんだなあ今後…w