ジャンプ率って何？その１：「デザインがちょっと良くなる」のぶのクリエイティブ講座

もはやSNSマーケティングが当然の世界、SNS担当者やショップオーナー自身がクリエイティブを作って発信するシーンが多くなり、さらにCanvaやFigmaなどの登場によって手軽に綺麗なデザインを作ることができるようになったわけですが、基本的な「デザインのルール」を知っておくことで、よりメッセージが伝わりやすく、より効果が上げられるようになるかと思います。

自分もいちユーザーとしていろいろなショップやサービスの投稿を目にする中で、あれ？意外とこれ知らない人多いのかも？というデザインの基本的なルールをご紹介できればと思います！

今回のお話は、Instagramのストーリーズに乗せるテキストやストア内のバナー、画像の文字入れ全般に通じるお話ですのでぜひご一読いただければと。

まずは簡単に自己紹介

私はグラフィックデザインのスキルを活かしてKIBACOWORKSというウッドクラフト&アパレルのブランドを運営しているのぶと申します。

商品のデザインから撮影、ECサイト運営のあれこれや日々のSNSの投稿も自身で手がけています。

文字のジャンプ率

今回のお話のキッカケはDMMチャットブーストのユーザーコミュニティ「Booster」のマネージャー”がっきー”からの「アイキャッチ画像を変えたい」という相談から始まります。

ジャンプ率とはデザインの中の「文字の大きさの違い」のこと。

これを知っているとデザインにリズム感が出て、情報に序列が生まれ内容が伝わりやすくなります。

元のデザインを見てみると

ロゴや見出し、補足情報、要素ごとの文字の大きさがほとんど変わりません。
むしろ見出しよりロゴのほうが大きいまである。

ジャンプ率が低いと単調になってしまい、パッと見でどこに視線を持って行けばいいかわかりづらいです。すると、要素を一つずつ順番に読み込むことになり、情報を理解するのに時間がかかってしまいます。

よく人が看板を見る時間は0.何秒だとか言われますが、目を止めるのは本当に一瞬。ストーリーズで広告が流れてきても即次へタップしちゃいますよね。俺はします。１秒かからない。

なので一瞬で目の引っかかりを作って、手（目）を止めさせなければならないのです。

一番伝えたいことは何か

まずは一番のキモを決めてドーンとデカくしちゃいましょう。きぬた歯科方式です。
中途半端はダメ、思いっきり。
この場合一番伝えたいであろうタイトルを大きくしてみました。

どうでしょう？
これもう「モノ売りコト売り」を読むしかなくないですか。

画像サイズを小さくして並べて見るとわかりやすい。
右のほうがパッと情報が入ってくると思います。

気になるトピックスをまず一番に伝えたい

ジャンプ率をつけることで「モノ売りコト売り」という言葉に目が止まった人が次に、補足情報として「共感戦略の話なんだ」「〇〇ってブランドの話なのかな」と順番に情報を追う目の導線ができ上がります。

助詞や接続詞の扱い

一文の中だったとしても「と、から、より」のような単語を繋いでいるような言葉は小さくしてOK。日本人は言葉を略すのが好き。それでも十分意味は伝わります。

目から脳に飛び込むために、不必要な情報は小さくしてなるべく簡潔に伝えたい。

情報の表現

二つ目のクリエイティブは、テレビ・YouTubeに出演するきっかけがあったお店の事例紹介記事。
10秒ぐらい眺めてどうするか考えてください。

こちらもタイトル文の文字の大きさは一定。
今回は文字の見せ方も少し変えます。

考えたこと

• 「TV」より「テレビ」のほうがカタカナで読みやすそう
• 「youtube」→「YouTube」公式の表記に合わせる（人は形で文字を認識している）
• 「取材など」→「出演が決まった！」（自分ごと化できそうな言い回し）
• 集客前に→書かなくてもわかりそうなので割愛

今回はジャンプ率に加えて、情報もシンプルに伝わりやすい表現に変えました。
情報の見せ方（表現）×ジャンプ率の合わせ技で可読性、視認性が上がるように考えています。

やはり文字の大きさは正義。
文字を小さくすると「読まれないかも…？」と不安になるかもしれませんが
全部がでかいと単調で目が止まらず、逆にすべてを読まれない可能性が上がります。

このように、情報の表現にも気を配りながらジャンプ率を意識することで
圧倒的に伝わりやすいクリエイティブに進化します。

いかがでしたでしょうか？

気になるがっきーの本名は？年齢は？彼氏はいるの？
今後もBoosterコミュニティから目を離せません！！

次回は、さらにInstagramのストーリーズを例にジャンプ率と情報のグループ化についてお話ししたいと思います！

今回のクリエイティブはLINEで話しながら５分ぐらいで作ったものなので細かいデザインの指摘はご勘弁を🙏
あくまでジャンプ率って何？を伝えるものということで。

ちなみに今回のアイキャッチ画像もジャンプ率を意識して作っています。
黒猫はうちの飼い猫「おはぎ」です。

それでは引き続きよろしくお願いしますん！

あわせて読みたい

【ノンデザイナー向け】ECサイトのバナーをちょっとイイ感じにするコツを紹介

2023.4.27

良いバナーデザインとは？バナー作成前に知っておきたいこと デザイナー歴10年のことりちゃんです。当サイト内では以下のようなバナーの制作に携わっております。 ECサイト向けにバナー制...

LP作成をご検討中の方必見！見やすいLPを作成するときのデザインの注意点をご紹介

2022.5.24

はじめてLP（ランディングページ）の作成を考えている方や、見やすいLPにするにはどうしたらいいのかお悩みの方も多いのではないでしょうか。LPはwebサイトよりも比較的簡単にかつ短期...

BASEで理想のショップデザインをするときにかかる費用とおすすめの手段

2022.5.20

BASEのオフィシャルパートナーとしてショップオーナー様の制作支援やコンサルティング・有料デザインテーマの販売を手掛けている株式会社SHARESL（シェアスル）の兼石と申します。こ...