2023/08/08より火曜日担当はちふねこさん
2024年6月4日 知ってるだけで差がつく「見やすさ」の作り方 ちふねこさん
見やすさは明度差で作れる。
✅デザインはあくまでビジュアルで伝える手段
ビジュアルというのは目に見えるもの。
イラスト、図、画像、文字など、目に見える情報をまとめて伝える手段というのがデザイン
✅伝わらなかったら意味がない
✅「見やすさ」は、ずばり明度差で作れます！
✅明度差
明るい度合いの差、明るさの差
・黄色は明度が高い色
・青紺色、赤、茶色などの濃い色は明度が低い色
✅明度の低い色、高い色をしっかり使い分けて、
背景と文字の色の差をしっかりつけるのが、見やすさを作る時のポイント
✅明度差をつけることで境界がはっきりするから見やすくなる
✅境界が曖昧だと分かりにくい
【例】音声配信の場合
滑舌悪くて、もごもご喋っててなんて言ってるか分からない状態
✅やってることは簡単ですごくシンプル
背景が明度が高い明るめの色なら、上に載せる文字は暗くする
背景が暗い色の場合は、上に載せる文字は明るくする
✅境界がはっきりするようにしましょう
→ これだけで、「見やすさ」は作れます
✅明度が高い色、低い色というのが、よく分からない場合は、
デザインソフトで「白黒モードに変換する」というのをやってみると掴めやすい
✅注意点（NG例）
文字の加工で簡単にできる「ドロップシャドウ」という影をつける加工
（PowerPoint、Canvaなどに入っている機能）
黒い文字に黒い影つけると、境界が分からなくなる
→ 黒い文字には黒い影落とさない。
明度が低い文字、青、赤、緑などにも黒い影は落とさない。
Claudeさんにまとめてもらいました
デザインにおいて「見やすさ」は非常に重要です。
情報を効果的に伝えるためには、読み手が内容を容易に
読み取れるようにする必要があります。
そこで重要なのが「明度差」です。
【明度差とは】
明度差とは、文字や画像などの要素と背景の明るさ(明度)の違いのことです。
この明度差があることで、要素と背景の境界がはっきりし、見やすくなります。
【見やすいデザインのために】
見やすいデザインを作るには、以下のポイントを意識しましょう。
１．背景と文字の明度差をしっかりとつける
・背景が明るい場合は文字を暗めの色に
・背景が暗い場合は文字を明るい色に
２．文字に影(ドロップシャドウ)をつける際は注意
・文字と同じ暗い色の影をつけると境界が曖昧になり見づらくなる
・明るい文字には暗い影をつけると境界がはっきりし見やすくなる
３．白黒モードで色の明度を確認する
・デザインソフトの白黒モード機能で、色の明度を視覚的に確認できる
デザインの基本は「伝わること」です。明度差を意識することで、
読み手に情報を効果的に伝えられる見やすいデザインを作ることができます。
ぜひ実践してみてください。
知ってるだけで差がつく「見やすさ」の作り方
ありがとうございます！
・デザインはあくまでビジュアルで伝える手段
・伝わらなかったら意味がない
デザインの本質を改めてありがとうございます！
注意点の
明度の低い文字には黒い影落とさない。
黒い文字で経験したことがあります、
見にくくて、なんじゃこりゃってなりました(笑)
「境界」って大事ですね。
明度差、勉強になりました。
今回もありがとうございました！
「フリ校ボイシー火曜日まとめ2024」
「フリ校ボイシー火曜日まとめ2023」もどうぞー