チャートやグラフ図、写真、ビデオ映像などを利用することで、視覚的に情報をつたえることができるビジュアル・コミュニケーション（英: Visual Communication）。
デザインに迷ったときに確認したい、ビジュアル・コミュニケーションにおける基本原則10個をまとめた、インフォグラフィックス「The 10 Commnadments of Visual Communication」が公開されていたので、今回は項目ごとに詳しく見ていきましょう。
配色の決め方にはじまり、タイポグラフィやシェイプ、直線ラインの使い方、機能的な階層の作り方、余白スペースの取り方など、デザインに必要な基本事項がまとめられています。
詳細は以下から。
デザイナーが覚えておきたい、ビジュアルコミュニケーションの基本原則10個まとめ
The 10 Commnadments of Visual Communicationは、デザイン初心者が理想的で、効果的なビジュアルを作成できるポイント10個をまとめています。どの項目も基礎知識ばかりで、覚えておくことでより魅力的なデザインを、手軽に作成する手助けをしてくれます。
基本原則 その１
カラーホイールの使い方を覚えよう。
カラーホイールをうまく組み合わせることで、魅力的な配色カラーパレットを作成することができます。より詳しい内容については、デザイナーが知っておきたい、配色の基本原則10個まとめで触れていますので、こちらも参考にどうぞ。
- 類似色（英: Analogous）: 選択したメインカラーの両隣にある色を加えた、理想的な3色使い。
- 補色（英: Complementary）: 選択した色の反対側にある色との組み合わせ。
- コントラスト（英: Contrast）: 補色を利用したときに、コントラストきつい場合は、両サイドの色を選択。
- 二重補色（英: Double Complementary）: 配色に3色以上を利用するときに便利で、デザイン性を保ったまま色の追加が可能。
- 三角形（英: Triad）: メインカラーを支点として三角形を描いた配色の選び方。
基本原則 その２
利用するタイポグラフィーを選ぼう。
フォントの効果的な組み合わせ方を知ることで、自由にデザインルールを壊し、オリジナル性を演出することができます。現役デザイナーが実践している、フォント組み合わせ10個の黄金ルールでは、より詳しいフォントの組み合わせ方を紹介しています。
- コントラスト: 細字と太字を組み合わせ、コントラストを表現しよう。
- ムード: 雰囲気のあったフォントを利用しよう。
- フォント数: 利用するフォントの数を、２種類に制限しましょう。
- フォントウエイト: フォントの大きさ、ウエイトを調整しよう。
- 注意点: Comic Sasnフォントの利用は避けましょう。
基本原則 その３
シェイプの種類や雰囲気を知ろう。
利用するシェイプによって、それぞれ異なる雰囲気やムードを演出することができます。各シェイプの特長を覚えておくとよいでしょう。
- 三角形: 攻撃的（英: Aggressive）、ダイナミック（英: Dynamic）、方向性（英: Direction）
- 正方形: 安定的（英: Stability）、バランス（英: Balance）、強度（英: Strength）
- 円形: 積極性（英; Positivity）、感情（英: Emotion）、公平（英: Equity）
- 長方形: バランス（英: Balance）、能率的（英: Efficiency）、専門的（英: Professionalism）
- 曲線: 停止（英: Check）、バランス（英: Balance）、動き（英: Motion）
基本原則 その４
階層をうまく利用しよう。
視覚的階層（英: Visual Hierarchy）は、情報やデザイン要素をまとめることができ、メッセージをより伝えやすくしてくれます。より詳しい階層の解説は、こちらのエントリーを参考にどうぞ。
- 各デザイン要素を、三角形に並べよう。
- 黄金比（英: Golden Ratio）を利用しよう。
- 動きをうまく表現しよう。
- 最も注目して欲しい、フォーカルポイントを作成しよう。
- 規則性のある配置を心がけよう。
- デザイン要素をランダムに並べてみよう。
基本原則 その５
ライン線を有効活用しよう。
ラインをうまくデザインに利用することで、適切なムード、雰囲気を作りあげることができます。
- 水平ライン（英: Horizontal）ライン
- 垂直（英: Vertical）ライン
- ひだ状（英: Crimped）ライン
- リズミカルな（英: Rhythmic）ライン
- 末広がり（英: Divergent）ライン
- 移り変わり系（英: Transitional）ライン
基本原則 その６
図形や記号の使い方を学ぼう。
各デザイン要素をどのように加工し、利用することができるのかまとめています。作成しているデザインプロジェクトに応じて、編集方法も変わってくることを理解しておきましょう。
- クリップアート（英: Clip Art）
- 線画（英: Line Drawings）
- アニメーション（英: Animation）
- ラスター（英: Raster）
- イラスト（英: Illustration）
基本原則 その７
コントラストのあるデザインを心がけよう。
デザインにうまくコントラストを加えることで、より分かりやすく、情報を伝えることができるだけでなく、デザイン性の改善にもつながります。コントラストを表現できるテクニックは以下より。
- フォントサイズを調整しよう。
- フォントウエイトを利用し、強調したい単語を太字にしよう。
- 方向（英: Direction）、並べ方にもオリジナリティーを。
- 利用するフォントの形状（英: Form）や種類を検討しよう。
- デザイン全体の構図（英: Structure）にも目を向けよう。
- テクスチャを利用して、デザインの質感をアップしよう。
基本原則 その８
デザイン要素の順番を考えよう。
グリッドレイアウトを利用することで、注目して欲しいデザイン順に並べ、順序を作ってみましょう。利用できるレイアウトは以下よりどうぞ。
- ブロック型グリッド（英: Manuscript Grid）: Block Gridとも呼ばれ、ひとつの大きなグリッドが用意された、もっともシンプルなレイアウト。
- カラム型グリッド（英: Column Grid）: ウェブサイトでよく見かける、複数のカラムに分けられたレイアウト。
- モジュール型グリッド（英: Modular Grid）: カラム型グリッドに複数の水平ラインを追加したレイアウト。
- 階層型グリッドグリッド（英:Hierarchical Grid）: 直感的にフォーカル・ポイントをきめた、ウェブサイトでよく利用されているレイアウト。
- ゆがみ（英: Skewness）: 人工的な曲線を描くことで、注目して欲しいポイントをまとめます。
- 左右、中央揃え: デザインパーツを揃えて配置するテクニックのひとつ。
基本原則 その９
フォントウエイトを利用しよう。
異なるフォントを活用するのではなく、太さに応じて複数のウエイトを収録した、フォント・ファミリーを活用することで、デザインに統一性が生まれるだけでなく、注目ポイントを強調することもできます。フォントの実践的な組み合わせ方については、デザインに迷ったら見直したい、50個の秘訣テクニック完全ガイドを参考にどうぞ。
基本原則 その10
余白スペースを活用しよう。
各デザイン要素にうまく余白スペースを加えることで、デザインをより魅力的に仕上げることができます。さまざまなスペースの作成方法は以下より。
- ポジティブ・スペース（英: Positive Space）: デザイン画などの中心にくる部分。
- ネガティブ・スペース（英: Negative Space）: デザイン画などの背景にあたる空白の部分。
- 立体スペース（英: Perspective Space）: レイヤーを積み重ねることで、立体感を演出します。
- オーバーラップ・スペース（英: Overlapping Space）: 二つ以上のデザインが重なりあった様子。
- スペースなし: デザイン要素をパズルのように、びっしり並べます。
同デザイナーが作成した、配色の基本原則をまとめたインフォグラフィックスにも、目を通しておくと良いかもしれません。
参照元リンク : The 10 Commandments of Visual Communication – Designmantic
