2009/08/05
Category: ヒロポンのオキラクデザイン DTPSCHOOL

円グラフと棒グラフは知ってるけど、その他はあんまり知らなぁ~い!
と言っちゃってるYOUのために、用途別にグラフを紹介しちゃう!
と言っちゃってるYOUのために、用途別にグラフを紹介しちゃう!
●誌面にグラフをレイアウト

旅行雑誌の誌面を想定して作ったグラフだよぉ~。
誌面での視線の流れを考え、グラフのスペースを割り出していこうね。誌面全体の流れをとめないようにグラフをレイアウトしよー。
グラフを目立たせるために地(地図)の彩度を低くしたよ。
誌面での視線の流れを考え、グラフのスペースを割り出していこうね。誌面全体の流れをとめないようにグラフをレイアウトしよー。
グラフを目立たせるために地(地図)の彩度を低くしたよ。

●まずはデータを整理

グラフには、いろんなタイプがあって統計のデータがどんな種類で何を伝えたいかで、グラフのタイプが決まってくるんだぁ。
■円グラフ
全体に対する割合を面積の比で表わしたグラフ。おなじみのグラフだよね。
■棒グラフ
数値を棒の長さで表わしたグラフ。これまたおなじみでありマース。
■量グラフ
棒グラフより、リアルに量感をピクトグラム(絵文字)を使って表した、親しみのあるグラフだよ。
■レーダーチャート
データの点を結んだ多角形でそのデータの変化がひとめでわかるグラフ。種類の異なるデータを一つのグラフにできるよ。
■折れ線グラフ
数量の変化の様子を、線で表わしたグラフだよ。
今回は旅行雑誌の誌面で使うグラフを作るよぉ! レイアウトの流れを考えたわかりやすいグラフ作りに挑戦だい!!
■円グラフ
全体に対する割合を面積の比で表わしたグラフ。おなじみのグラフだよね。
■棒グラフ
数値を棒の長さで表わしたグラフ。これまたおなじみでありマース。
■量グラフ
棒グラフより、リアルに量感をピクトグラム(絵文字)を使って表した、親しみのあるグラフだよ。
■レーダーチャート
データの点を結んだ多角形でそのデータの変化がひとめでわかるグラフ。種類の異なるデータを一つのグラフにできるよ。
■折れ線グラフ
数量の変化の様子を、線で表わしたグラフだよ。
今回は旅行雑誌の誌面で使うグラフを作るよぉ! レイアウトの流れを考えたわかりやすいグラフ作りに挑戦だい!!
●円グラフ

全体の割合がひと目でわかっちゃう円グラフはグラフの基本中の基本だよね。簡単にIllustratorの円グラフツールでできちゃうわけだけど、それで終わったら、おらっ! ヒロポン、マジで怒るからね。
円グラフをカッチョよく作るためには、項目ごとに色を分けると見やすくなるね。色を選ぶときもテーマに合った色にしたり、誌面全体のバランスを考えた色を選んだりするとイーよ。
でも項目数が多いときには、すべて色分けしちゃうとわかりにくくなっちゃうから、思い切って2.3色にまとめたり、項目ごとに切り離したり、文字組みでバランスをとるとばっちりキマるよぉ。

●円グラフのバリエーション

円グラフは正円から半円、扇形などさまざまな形に応用ができて、面積の比率を表わすというモノ。
とにかく円グラフは、ひと目でわかるための色分けに注意しなくちゃいけない!円全体の色の印象、隣り合う色のバランスに注意したら8割がた成功。カタチについては、立体にしてグラデーションにしてみたり、少し角度をつけ、斜めから見た視点で作っても面白いよ。
一番シンプルなグラフだからこそひと味くわえて、人とは違う見せ方をしたいところだね。

●棒グラフ

棒グラフも円グラフに続いて、マスターしておかなければならない基本のグラフでありマス!
棒の幅は体積や容量を表現する以外では、一定の幅にするのが基本。棒グラフもIllustratorの棒グラフツールで作ることができるけど、これまた単調すぎておもしろくないから手作業を加えていこー。
棒グラフをナイスに作るためには、棒の幅や間隔を調節するだけで情報がわかりやすく整理され、見栄えも格段に違うよ。そして、背面にくるX軸Y軸のグリッドを作ることで数量が一目瞭然になるから、はずせない要素でありマス。

●棒グラフのバリエーション

棒の方向はタテ、ヨコどちらでもOKだから誌面のデザインに応じて使い分けてね。色については、項目によっては変える必要がない時もあるね。
デザイン的に棒グラフは寂しくなりがちだから、数字や項目の文字の書体、サイズを変えるなどしてメリハリをだしてみよー。
1は棒の幅を変えてメリハリを出してみたよ。2のように、階層グラフや折れ線グラフなど、複数のグラフを同時に表現することも可能だよ。

●グラフ作りのアイデアも紹介!
●配色のルールを知ろう!
●DTPWORLD連載「ヒロポンのレイアウト学園」を読みたい方はこちらをチェック!