デザイン基本4原則:『反復』について

お疲れさまです。Daniel (@daniel__blog) です。

僕は2021年3末、4年続けたインフラエンジニアを退職しました。
そして4月からは、デジハリ超実践コースにてWebデザイナーになるべく学習を進めています。
デザイン基本原則4つのうち『反復』について理解が深まってきたのでメモを残します。

『反復』とは、要素の繰り返し。

英語で言うと、「Repitation(リピテーション)」。
名前のとおり同じデザインルールを適用したパーツを複数回用いることによって、統一感があるように見せることができます。

一貫性」とも言い換えられます。
他のデザイン4原則(近接、整列、コントラスト)と比べ、扱うのが最も難しいと言われています。

繰り返すパーツに関しては、下記の要素などが考えられます。

  • 色(例:リンクURLホバー時、お問い合わせボタンなど)
  • オブジェクトの質感
  • 文字書体(例:丸文字)
  • 写真の色合い
  • アニメーション(例:速度はゆっくり?スピーディ?)

Webサイトでの具体例

うみたび・やまたび|焼津市・川根本町魅力創出連携協議会 事務局
https://umitabi-yamatabi.jp/

上記のサイトで言うと、下記のポイントが反復しているのかなと思います。
あくまで一例です。

  • 反復ポイント①:「うみ」と「やま」のアイコン
  • 反復ポイント②:画像の角丸
  • 反復ポイント③:画像内のフレームスタイル

反復ポイント①:「うみ」と「やま」のアイコン

うみとやまのイラストが複数回使用されています。
形と色で分かりやすく「やま」、「うみ」が表現されてますね。

反復ポイント②:画像の角丸

サイト内で使われている画像については、角丸のスタイルが適用されています。

反復ポイント③:画像内のフレームスタイル

ヘッダーには検索およびSNSアイコンがあります。
それぞれホバーすると、白地に黒色線に変化します。こちらも同じデザインルールが反復されており、統一感が取られていると言えます。

まとめ

というわけで、デザイン4原則「反復」についてでした。

統一感あるサイトにするため、意識していきたいところです。

今回は以上です!
最後までお読み頂き、ありがとうございました!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です