ポスターは縦に長いから、四角い場所にはのらない。よく言われるこの前提を、測って検証した。投稿の画面では全部のる。切っているのは、一覧にしたときの格子と札である。どこで、どれだけ切られるかを測って、余白を決めた。
この研究を一言でいうと──絵がどこで、どれだけ切られるかを測って、余白を決める記録。
「のらない」は誤り
Instagram の投稿は 1080×1350(4:5)。実際の投稿を測ると 1170×1463、比は 0.7997 で、4:5 とのずれは 0.03%。A判のポスターを置いても、投稿の画面では左右に 5.8% の余白が出るだけで、全部見える。
切るのは格子
プロフィールの3列の格子では、4:5 の投稿が正方形に切られる。上下が 10% ずつ、1350 の高さなら 135px ずつ消える。ポスターを高さいっぱいに置くと、題字の頭と、足もとのクレジットがそこに入る。
| 置き方 | 大きさ | 格子で |
|---|---|---|
| 高さいっぱい | 954×1350(面積88%) | 題字の頭とクレジットが切れる |
| 格子を前提にした最大 | 781×1105(面積59%) | 全部残る |
測った投稿は、余白を上 5.9%・下 12.2% に取っている。下が上の2倍。格子で切られても中身が残り、切られると重心が上がるぶん、先に下を重くしておく。格子が 4:5 で出る表示でも、この余白なら崩れない。
地は純白にしない
余白を純白にすると、画面の白と溶けて、ポスターの縁が消える。わずかに黄みのある紙の色(#F4F2EC)にすると、1枚の紙として浮く。
一覧の札も切る
出品サイトの一覧では、画像の上下が 115px ずつ切られた札(1220×1009)で並ぶ。題字を版面の外まで出す組み方は、札の中で字がはみ出し、隣の画像と並んだときに崩れて見える。端で切れる組み方は、1枚を大きく見る前提の組み方である。
載せる前の手順
- のせる場所ごとに、切られる範囲を先に測る。投稿・格子・一覧の札・共有のカード。
- 中身は切られない範囲の内側に、余白つきで収める。
- 余白は下を厚く。
- 作ったら、画素で中身の範囲を測って確かめる。
あなたの1枚は、一覧の中で何%見えていますか。
— 他の研究を読む