Clean Up Your Mess - A Guide to Visual Design for Everyone

• What is the clean design
  • Clean Designs Reduce the Effort Needed to Find Information
  • 人間の視覚的な認知を利用して, 情報をいかに負荷なく伝えるか
  • それが clean なデザイン
  • Information Needs
  • オーディエンスが求める情報を与えるのが原則
    • Deciding relevance. Do I even care?
    • Getting an overview. What are the main ideas? What’s most important?
    • Basic comprehension. What text explains this chart?
    • Retrieving buried details. I remember something about an orangutan… where was that?
    • Finding actionable details. How do I get in touch?
  • Supporting Visual Thinking
  • visual element の関連性を考慮し, オーディエンスが混乱しないように
  • green と書いてある赤字とか
  • セマンティクスとビジュアル要素の整合性
  • The Most Important Thing to Remember
  • 意図しない違いは避けるということ
  • 論理的に同じ要素は同じように
  • 強調したいところにコントラストをつける
• Size
  • 情報の重要度に応じてコントラストを
  • 同じ内容 (Role) は同じサイズに
  • “what is this about?” や “where is the contact info?”
• Proximity
  • 同じグループは近づける
  • グルーピングは明確に
• Alignment
  • とにかく同じ内容のものはそろえる
  • 中央寄せは, 左・右寄せよりも揃ってないように見える
  • 違う内容のものに違うアラインメントを設定してコントラストを強調できる
  • タイトルはセンター, 本文は左寄せとか
• Elimination
  • 無駄なものは省く. 線とか
• Learning More
  • ビジュアルデザインをみて分析
  • さらにもっと良くできないか考える
  • 可能ならばリデザインしてみる
  • Further reading
  • Universal Principles of Design
  • Non-Designer’s Design Book
  • Don’t Make Me Think
  • Visual Thinking: for Design
  • The Elements of Typographic Style Applied to the Web – a practical guide to web typography
  • An Introduction to the History of Graphic Design

まとめ

普段から意識して見て改善を考えよというのは納得. デザインだけじゃなくてコードでも言える