Loading

バナーの作成について

振り返り

たかだ
たかだ

 余白やグループ化、アクセントをむやみに使うのではなく必要な時に必要な量使用していこうと思う。枠の中に文字を入れる時は、読みづらくなる可能性が高いので、文字の大きさや角丸はよく気を付けようと思う。

学びまとめ

余白について


 むやみに文字を大きくしたりせず、ゆとりをもって配置できるようなスペースを取る。「文字とスライドの端」、「文字と文字」、「文字と図」の間にはしっかりとスペースを空ける。

余白のポイント①作品の周りに余白を取る
コンテンツの周りには、最低でも本文の文字の1文字分の余白を設けるようにしてみる。2文字分くらいの余白をとると、かなりゆったりした作品になり確実に見やすい。

余白のポイント②各項目の周りにも余白を取る

枠の中に単語や文章を入れることがある。このとき注意したいのが「ニアミス」。文字が枠のギリギリになってしまうと、枠の近くの文字が非常に読みにくくなる。文字は線の要素で、枠線も線の要素であるため、互いに接近したときに干渉し合ってしまうため。

余白のポイント③ 枠の中は窮屈にしない
枠の中の文字が窮屈すぎると読みにくい上に、印象もよくない。どうしても枠を大きくできないとか、文字数を減らすことができない場合ならば、少々文字を小さくした方が読みやすいこともある。
枠の中は窮屈にしない特に角丸の使い方には気を付ける。

配置した内容のグループ化について

 単調にレイアウトされると直感的に理解しにくい場合でも、内容に即してグループ化を行なうことで、全体の構成やロジックが理解しやすい。関連の強い文章と写真同士を近くに配置(=グループ化)すると内容を直感的に理解しやすくなる。また、関連の弱いものは少し離して配置する(上下でスペースを取る)ことで、グループ化が強調される。

グループ化のポイント①近接(Proximity)
近接とは、関連する項目をまとめてグループ化すること。切れ目のないテキストのままでは、文頭から文末まで読まなければ内容を理解できない。それぞれのグループ間の距離を少し大きめに取ることで、直感的に情報の構成を理解できるようにして、同じ種類や系列の情報を近くに配置する。

グループ化のポイント②整列(Alignment)
近接と同様に直感的に情報の構成を理解できるようになる。整列を用いることでページの内容に一体感が生まれると同時に、組織化につながる。また、整列を利用するときは、目に見えない線を意識する。

グループ化のポイント③反復(Repetition)

デザイン上のある特徴を繰り返し使用することを反復という。反復させるものは、太字体、罫線、色、アイコンなど様々なものがあり、要素を繰り返し用いることで一貫性や統一感のあるレイアウトを実現できる。また、一度理解したデザイン構造が他の要素にも適用されるため、情報をすばやく取得できるようになる。

アクセントのポイントについて

アクセントのポイント①コントラスト(Contrast)

コントラストとは、2つの要素が異なる場合に見た目をはっきりと異ならせること。情報の優先度を考慮し、重要な要素はより目立たせるなど差別化させる。具体的にはフォントの大きさや形、写真のトリミングに変化をつけることで他の要素と対比させる。要素を「まとめる」近接や整列に対し、あえて差別化することで、要素間の関係性を表現できる。

アクセントのポイント②ジャンプ率を変える
コンテンツの意図に合わせてジャンプ率を変えてみる。ジャンプとは、本文の文字サイズに対するタイトルや見出しの文字サイズの比率のこと。ジャンプ率が低いと落ち着いた印象になり、ジャンプ率が高いと躍動感のある印象になる。タイトルのジャンプ率を高くすればするほど、タイトルが強調される。絶対的な大きさではなく、本文に対する相対的な大きさが、目立ちやすさや躍動感を決めている。

アクセントのポイント③アイキャッチを考える
アイキャッチでより効果的にする。可読性を損なわずに、一瞬で人の目を捉えるための素材をアイキャッチャーと呼ぶ。文字や図形、イラスト、写る真などを効果的なアイキャッチャーにしてみる。文字の邪魔にならない範囲で背景に大きな絵を入れたり、ギザギザやふきだし等を配置することで、人の目を引くことができる。

コメント

タイトルとURLをコピーしました