見出し画像

【イラストレーション編】ユーザーに瞬時に正確に内容や機能を理解させるには?

インプット

今回の範囲は『6. イラストレーションを効果的に使う』です。(『chot.design』を教科書とした講座は今回が最後です。)

ちゃんと読むべきなのは『6-2』『6-4』『6-5』で、
流し読みでOKなのは『6-1』『6-3』です。

重要なこと

◾️ アイコンの役割

「プログラムや機能の役割をすぐ把握できる・アプリケーションやサービスのブランドを認知させる。」これがアイコンの役割です。

例えばインスタですが、アイコンを見ただけで『ここはボタンになっていて、こんな機能が使える』ってことが瞬時に理解できますよね。

WEBデザインでは、アイコンの使用頻度は特に高いです。

画像1

■ グラフの役割

「全体像や数値の推移をすぐに把握できること」という重要な役割を持ちつつも、「見た人に視覚的な美しさを感じさせること」も付加価値として持っているのがグラフです。

伝えたい情報に適したグラフを選ぶ
→ 円グラフや棒グラフ、折線グラフ etc.

シンプルなデザインを心がける
→ 伝えたい情報を絞る。(事業説明資料とかと違い、WEBデザインは瞬時に必要な情報を理解させることが最重要)

色の扱いに注意する
→ 「色は意図しない理解を見た人に与えたり、見た人に負担をかける可能性があるので注意が必要」
例えば、赤色を使用した場合、人は「危険」や「マイナス」を連想します。そのため、適当に「この色でいいや」という思考でいくと、情報とユーザーの認知にギャップが生まれてしまう恐れがあります。

アイコンにおすすめなサイト

◾️Font Awesome

WEBデザインの後にはコーダーがコードを書くわけですが、そこでの相性が良いのも特徴です。アイコンを選ぶ時はまずはコレを使うと良いでしょう。

この記事が気に入ったらサポートをしてみませんか?