ジャンプ率で引き締まったレイアウト

| コメント(0) | トラックバック(0)
━━━━━━━━━━━━━━━━━━
デザインパワー007
魔法のレイアウト術-2
━━━━━━━━━━━━━━━━━━

◇1.アイデア
◇2.レイアウト
◇3.フォント
◇4.カラー

の4つのテーマからお役立ちデザイン情報を掲載しているこのブログ。
今回のテーマは「レイアウト」です。


え〜、突然ですが、「ジャンプ率」って知ってますか?

月曜日の通勤電車の中で、少年ジャンプを持っているサラリーマンの率。
・・・ではありません。

かんたんに言うと、文字の大きさの大小比率のことです。これが、デザインの上では非常に重要な意味を持ってきます。

分かりやすい例として、新聞で言うと、

・必ず「見出し」があって、「本文」がある。
・そして「見出し」は大きくて、「本文」は小さいはずです。

もし、「見出し」と「本文」の文字サイズが同じだったらどうなるか?自分に必要な情報を探すのが、とたんに困難になります。

だから、「ジャンプ率」を上げて「見出し」を目立つようにし、飛ばし読みができるようにしているのです。

適度な「ジャンプ率」をつけておくことで、読む人・見る人に、必要な情報を、必要なだけ伝えるデザインが可能になります。

日常で見かける「企画書」や「プレゼンテーション資料」を見ると、実際にこの「見出し」と「本文」の「ジャンプ率」を有効に使っている人は、以外に少ないものです。(ToT)

「ジャンプ率」の効果を知っているのと知らないのとでは、長い間に勝ち組と負け組との差になります。

しっっっかりと「ジャンプ率」の使い方を身につけておきましょう。

------------------

そのために、ここで分かりやすく商店街に例えてみましょう。

あなたは、この「商店街」を魅力的に作り上げ、お客さんに気に入ってもらうのが目的です。

・デザインしようとする対象(企画書やプレゼン資料)が商店街。
・1つ1つの記事(「見出し」と「本文」)は、店舗。
・「本文」は、店内や商品。
・「見出し」は、看板。
・デザイン対象(企画書やプレゼン資料)を見る人は、商店街に来たお客さん。

という設定です。

まず、「商店街」がうまく機能するためには、それを構成している「お店」がきちんと「看板」を出しておく必要があります。

お客さんは、「看板」を見て何のお店かを判断し、店内を覗いてくれますし、どんな「商店街」なのかを「看板」を見回すだけで知ることができるのです。

このように「看板」はとても重要です。お店の商品を代表して表現している、そんな魅力的な「看板」を作るように注力しましょう。

「看板」を大きくすれば、「商店街」は「にぎわい」「元気」「親しみ」を。
「看板」を小さくすると、「品のある」「大人しい」「静かな」イメージの
商店街になります。

それぞれの「商店街」に合ったジャンプ率で「看板」を出しましょう。

基本的に「看板」の大きさは揃っていた方が見やすいでしょう。
しかし、意図的に大きさを変化させ、より動きのあるダイナミックな「商店街」を作ることも可能です。


そして最後に、あなたは自分の「商店街」をより良くするために、他の「商店街」を見て、良いところを真似、悪いところは直しましょう。

ヒントになる「商店街」は、どこにでもいくらでも転がっています。
それを、あなたが意識を持って見るか否か、だけなのです。


今回のデザインパワーは、

・「ジャンプ率」で勝ち組に! でした。


━━━━━━━━━━━━━━━━━━
 超得おすすめの一冊!
【【基本はかんたんレイアウト】】
------------------

「ノンデの杜」では、「ノンデザイナーズデザインブックSecond Edition」を「レイアウト」の基礎が分かる、教科書的存在として紹介してきました。

そして、次のステップへと導いてくれる良書をずっと探し続けてきました。
なかなか無いんですよね。自信を持っておすすめできる書籍って。

そして、やっと見つけたんです。
「レイアウト」の基礎から応用までを実践的に解説してある「使える良書」を。

それが、「基本はかんたんレイアウト」です。
分かり易いデザイン関連本を多く手がける、視覚デザイン研究所の出版。
 
「レイアウト」を3つの「テイスト」と5つの「エレメント」で分類し、ユースフルテイスト・カジュアルテイスト・情報量・静動性・図文率などを組み合わせることで、最適なレイアウトを簡単に導き出すことができます。

学習編・分析編・実践編となっており、各ステップごとに多くの図版を用いて解説。自然に理解を深めることができます。

手元にあると安心の一冊です。



トラックバック(0)

トラックバックURL: http://non-designer.com/blog/mt-tb.cgi/6

コメントする