生活の中で気軽に取り入れられるデザイン力アップ3つの方法
こんにちは、デザイン×エンジニアリング×ディレクションをベースに「新しい価値観」を創造するクリエイティブカンパニー、crage(くらげ)株式会社 デザインチームのドリーです。
この文章を読んでいただいているあなたは、デザイナーでしょうか?
それとも、これからデザイナーを目指している方でしょうか?
あるいは全く別の職種でデザインに興味をお持ちの方かもしれませんね。
今回は、Webデザイナーが日々の生活に取り入れている「デザイン力をアップさせる方法」についてお伝えします。
といっても、特別なことではなく、むしろ無意識にやっていることが多いかもしれません。
そんな生活の中で気軽に取り入れられるデザイン力アップの方法を、具体例を挙げながら3つご紹介できればと思います!
【1】 ポストに入ってくるチラシに「こうしませんか」レビュー
毎日のようにポストに投函されるチラシやDMハガキ。
中にはそのままゴミ箱行きのものもあれば、気になるデザインのものもありますよね。
こうしたチラシを眺めながら、心の中で「こうしたらもっと良くなるのにな」とレビューしてみるのはいかがでしょうか?
たとえば、こんな視点です:
「タイトルが小さいな。もっと大きくすると目を引くかも」
「どこにかかってる説明だろう。位置を変えた方が良さそうだな」
「写真の解像度が粗いので、きれいな画像に変えたいな」
「地図のデザインがわかりにくいから、このお店を基準にするといいかも」
ポスティングされたものに対して「勝手にレビュー」するのは、ある意味自由なアウトプットの場。
デザイン的に気になる点を改善案とともに考えることで、自分の引き出しを増やすきっかけにもなります。
ここで具体的にどんな点を見てレビューしているか紹介していきたいと思います!
こちらのチラシに対して「こうしませんか」のレビューをしていきます。
ここで大事なのは、以下の「4原則」を意識することです。
これらの原則を実践することで、単なるレビューがより具体的で学びの多いものになります。
今回は、現在使用しているカラー(ベージュ、緑、白、黒)とフォント(ヒラギノ角ゴシック/ヒラギノ明朝/Allura(数字))をそのまま活かしながら、上記4原則を元にレビューを進めていきます。
・整列:要素を一定の規則に沿って配置する
整列に関しては大きな問題はありません。
ただ、「4つの理由」を区切っている罫線の長さが要素と一致しておらず、レイアウトが少し不安定に見えます。
また、罫線が全体的に多く使われていることで、少し煩雑に感じる部分もあります。
今回は罫線を使わず、背景色を敷いて要素を整列させてみました。
・近接:関係する要素同士を近づける
3枚の写真がありますが、写真が上の4項目に関連しているのか、それとも下の文言に関連しているのか、ぱっと見では分かりにくく、近接がしっかりとされていません。
写真は後者(下の文言)に紐づいているため、写真と下の文言を近づけ、逆に上の4項目とは少し距離を取ることで、全体がより分かりやすくなるかと思います。
このように変更してみました。
・反復:要素を繰り返し、一貫性を持たせる
特に目立った問題点はなく、指摘すべき箇所は見当たりません。
・強弱:情報に優先度(強弱)をつけ視線を誘導する
このスタジオの他社との違いを際立たせ推すために、「4つの理由」の数字を大きくし、色を緑色にして強調しました。
また、その下の1〜4の数字にも連動感を持たせるため、同じく緑色を使用するのが効果的です。
「近接」「整列」「反復」を活用して要素を整理すると、全体が整う反面、情報のコントラストが弱まり、一番伝えたい情報がユーザーの目に止まりにくくなるというデメリットがあります。
そこで「強弱」を使って要素にメリハリをつけ、情報の優先度を直感的に伝えるデザインに仕上げました。
さらに、4原則には含まれていませんが、レイアウトで重要なポイントとして「余白」や「フォント」も挙げられます。
全体のレイアウトにおいて、余白をバランスよく確保することで、図や文字が格段に見やすくなります。
今回、修正前に比べて上下左右の余白を1.5倍ほど広げたことで、要素がよりまとまり、視認性が向上しました。
また、「ヒラギノ角ゴシック」と「ヒラギノ明朝」のフォント使用割合にも変化を加えました。
修正前は「ヒラギノ角ゴシック」の割合が多かったのですが、ヨガのしなやかなイメージを表現するために「ヒラギノ明朝」の割合を増やしたことで、全体的に優しい印象に仕上がったかと思います。
このように、4原則+αを意識するだけで、ちょっとした工夫でデザインを読みやすく改善することができます。ぜひ試してみてください!
【2】 電車の中吊りに『なるほどね』レビュー
crageは出社とリモートのハイブリッド型勤務を採用しており、私も週の半分は電車を使って通勤しています。
電車内で中吊り広告を目にする機会は多く、無意識に情報を得ていることもあるかと思いますが、デザイナーであれば、そのデザインから「なるほどね!」と感じるインプットを得ることが多いのではないでしょうか。
【1】で紹介したチラシのレビューと似ていますが、中吊り広告では「気づき」を得られる点が特徴です。
中吊り広告の特性
中吊り広告は、不特定多数にアピールするために制作されることが多く、特定の年齢層や性別に偏らないデザインが求められます。
また、電車内で一定時間じっくり眺められるため、細かいテキストまで読んでもらえる可能性がある媒体です。
そのため、以下のようなデザイン要素のクオリティが特に重要です:
レイアウト/配色/写真/コピー
これらの要素が高い完成度で組み合わさっているため、学べるポイントが非常に多いのです。
中吊り広告で学べるポイント
例えば、こんな点に気づくことがあります:
キャッチコピーの重要性:読者を惹きつけるための工夫
ジャンプ率のバランス:見出しと本文のサイズ比率が絶妙
文字装飾や色の使い方:強調ポイントが効果的に表現されている
写真の使い方:しずる感(魅力的に見せる演出)を出してメリハリを生む
こうしたデザインの工夫に「なるほどね」と納得しながら、日常的にインプットを得ることができます。
実際に、私たちデザイナーチームのうち3人が帰りの電車が一緒になった際、談笑しつつも全員がそれぞれの視点で中吊り広告を観察してインプットしていた、というエピソードが話題に上がりました。
同じ広告を見ながら「このデザイン、どこが良かったのか」を意見交換することで、新たな気づきや視点を得られる、面白い取り組みになりそうですね。
【3】毎日最低1つ、良いWebサイトと出会う
毎日、新しいWebサイトを探し回るのは大変ですし、わざわざ良いサイトを探しに行く時間がない、という方も多いのではないでしょうか。
もし、PCを開いたときに自然と良いサイトが目に飛び込んでくる仕組みがあれば、効率よく情報収集ができますよね!
そこでおすすめなのが「Muzli」です。
このChrome拡張機能プラグインは、デザインのインスピレーションを得るのに最適なツールで、アートワークやロゴ、イラストなどを簡単に検索できます。
プラグインをインストールすると、Chromeブラウザで新しいタブを開くたびに、最新のデザインインスピレーションやニュースなどがサムネイル形式で表示されます。
自分好みにカスタマイズできるので、よりお好みにあったウェブサイトやデザインブログなどに出会えると思います。
毎朝PCを開いてChromeを立ち上げ、目に飛び込んでくるサムネイルの中から1つクリックするだけで、新しいWebサイトをチェックできるので、手軽で効率的です。
私も日々活用しており、とても便利なのでぜひ試してみてください!
いかがでしたでしょうか。
今回は、デザイン力をアップするための「生活の中で気軽に取り入れられる3つの方法」をご紹介しました。
これらを少しずつ意識して実践することで、日々の中で自然とデザインの引き出しが増えていくはずです。
もう少しステップアップしたい方には、Webサイトレビューやデザイントレースといった手法もおすすめです。少しチャレンジングではありますが、確実に身につく方法です。
先日リリースした 「crageのデザイナーが実践するWebサイトレビューの方法」 では、具体的なWebサイトのレビュー手法をまとめていますので、ぜひ参考にしてみてください!
また、Webサイトトレースについても、私自身が駆け出しの頃に行っていた方法を、後日ご紹介したいと思います。
そして最後に、デザイン展などのイベントに足を運ぶこともお忘れなく。
実物を見て触れることで得られるインスピレーションは格別です。
デザインの楽しさを感じながら、少しずつスキルアップを目指していきましょう!
crageのデザイナーに興味を持った方は、ぜひご連絡お待ちしております!
crageでは現在メンバーになっていただける方を募集中です。
ご興味ある方はぜひエントリーください!
新たな才能、求めています。
\ デザイナーチームページもあります /
\ エントリーはこちらまで /