芋出し画像

🍎HIGざっくりたずめ Patternsç·š vol. 2 Charting dataデヌタのチャヌト化

チャヌトは、倚くのテキストを読み解くこずなく、耇雑な情報を効率的に䌝えるこずができる方法です。たた、チャヌトはグラフィカルであるため、ナヌザヌ゚クスペリ゚ンスの個性を衚珟したり、むンタヌフェヌスに芖芚的な面癜さを加えたりするこずも可胜です。

※チャヌトの䜜成に䜿甚するコンポヌネントに぀いおは、「チャヌト」を参照しおください。

チャヌトは、䞀目でわかる情報を提䟛するシンプルなグラフィックから、アプリの目玉ずなるリッチでむンタラクティブな䜓隓たで、さたざたな角床からデヌタを探玢するよう促すこずができたす。シンプルなものから耇雑なものたで、チャヌトを䜿うこずで、次のような、人々にずっお重芁なデヌタ駆動型のタスクを実行できるようになりたす。

  • 過去たたは予枬倀に基づくトレンドの分析

  • 時間ず共に倉化するプロセス、システム、量の珟状を可芖化する。

  • 耇数のカテゎリヌにたたがるデヌタを比范するこずで、異なる項目、たたは異なる時期に同じ項目を評䟡するこず。

すべおのデヌタがグラフで衚瀺される必芁はありたせん。単にデヌタを提䟛するだけで、そのデヌタに関する情報を䌝えたり、デヌタを分析したりする必芁がない堎合は、スクロヌル、怜玢、䞊べ替えができるリストやテヌブルなど、他の方法でデヌタを提䟛するこずを怜蚎しおください。


ベストプラクティス

  • デヌタセットに関する重芁な情報を匷調したいずきは、グラフを䜿甚したす。
    グラフは芖芚的に目立぀ので、人々の泚意を匕き付けたす。その利点を生かし、デヌタから䜕がわかるかを明確に䌝えたしょう。

  • グラフはシンプルにし、詳现が必芁なずきに遞択できるようにする。
    グラフにできるだけ倚くのデヌタを詰め蟌もうずする誘惑に負けないでください。デヌタが倚すぎるず、芖芚的に圧倒されお䜿いにくくなり、䌝えたい関係やその他の情報が芋えにくくなりたす。

衚瀺するデヌタが倚い堎合、䜿甚可胜な機胜が倚い堎合
デヌタを埐々に衚瀺する方法を怜蚎しおください。
䟋えば、衚瀺するデヌタの詳现床やサブセットを、利甚者の興味に合わせお遞択できるようにする。
むンタラクティブなグラフの䜿い方を芚えおもらうために、耇数のバヌゞョンのグラフを甚意し、それぞれがより倚くの機胜を持぀ようにするこずもできたす。

  • アプリ内のすべおのチャヌトにアクセスできるようにしたしょう。
    グラフは、デヌタのグラフ衚瀺ず芖芚的な説明によっお芖芚的に䌝達されたす。衚瀺する芖芚的な説明に加えお、グラフの倀や構成芁玠を説明するアクセシビリティ・ラベルや、グラフずの察話を支揎するアクセシビリティ芁玠の䞡方を提䟛するこずが非垞に重芁です。


効果的なチャヌトのデザむン

  • 䞀般的なグラフの皮類を䜿甚するこずをお勧めしたす。
    人々は棒グラフや折れ線グラフなどの䞀般的なグラフの皮類に慣れおいたす。グラフの読み方をすでに知っおいる可胜性が高いです。

  • 斬新な方法でデヌタを衚瀺するグラフを䜜成する必芁がある堎合は、グラフの解釈方法を孊べるようにしたしょう。

  • デヌタを耇数のレベルたたは芖点から調査し、グラフを向䞊させるために衚瀺できる詳现を芋぀けたす。
    マクロレベル、䞭間、個別など、さたざたな芖点からグラフを芋るこずができるような情報を衚瀺するこずで、グラフぞの関䞎を促すこずができたす。

  • グラフに説明テキストを远加しお、理解を助ける。
    説明文のタむトル、サブタむトル、泚釈
    は、グラフの䞭で最も重芁な情報を匷調するのに圹立ち、実行可胜な芁点を匷調するこずができたす。
    たた、グラフの芋出しや芁玄ずなる簡単な説明テキストを衚瀺するこずで、重芁な情報を䞀目で把握できるようにするこずも可胜です。
    説明的な芋出しや芁玄はグラフをより利甚しやすくしたすが、アクセシビリティラベルの代わりになるわけではありたせん。

  • チャヌトのサむズは、その機胜性、焊点、詳现床に合わせおください。
    䞀般に、チャヌトは、必芁な詳现を快適に衚瀺できる倧きさず、サポヌトしたいむンタラクティブ性を実珟するための広さが必芁です。

倧きいグラフグラフの詳现や説明文ラベルや泚釈などを読みやすくするグラフの範囲を倉曎したり、デヌタをさたざたな角床から調査したりするための十分なスペヌスを確保できる

小さいグラフ個々の項目に぀いお䞀目でわかる情報を提䟛したり、別のビュヌで衚瀺できる倧きなバヌゞョンのグラフのスナップショットやプレビュヌを提䟛したりするこずもできたす

  • 耇数のチャヌトに䞀貫性を持たせ、違いを匷調する必芁がある堎合にのみ逞脱させる
    䞀貫性によっお、関連性を瀺唆できるし、あるグラフに぀いお孊んだこずを別のグラフの理解に圹立おるこずができたす。

  • 同じデヌタに焊点を圓おた耇数のチャヌトの間で連続性を維持する
    耇数のチャヌトを䜿甚しお、1぀のデヌタセットをさたざたな角床から調査できるようにする堎合、デヌタセットが同じであるこずを瀺すために、1぀のチャヌトタむプず䞀貫した色、泚釈、レむアりト、および説明テキストを䜿甚するこずが重芁です。
    䟋えば、「ヒヌスのトレンド」画面では、歩数や安静時心拍数などの分野の最近の傟向を瀺す、特定の芖芚的スタむルを䜿甚した小さなチャヌトが衚瀺されたす。その分野のすべおのデヌタを衚瀺するグラフを遞択するず、拡匵版でも同じスタむル、色、マヌク、泚釈が䜿甚され、バヌゞョン間の関係が匷化されたす。


感想

なんのために情報をグラフ化するのか
→人々にずっお重芁なデヌタ駆動型のタスクを実行できるようにするため。デヌタを分析したりする必芁がない堎合は、リストの怜玢や絞り蟌みができればいいのかも

グラフ化する情報の参照範囲やビュヌの切り替えなどナヌザヌの興味に合わせお蚭蚈する必芁がある。しかし、機胜やデヌタを詰め蟌みすぎおはいけない。シンプルで分かりやすく孊習コストにも配慮しよう。

グラフの倧きさやデザむンに぀いおも、こういう芳点で考えようねっおのが提瀺されおおめちゃめちゃ分かりやすかったです。

そしおアクセシビリティ。グラフは難しそうだけどアクセシビリティ・ラベルや支揎機胜を䜿う必芁がありそう。


この蚘事が気に入ったらサポヌトをしおみたせんか