分かりにくい図を、分かりやすくする

分かりにくい図を、分かりやすくする

今回は「分かりにくい図を、分かりやすくする」というテーマでお話したいと思います!
このテーマを選んだ経緯なんですが、ある日、このような依頼が来ました…

「この図を、分かりやすくしてほしい。」

事業系統図

実は、今月(5月)から、弊社オールコネクトのコーポレートサイトが新しくなりまして、(唐突な宣伝すみません)サイト制作時に、「この図分かりにくい!」ということで、再度デザインすることになったのです。

なぜわかりにくいと感じるのか

当たり前ですが、情報が整理されていないからだと思います。
そこで今回「IT Pro日経コンピュータ」の記事で見つけた、「分かりやすい図を作る5つの鉄則」というものを使ってみました。
http://itpro.nikkeibp.co.jp/atcl/column/15/100100236/100100001/?rt=nocnt

「分かりやすい図を作る5つの鉄則」とは

鉄則①「図を作る目的と伝える相手を明確にせよ」
鉄則②「1つの図で1つのテーマを伝えよ」
鉄則③「文字や図形の要素を絞り込め」
鉄則④「一番伝えたい部分を目立たせよ」
鉄則⑤「視線の流れを一定にせよ」

こちらに1つずつ情報を当てはめて、整理していきたいと思います。

鉄則①「図を作る目的と伝える相手を明確にせよ」

作る目的が、今の図がわかりにくいので、わかりやすくする。そして伝える相手が、コーポレートサイトに訪れる人ですね。

鉄則②「1つの図で1つのテーマを伝えよ」

この図のテーマは、オールコネクトの事業内容。

鉄則③「文字や図形の要素を絞り込め」

文字情報量はこれ以上減らすことができないので、矢印は矢印同士で固め、コンテンツの大きさにメリハリをつけることで、コンテンツ単位で情報を絞り込みました。

鉄則④「一番伝えたい部分を目立たせよ」

一番伝えたい部分はオールコネクトが流れの中心にいること。

鉄則⑤「視線の流れを一定にせよ」

左右対称の図にして、矢印の流れに規則性を作りました。
以上のように、情報を整理して完成した図がコチラです。

business

 

以前のものと比較すると、大分整理できたのではないかと思います。ちなみに、元図の中央にある「ONE STOP + IN HOUSE」は、他ページで改めて説明するということで、省かせていただきました。
※実際にコーポレートサイトに掲載されている図は、装飾的にブラッシュアップされたものになります。

文字情報の段階で整理することが重要

最後にまとめになります。

①大切なのは、図もデザイン同様、文字情報の段階で整理して伝えたいことを明確する。
②図の作成で困ったときは、「5つの鉄則」に当てはめて、問題点を明確にしてみる。

「これをもっと見やすく」なんて言われちゃうと、ビジュアルをスッキリしようと思うばかり、こて先でデザインをいじくり回してしまいがちです。「なぜ分かりにくいと感じるのか」を考えて、もう一度文字情報に起こしなおして考えてみると、案外原因が分かったりします。

 

参考文献:ITpro by日経コンピュータのインターネット記事
「ワンランク上に行く、図解の鉄則と応用テクニック」2016年4月21日アクセス
http://itpro.nikkeibp.co.jp/atcl/column/15/100100236/100100001/?rt=nocnt


Previous: 文字詰めについて Next: 色で決まる!ぱっと見の印象作り。

© 2017 ALL CONNECT Inc. All Rights Reserved.