こんにちは、読むだけでデザインを学べる！デザイン研究所です！
デザイン特化メディアでは国内最大級のTwitterとインスタグラムを運営しています。
2つの要素を対比させた、○○×○○や○○vs○○、○○or○○などの対比に使える2分割のデザイン。分割し、多くの同じ要素を反復させることで作ることができます！
デザインで対比構造を表現する時はかなり多いです。ということで早速みていきましょー！
レイアウトに関してのまとめ記事を作りました。具体的なレイアウトのデザイン例が豊富です。ぜひご覧ください！
デザインにおけるレイアウトのポイントを知ることで圧倒的に作りやすくなります。今回の記事ではそんなレイアウトに関してのデザインポイントを紹介！どんなデザインにもレイアウトは存在します。そんなレイアウトのよくある[…]
2分割のデザインで意識すべきことは2色であること、反復を作ること
こちらが今回のデザインサンプルです。
2分割する場合の定番デザインは2色の色を使うことですね。
サンプルのデザインでは2分割したものには同じ要素(色以外)を与えています。
同じ要素であるのは、
- 写真の色の重ね方(描画モード)
- 対象物の英語(FREELANCEとARTIST)
- 文字のレイアウト(縦文字や斜めの文字など)
- フォントの統一
など反復することで対比構造としています！
ちなみにこちらの記事で使っているデザインサンプルも反復要素があります。
こんにちは、読むだけでデザインを学べる！デザイン研究所です！デザイン特化メディアでは国内最大級のTwitterとインスタグラムを運営しています。今日のテーマ：文字ギリギリの枠で視覚性を高める枠があることで複雑な背景や[…]
多くの要素を反復させ、色などを変更して対比構造を表現する
このように文字のフォントや位置、レイアウトを反復させた中で色などを変更することで1対1の対比構造を表現できます！
上のサンプルでは
- 文字サイズとフォント
- 文字の色(一部分が黒字)
- 黒字を囲む白い長方形
- 白い縦線
- 2分割した中で中央配置
という同じ要素があった上で、色を2色にして対比構造をデザインしてます。
ちなみに上のサンプルデザインでは、同じ要素という文字と、対比構造という文字の下に長方形を配置していますが、このデザインについて詳しく解説してますのでこちらをどうぞ！
こんにちは、読むだけでデザインを学べる！デザイン研究所です！デザイン特化メディアでは国内最大級のTwitterとインスタグラムを運営しています。今日のテーマ：文字ギリギリの枠で視覚性を高める枠があることで複雑な背景や[…]
今回のデザインではどちらのサンプルも左右に縦割りしたデザインですが斜めにして2分割することなどももちろなります。
下の記事でのサンプルデザインは横割りにしたデザインを使っているのでこちらもご覧ください。
こんにちは、読むだけでデザインを学べる！デザイン研究所です！フォローするだけでデザインを学べるTwitterアカウントと毎日デザインのポイントを解説するインスタアカウントを運営しております。こちらのブログはインス[…]
もっと対比構造のポイントを使ったデザインが見たい方！
この記事で解説した対比構造のデザインをもっと見たい方は、、、
デザイン研究所が運営する学べるギャラリーサイト「managary」へどうぞ！
2色で作る対比構造を表す2分割のデザインまとめ
いかがでしたでしょうか？
今回のデザインサンプルのような○○×○○だけでなく○○vs○○や、○○or○○などの対比にも使えます。
ぜひ自分のデザインで使ってみてください！
ちなみにこちらの記事では色について解説しているので合わせてご覧下さい。
こんにちは、読むだけでデザインを学べる！デザイン研究所です！フォローするだけでデザインを学べるTwitterアカウントと毎日デザインのポイントを解説するインスタアカウントを運営しております。こちらのブログはインス[…]
ちなみに多くの色についてのデザイン参考書も読んだことがありますが、
今回の記事のようなデザインの色について書籍で学びたいのなら「配色デザイン良質見本帳」がおすすめです！(なぜならこの本は実例＋解説付きだからです)
他の配色デザインの本はただカラーのパターンが載ってるだけのものが多く、実例のデザインや解説がないのです！
・文字やオブジェクトやレイアウトで多くの要素を反復させること
この投稿をInstagramで見る