デザインにおける「ナンバリング」の重要性を考える。　| 意味から考えるデザイン

こんにちは。ヒキノです。

最近は、1ヶ月ほど前よりJX通信社という報道ベンチャーでデザイナーインターンとして修行させてもらってます。(エンジニアなどのインターン生も募集してるみたいなので、興味ある人はぜひこちら)

というのは前置きにしといて、今回は、

デザインにおけるナンバリングの重要性を考える。

このテーマについて最近考えたことがあったので、綴ろうと思います。
(このテーマは、デザイナーやエンジニア向けの記事になりそうです。)

よくある例

いきなりですが、LP(ランディングページ)の「商品・サービス特長エリア」ときいて、どんなデザインを思い浮かべるでしょうか？
おそらく以下のようなデザインを思い浮かべるはずです。

これとか↓

これとか↓

よくあるパターンです。
実際にこうしたデザインのLPサイトは数多くあります。

ただこれをみて、何か分かりにくいと感じる方がいるのではないでしょうか？

ナンバリングで相手の頭に空のファイルを作ろう

さて突然ですが、一旦次の質問をさせてください。

あなたは「あなたの趣味を教えてください。」と聞かれ、
自分の趣味が3つあった場合、どう答えるでしょうか？

私の趣味は3つあります。1つ目は、〇〇です。〇〇はとても楽しいです。2つ目は、△△です。△△は、とても楽しいです。3つ目は、□□です。□□は、とても楽しいです。

多くの方は、このように最初に全体像(Whole)を伝えてから、話の各部分(Part)を説明していくのではないでしょうか？

実際にこのような話し方を「ホールパート法」といい、小学校の作文を書くときとかにも教えられる私たちに馴染みの近い論理構造です。

また上記の回答を見ると、「ナンバリング」(=数字をふって順序つけること)という行為も同時に使われています。(ナンバリングの方法などは、こちらの記事を参照してください。)

この「ホールパート法」と「ナンバリング」を組み合わせ、「私の趣味は3つあります。1つ目は、〇〇です。〜」と伝えることで、相手の頭の中に「今から3つくるぞ」と予測させ、3つの空のファイルを用意させることができます。

よくある例をこうしてみる

このように、日々無意識に使っている「ホールパート法」と「ナンバリング」を用いた話し方・伝え方を、ビジュアルデザインの世界にも落とし込む必要があるのではないでしょうか？

先ほどのよくある例を改善してみます。

また各要素の内容が多い場合、下のように例1-2と例2-2を組み合わせて表現する方法も分かりやすいです。

どうでしょうか？

最初よりも論理構造がはっきりし、情報がすんなりと入るような感じがします。特に各要素が縦に並ぶ場合(例2の場合)、デバイスによっては1画面で全体構造を捉えることができなく、スクロールをする必要があります。そのため、より一層この「ナンバリング」が論理構造を分かりやすくさせるために重要な役割を果たしていると感じます。

こんな感じで、論理から考えるデザインについて今後も発信していきたいと思います。

ご一読ありがとうございました。