デザイン 4つの基本原則 - ノンデザイナーズ・デザインブックより

代表取締役の鈴木です。

私は、以前デザイナーも経験していたのですが、
25歳頃に読んだ1冊の本が今でもデザインをみる時の重要な視点になっています。
つみきで制作するデザインについても、この視点を意識してクオリティの維持を図っています。

ノンデザイナーズ・デザインブック

デザイナーの方の多くはご存知だと思いますが、
デザイナーでは無い人のためにとても丁寧にわかりやすくデザインについて書かれた本です。
初版1998年のこの本は、2008年にもフルカラーになって今でも受け継がれています。

大事なことは4つ

デザインをする上での基本原則は4つであると言っています。
簡単に説明をすると、

近接 関連するものをまとめること。
整列 全体の配置を整理すること。
反復 繰り返すこと。
コントラスト メリハリ。味付け。

一般名詞で、当たり前といえばそうなのですが、よくよく良いデザインだなあと思うものをみてみると、この4つをきちんと守られています。

参考:カロリーメイトパッケージデザイン

近接 「BALANCED FOOD」「商品名」「BLOCK」商品名と一緒に何の商品かひと目でわかるようまとめています。
整列 箱組みで、「商品情報」を左右余白揃えて、表記しています。意味を伝えるよりも英語表記でデザインを重視していますね。
反復 整列と近いですが、整列された「商品情報」の中で要素ごとに「●」の見出しを入れて、繰り返しています。
コントラスト 黄色の背景に黒の商品名と赤の商品説明で、1番伝えたい事は、色のコントラスト。2番目に黒文字で大きく入れた商品名、という形で整理されています。

参考:UTme! ウェブサイト

近接 アプリダウンロードボタンをまとめる。料金はまとめる。参考ムービーと投稿デザインは、サンプルとしてまとめています。
整列 左揃え、右揃えでボタンとメッセージを整列し、中央に使用イメージを切り替えて表示させています。スッキリしていて、どのボタンも押しやすそうです。
反復 上から、ロゴ、新機能追加情報、アプリDLボタン、3つの要素を同じ行間で繰り返しています。右側に揃えた、メッセージ、サンプルボタン、価格の3つも同様です。繰り返す事で安定してみえます。細かいですが、ピクトグラムが入っているものはボタンであることも共通させることで、理解させやすくなっています。
コントラスト 赤と、白と、黒。1番押してもらいたいのは、唯一黒であるアプリDLボタンであると思われます。

ルールでデザインは強くなる

4つの基本原則を踏まえて、ルールを作りデザインすると、
誰が見ても情報を認識しやすくなり意図がはっきり強くなります。

つみきではデザインを始める前に、「コンセプトシート」を作ることをはじめました。
まずは、商品やブランドについての理解を深めルールを作ります。

コンセプトシートについてはまた改めて。

参考資料

ノンデザイナーズ・デザインブックについて、もっと丁寧にわかりやすくまとめられた記事がありましたのでご紹介します。

スマホアプリ制作、Web制作、UIコンサルなどのご依頼はこちら

お問い合わせ